updates
microformats bio card theme colors now page updates
This commit is contained in:
parent
1dd7a835fe
commit
86200e05ad
14 changed files with 89 additions and 17 deletions
|
@ -4,7 +4,7 @@
|
|||
<title>Shannon Kay (About)</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
<link rel="stylesheet" href="home.css">
|
||||
</head>
|
||||
|
||||
|
|
|
@ -56,7 +56,7 @@
|
|||
|
||||
</div>
|
||||
<script src="https://www.goodreads.com/review/grid_widget/198969.Shannon's%20currently-reading%20book%20montage?cover_size=medium&hide_link=true&hide_title=true&num_books=4&order=d&shelf=currently-reading&sort=date_added&widget_id=1674899180" type="text/javascript" charset="utf-8"></script>
|
||||
|
||||
<p>If there's nothing here, it means I'm between books.</p>
|
||||
</section>
|
||||
|
||||
</section>
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<title>Coffee (Shannon Kay)</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
<link rel="stylesheet" href="../home.css">
|
||||
</head>
|
||||
|
||||
|
|
|
@ -51,7 +51,7 @@
|
|||
<p><a class="link" rel="me" href="https://bookrastinating.com/user/shannonkay"><img class="icon" src="/icons/bookrastinating.png"> BookWyrm @shannonkay@bookrastinating.com</a></p>
|
||||
<p><a href="https://blog.shannonkay.me/books/">Book Blogging on Shannon's Blog</a> <a href="https://blog.shannonkay.me/bookfeed.xml"><i class="fa-solid fa-square-rss"></i></a></p>
|
||||
|
||||
<p><img class="photo" src="ShannonKay2017.jpg" alt="Shannon Kay profile picture. Woman with light brown hair, blue eyes, fair skin." style="max-width:90%; max-height: 400px; border: white solid 5pt;"></p>
|
||||
<p><img class="photo" class="u-photo" src="ShannonKay2017.jpg" alt="Shannon Kay profile picture. Woman with light brown hair, blue eyes, fair skin." style="max-width:90%; max-height: 400px; border: white solid 5pt;"></p>
|
||||
|
||||
</section>
|
||||
|
||||
|
|
28
home.css
28
home.css
|
@ -51,6 +51,16 @@ color: transparent;
|
|||
|
||||
}
|
||||
|
||||
h1 .project-header a, h1 .project-header a:hover, h1 .project-header a:active, h1 .project-header a:visited {
|
||||
background: linear-gradient(183deg, #f9c2cc 10%, #FC8EAC 70%);
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
color: transparent;
|
||||
font-size: 1rem;
|
||||
margin-bottom: 5pt;
|
||||
|
||||
}
|
||||
|
||||
@media screen and (max-width: 428px)
|
||||
{
|
||||
h1 { font-size: 8vw !important; }
|
||||
|
@ -238,6 +248,24 @@ article img {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.bio {
|
||||
background-color: #ffffff;
|
||||
border: 1pt solid #484848;
|
||||
border-radius: 10pt;
|
||||
width: 400px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.bio img {
|
||||
float: left;
|
||||
margin: 5pt;
|
||||
border-radius: 5pt;
|
||||
max-width: auto;
|
||||
max-height: 200px;
|
||||
}
|
||||
|
||||
.updated {
|
||||
font-size: 1rem;
|
||||
color: #484848;
|
||||
|
|
|
@ -4,12 +4,13 @@
|
|||
<title>Classic Homepage Project</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="../home.css">
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<h1><a href="../index.html">Shannon Kay</a></h1>
|
||||
<h1 class="project-header"><a href="../index.html">Shannon Kay</a></h1>
|
||||
<h2>Classic Homepage Project</h2>
|
||||
</header>
|
||||
|
||||
|
@ -29,6 +30,8 @@
|
|||
<h3 id="my-website-story">My Website Story</h3>
|
||||
<p>I'm an "early Millennial". My first websites were homepages with rainbow dividers. In 1995, when I was 12, my dad bought me a book called <a href="https://openlibrary.org/books/OL822310M/Internet_and_World_Wide_Web_simplified">Internet and World Wide Web, Simplified</a>. That's how I learned how the internet worked, and that I should pronounce GIF "like the peanut butter".</p>
|
||||
<p>My first websites were free homepages. The first was on a website called <a href="http://web.archive.org/web/19970628183245/http://www.tool-box.com/">tool-box </a>which didn't last long and I've never heard anyone else mention. I think it only existed in 1996/97. I moved on to other free hosts like Angelfire, and moved from using the basic form page editors to learning basic html. But the real magic happened after I saw the movie Titanic in January of 1998. I loved it so much, I made a Titanic website called Titanic Crazy. My first fansite! </p>
|
||||
<p>Working on my Titanic website is what really led to my learning more about making websites and how the internet worked. Soon I was making websites for all of my friends. I even got to redesign the website for my high school theatre department. </p>
|
||||
<p>For my sixteenth birthday, I asked for a domain name. I got my first domain name, <strong>shannonkay.com</strong>, in 1999 as a present for my 16th birthday. </p>
|
||||
|
||||
<h3>Links</h3>
|
||||
<ul>
|
||||
|
@ -38,14 +41,27 @@
|
|||
<li><a href="https://localghost.dev/blog/building-a-website-like-it-s-1999-in-2022">Building a website like it's 1999... in 2022</a></li>
|
||||
</ul>
|
||||
|
||||
<section id="homepage-resources">
|
||||
<h3 id="how-can-i-make-a-homepage-in-2023">How can I make a homepage in 2023?</h3>
|
||||
<ul>
|
||||
<li><a href="https://neocities.org">Neocities</a> - "Neocities is a social network of websites that are bringing back the lost individual creativity of the web. We offer free static web hosting and tools that allow you to create your own web site."</li>
|
||||
<li><a href="https://mmm.page">Mmm.page</a> - Unique freeform webpage creator. </li>
|
||||
<li><a href="https://wordpress.com">Wordpress.com</a>- Technically a blog, but you can make any site with it.</li>
|
||||
</ul>
|
||||
<h4>Advanced free hosting</h4>
|
||||
<ul>
|
||||
<li><a href="https://pages.github.com">GitHub Pages</a> - Websites for you and your projects</li>
|
||||
<li><a href="https://www.netlify.com">Netlify</a> - Has a starter free tier</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
</article>
|
||||
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<p>Created: August 21, 2021. Updated: January 12, 2023</p>
|
||||
<a href="index.html">Shannon's Homepage</a>
|
||||
<p class="updated">Created: August 21, 2021. Updated: March 26, 2023</p>
|
||||
<a href="../index.html">Shannon's Homepage</a>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
|
|
31
index.html
31
index.html
|
@ -48,6 +48,17 @@
|
|||
</picture>
|
||||
|
||||
</p>
|
||||
|
||||
<section id="webrings">
|
||||
<p>
|
||||
<a href="https://hotlinewebring.club/shannonkay/previous"><i class="fa-solid fa-arrow-left"></i></a> <a href="https://hotlinewebring.club">Hotline Webring</a> <a href="https://hotlinewebring.club/shannonkay/next"><i class="fa-solid fa-arrow-right"></i></a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://xn--sr8hvo.ws/%F0%9F%93%95%F0%9F%94%9F%F0%9F%99%85/previous">←</a>
|
||||
An <a href="https://xn--sr8hvo.ws">IndieWeb Webring</a> 🕸💍
|
||||
<a href="https://xn--sr8hvo.ws/%F0%9F%93%95%F0%9F%94%9F%F0%9F%99%85/next">→</a>
|
||||
</p>
|
||||
</section>
|
||||
<section class="social-icons" id="follow-icons">
|
||||
<a rel="me" href="https://bookstodon.com/@shannonkay"><i class="fa-brands fa-mastodon"></i></a>
|
||||
<a href="https://instagram.com/shannonkay"><i class="fa-brands fa-instagram"></i></a>
|
||||
|
@ -58,8 +69,6 @@
|
|||
|
||||
</section>
|
||||
|
||||
</section>
|
||||
|
||||
<hr>
|
||||
|
||||
<p><img src="emoji/minniebow.png" alt="Minnie Bow"> <img src="emoji/dolewhip.png" alt="Dole Whip Emoji"> <img src="emoji/princesshatemoji.png" alt="Princess Hat"> <img src="emoji/spacemountain.png" alt="space mountain"></p>
|
||||
|
@ -72,8 +81,23 @@
|
|||
alt="Beauty and the Beast reading scene" />
|
||||
</picture>
|
||||
</p>
|
||||
<section class="bio">
|
||||
<span class="h-card">
|
||||
<img class="u-photo" src="ShannonKay2017.jpg" >
|
||||
<p><a href="https://www.shannonkay.com" class="u-url u-uid p-name">Shannon Kay</a></p>
|
||||
<p class="p-note">
|
||||
I'm a Californian early millennial, mom of 3.
|
||||
|
||||
I love books, coffee, tech, and making things pink.
|
||||
</p>
|
||||
<p><abbr class="p-region" title="California">CA</abbr> <a rel="me" href="https://bookstodon.com/@shannonkay" class="u-url"><i class="fa-brands fa-mastodon"></i></a></p>
|
||||
|
||||
</span>
|
||||
</section>
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
<p></p>
|
||||
</main>
|
||||
<footer>
|
||||
<hr>
|
||||
|
@ -81,6 +105,7 @@
|
|||
<p class="updated">Updated March 26, 2023</p>
|
||||
<p>Created August 15, 2021</p>
|
||||
|
||||
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<title>Links</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
<link rel="stylesheet" href="../home.css">
|
||||
</head>
|
||||
|
||||
|
|
1
me.html
1
me.html
|
@ -6,6 +6,7 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="home.css">
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<title>Index Page</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
<link rel="stylesheet" href="../home.css">
|
||||
</head>
|
||||
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<title>Shannon Kay (Now)</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
<link rel="stylesheet" href="../home.css">
|
||||
</head>
|
||||
|
||||
|
@ -58,7 +58,7 @@
|
|||
|
||||
</div>
|
||||
<script src="https://www.goodreads.com/review/grid_widget/198969.Shannon's%20currently-reading%20book%20montage?cover_size=medium&hide_link=true&hide_title=true&num_books=4&order=d&shelf=currently-reading&sort=date_added&widget_id=1674899180" type="text/javascript" charset="utf-8"></script>
|
||||
|
||||
<p>If there's nothing here, it means I'm between books.</p>
|
||||
</section>
|
||||
|
||||
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
<head>
|
||||
<title>Apple II Plus</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
<link rel="stylesheet" href="../home.css">
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
<head>
|
||||
<title>Shannon Kay /Projects</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
<link rel="stylesheet" href="../home.css">
|
||||
</head>
|
||||
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<title>Shannon Kay Uses</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<meta name="theme-color" content="#f9dee1">
|
||||
<link rel="stylesheet" href="home.css">
|
||||
</head>
|
||||
|
||||
|
|
Loading…
Reference in a new issue