pages/about-pages/15-Sunlit-Memories

1683 lines
50 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!-----------------------------------------------------------------------
About Page [13]: Sunlit Memories
Made by glenthemes
Initial release: 2019/11/30
Last updated: 2021/10/21
TERMS OF USE:
1) Do not remove the page credit.
2) Do not repost/redistribute my themes.
3) Do not take parts of the code and use it as your own.
4) Do not use my themes as a base code.
5) Do not mix my themes together.
Customization Pointers - legend:
🌱🌱🌱🌱🌱🌱🌱 = start of a section
🔽🔽🔽🔽🔽🔽🔽 = content goes in the following line(s)
🛑🛑🛑🛑🛑🛑🛑 = end of a section
Guide:
docs.google.com/document/d/1t39N5h5aeC3ifhL1aJ32wrQHuxDsyUhM83YwXbDZhP4/edit?usp=sharing
[ DISCLAIMER ]-----------------------------------------
The design of this page belongs entirely to ConcernedApe in their making of Stardew Valley. I replicated their design in CSS & HTML for leisure. This page is released for non-commercial purposes.
[ CREDITS ]--------------------------------------------
Navlinks icon SVGs by freekpik @ flaticon:
- flaticon.com/free-icon/home_465328
- flaticon.com/free-icon/happy_408197
- flaticon.com/free-icon/calendar_465375
Images:
- title box small image by Moonlight-pendent13 @ DA
deviantart.com/moonlight-pendent13/art/Tiny-plants-FTU-659975030
- bio box bullet icon by GentleLark @ DA
deviantart.com/gentlelark/art/Feather-478425861
- bio box fall leaf divider by GentleLark @ DA
deviantart.com/gentlelark/art/Fall-Leaf-Divider-F2U-572312728
- sidebar image by King-Lulu-Deer @ DA
deviantart.com/king-lulu-deer/art/Pumpkin-Spice-And-Everything-Nice-743916387
- custom links images from Stardew Valley by ConcernedApe
Music:
- "Fall (The Smell of Mushroom)" by ConcernedApe
Fonts:
- Stardew Valley font by ConcernedApe
- Aseprite interface font by David Capello
community.aseprite.org/t/aseprite-interface-font/971/9
Cursors:
- default cursor, help, hand
- deviantart.com/endertale-asriel/art/Stardew-Valley-Cursors-for-Windows-766897740
Background pattern:
- crazykira, ixora, (gyapo)
gyapo.tumblr.com/post/17773292758/
------------------------------------------------------------------------>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="//www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<!--------------------JAVASCRIPTS-------------------->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
<script>
(function($){
$(document).ready(function(){
$("a[title]").style_my_tooltips({
tip_follows_cursor:true,
tip_delay_time:0,
tip_fade_speed:50,
attribute:"title"
});
});
})(jQuery);
</script>
<script src="//static.tumblr.com/2pnwama/DLppehqvd/feathericons.js"></script>
<link href="//gt-sunlit-memories.glitch.me/navlinks.css" rel="stylesheet">
<link href="//gt-sunlit-memories.glitch.me/boxes.css" rel="stylesheet">
<script src="//gt-sunlit-memories.glitch.me/statustab.js"></script>
<link href="//gt-sunlit-memories.glitch.me/statustab.css" rel="stylesheet">
<link href="//gt-sunlit-memories.glitch.me/energybar.css" rel="stylesheet">
<script src="//glenthemes.github.io/-music-/glenplayer06.js"></script>
<script>
$(document).ready(function(){
$("img").each(function(){
if ($(this).attr("src") == "//cdn.discordapp.com/attachments/900692000364445736/900751576468176947/Moonlight-pendent13_TinyPlants.png"){
$(this).wrap("<a title='art by Moonlight-pendent13 - DeviantArt'></a>");
}
if ($(this).attr("src") == "//cdn.discordapp.com/attachments/900692000364445736/900751789396230224/GentleLark_FallLeafDivider.png"){
$(this).wrap("<a title='art by GentleLark - DeviantArt'></a>");
}
if ($(this).attr("src") == "//cdn.discordapp.com/attachments/900692000364445736/900751947345326120/King-Lulu-Deer_PumpkinSpiceAndEverythingNice.gif"){
$(this).wrap("<a title='art by King-Lulu-Deer - DeviantArt'></a>");
}
});
$(".navicon-home").load("//gt-sunlit-memories.glitch.me/home-svg.htm");
$(".navicon-ask").load("//gt-sunlit-memories.glitch.me/happy.html");
$(".navicon-archive").load("//gt-sunlit-memories.glitch.me/calendar-svg.htm");
$(".navicon-theme").load("//gt-sunlit-memories.glitch.me/glenjamin-e.html");
});//end ready
$(window).load(function(){
$(".bio-box .box-text").css("height","auto");
$(".bio-box .box-text").css("visibility","visible");
});
</script>
<!-------------------------------------------------------------------->
<style type="text/css">
@font-face { font-family: "consolas-alt"; src: url('//glen-assets.github.io/fonts/consolas.TTF'); }
@font-face { font-family: "sdv"; src: url('//glen-assets.github.io/fonts/stardew-valley.ttf'); }
@font-face { font-family: "aseprite"; src: url('//glen-assets.github.io/fonts/AsepriteFont.ttf'); }
/*--------------------TOOLTIPS--------------------*/
#s-m-t-tooltip {
margin:22px;
padding:1px 10px 3px 10px;
background-image:linear-gradient(to bottom, var(--TextBox-Background-Gradient-1), var(--TextBox-Background-Gradient-2));
border-style:ridge;
border-width:var(--TextBox-Border-Size);
border-top-color:var(--TextBox-Border-Main-1);
border-right-color:var(--TextBox-Border-Medium-2);
border-bottom-color:var(--TextBox-Border-Medium-1);
border-left-color:var(--TextBox-Border-Main-2);
font-family:aseprite;
font-size:19px;
letter-spacing:0.3px;
color:var(--TextBox-Text-Color);
text-shadow:-1px 1px 1px var(--TextBox-Text-Shadow);
line-height:1.3em;
z-index:99;
max-width:36vw;
}
/*--------------------TUMBLR CONTROLS--------------------*/
iframe#tumblr_controls, .iframe-controls--desktop {
top:5px!important;
right:5px!important;
position:fixed!important;
transform:scale(0.7,0.7);
-webkit-transform:scale(0.7,0.7);
-moz-transform:scale(0.7,0.7);
-o-transform:scale(0.7,0.7);
-ms-transform:scale(0.7,0.7);
transform-origin:100% 0;
-webkit-transform-origin:100% 0;
-moz-transform-origin:100% 0;
-o-transform-origin:100% 0;
-ms-transform-origin:100% 0;
z-index:999999!important;
}
/*--------------------TEXT HIGHLIGHT--------------------*/
::selection {
background:#BBD3FD;
}
::-moz-selection {
background:#BBD3FD;
}
/*--------------------BASICS--------------------*/
body {
background:#F5E8D8 url('//66.media.tumblr.com/tumblr_lzju29VxIR1r9g6hvo1_250.png');
background-attachment:fixed;
background-repeat:repeat;
color:#000;
cursor:normal;
font-family:consolas-alt;
line-height:1.6em;
font-size:12px;
text-align:left;
}
body {
cursor: url("//cdn.discordapp.com/attachments/900692000364445736/900754679267475486/Stardew-Valley-Cursor.png"), auto;
}
a, .music-controls {
cursor: url("//cdn.discordapp.com/attachments/900692000364445736/900754739732574329/Stardew-Valley-Hand.png"), auto;
}
a[title]:not([href]) {
cursor: url("//cdn.discordapp.com/attachments/900692000364445736/900754782904524840/Stardew-Valley-Cursor-Help.png"), auto;
}
blockquote {
padding-left:10px;
margin-left:5px;
border-left:1px solid;
border-color:var(--TextBox-Text-Color);
margin:10px;
}
a {
color:var(--TextBox-Link-Color);
text-decoration:none;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
}
b, strong {
font-weight:bold;
}
i, em {color:;}
pre, code {
white-space:pre-wrap;
display:block;
}
hr {
width:70%;
border-width:0px;
height:1px;
background-color:var(--TextBox-Text-Color);
}
img, span {vertical-align:middle;}
/*---------- COLORS & POSITIONING ---------- */
:root {
/* ----- NAV LINKS ----- */
--Nav-Links-Top-Position:30px;
--Nav-Links-Left-Position:30px;
--Nav-Links-Background:#dc7b05;
--Nav-Links-Border-Dark:#5b2b2a;
--Nav-Links-Border-Medium-1:#853605;
--Nav-Links-Border-Medium-2:#b14e05;
--Nav-Links-Border-Light:#f7ba00;
--Nav-Links-Border-Size:2px;
--Nav-Links-Icon-Size:25px;
--Nav-Links-Icon-Color:#5b2b2a;
--Nav-Links-Icon-Padding:3px;
--Nav-Links-Gap:9px;
/* ----- MAIN GRID ----- */
--Main-Grid-Gaps-Vertical:14px;
--Main-Grid-Gaps-Sides:20px;
/* ----- BOXES ----- */
--Left-TextBoxes-Width:388px;
--TextBox-Border-Main-1:#fb9e00;
--TextBox-Border-Main-2:#e08700;
--TextBox-Border-Dark:#5b2b2a;
--TextBox-Border-Medium-1:#903e01;
--TextBox-Border-Medium-2:#ba5901;
--TextBox-Border-Light:#f7ba00;
--TextBox-Border-Shadow:#cb8652;
--TextBox-Border-Size:3px;
--TextBox-Background:#ffcd82;
--TextBox-Background-Gradient-1:#ffcd82;
--TextBox-Background-Gradient-2:#eeb272;
--TextBox-Text-Vertical-Padding:12px;
--TextBox-Text-Side-Padding:15px;
--TextBox-Text-Color:#000;
--TextBox-Text-Shadow:#d7864f;
--TextBox-Link-Color:#a5682a;
/* ----- TITLE BOX ----- */
--TitleBox-Text-Font-Size:18px;
--TitleBox-Text-Line-Height:1em;
/* ----- BIO BOX ----- */
--Bio-Box-Font-Size:21px;
--Bio-Box-Line-Height:1.1em;
--Bio-Box-Maximum-Height:auto;
--Scrollbar-Thumb:transparent;
/* ----- SIDEBAR BOXES ----- */
--Sidebar-Width:120px;
--Music-Controls-Size:12px;
--Music-Title-Font-Size:15px;
--Sidebar-Image-Width:85px;
--Desc-Box-Font-Size:17px;
--Desc-Box-Line-Height:1.25em;
/* ----- CUSTOM LINKS ----- */
--Custom-Links-Box-Width:552px;
--Custom-Links-Icons-Size:40px;
--Custom-Links-Icons-Padding:6px;
/* ----- STATUS TAB ----- */
--StatusTab-Bottom-Position:25px;
--StatusTab-Left-Position:25px;
--StatusTab-Borders-Size:3px; /* looks best with 3px-5px */
--StatusTab-Border-Dark:#5b2c26;
--StatusTab-Border-Medium:#b24d05;
--StatusTab-Border-Light:#db7c0e;
--StatusTab-Border-Shadow:#d7864f;
--StatusTab-Icon-Background:#ffd285;
--StatusTab-Icon-Border:#fff0ba;
--StatusTab-Image-Padding:5px;
--StatusTab-Image-Size:39px;
--StatusTab-Image-URL: //stardewvalleywiki.com/mediawiki/images/9/9d/Cranberry_Candy.png;
--StatusTab-Text-Background:#ffd285;
--StatusTab-Font-Size:16px;
--StatusTab-Text-Color:#000;
--StatusTab-Text-Shadow:#d7864f;
--StatusTab-Text:Cranberry Candy;
/* ----- ENERGY BAR ----- */
--EnergyBar-Bottom-Position:25px;
--EnergyBar-Right-Position:25px;
--EnergyBar-Border-Main:#dc7b05;
--EnergyBar-Border-Dark:#5b2b2a;
--EnergyBar-Border-Medium-1:#853605;
--EnergyBar-Border-Medium-2:#b14e05;
--EnergyBar-Border-Light:#f7ba00;
--EnergyBar-Border-Shadow:#D7864F;
--EnergyBar-Border-Size:2.5px;
--EnergyBar-Icon-Size:20px;
--EnergyBar-Icon-Padding:0px;
--EnergyBar-Maximum-Height:155px;
--EnergyBar-Width:15px;
--EnergyBar-Bar-Empty:#ffd782;
--EnergyBar-Bar-Line:#B4730C;
--EnergyBar-Bar-Fill:#FCA907;
--EnergyBar-Fill-Meter:36%;
}
/*---------- NAVLINKS ---------- */
#navlinks {
position:fixed;
top:0;margin-top:var(--Nav-Links-Top-Position);
left:0;margin-left:var(--Nav-Links-Top-Position);
z-index:2;
}
.navlink {
margin-bottom:var(--Nav-Links-Gap);
}
.navlink a {
display:inline-block;
width:100%;
height:100%;
}
.imgwarp {
width:calc(var(--Nav-Links-Icon-Size) + (var(--Nav-Links-Border-Size) * 4));
height:var(--Nav-Links-Icon-Size);
background:var(--Nav-Links-Background);
border-left:var(--Nav-Links-Border-Size) solid var(--Nav-Links-Border-Dark);
border-right:var(--Nav-Links-Border-Size) solid var(--Nav-Links-Border-Dark);
text-align:center;
}
.navicon.svg {
display:inline-block;
width:var(--Nav-Links-Icon-Size);
height:var(--Nav-Links-Icon-Size);
padding:var(--Nav-Links-Icon-Padding);
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
text-align:center;
}
.navicon svg {
fill:var(--Nav-Links-Icon-Color);
width:100%;
height:100%;
}
.navicon-theme svg {
filter:brightness(65%);
-webkit-filter:brightness(65%);
}
.navicon.img img {
width:var(--Nav-Links-Icon-Size);
height:var(--Nav-Links-Icon-Size);
padding:var(--Nav-Links-Icon-Padding);
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
}
/*---------- STATUS TAB ---------- */
#status-tab {
position:fixed;
bottom:0;margin-bottom:var(--StatusTab-Bottom-Position);
left:0;margin-left:var(--StatusTab-Left-Position);
display:flex;
align-items:center;
}
.icon-image {
width:var(--StatusTab-Image-Size);
height:var(--StatusTab-Image-Size);
padding:var(--StatusTab-Image-Padding);
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
}
.the-text {
margin-top:-2px; /* text top gap offset */
line-height:1.2em;
font-family:sdv;
font-size:var(--StatusTab-Font-Size);
letter-spacing:0.7px;
text-shadow:-1px 1px 1px var(--StatusTab-Text-Shadow);
color:var(--StatusTab-Text-Color);
}
/*---------- ENERGY BAR ---------- */
#energybar {
position:fixed;
bottom:0;margin-bottom:var(--EnergyBar-Bottom-Position);
right:0;margin-right:var(--EnergyBar-Right-Position);
z-index:2;
}
.energyicon {
margin-top:calc(var(--EnergyBar-Border-Size) * -0.75);
}
.energyicon.img img {
width:var(--EnergyBar-Icon-Size);
height:var(--EnergyBar-Icon-Size);
padding:var(--EnergyBar-Icon-Padding);
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
}
.energyicon.svg {
display:inline-block;
width:var(--EnergyBar-Icon-Size);
height:var(--EnergyBar-Icon-Size);
padding:var(--EnergyBar-Icon-Padding);
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
text-align:center;
}
.energyicon svg {
}
.energybar-fill {
position:absolute;
bottom:0;
width:100%;
height:var(--EnergyBar-Fill-Meter);
background:var(--EnergyBar-Bar-Fill);
border-top:var(--EnergyBar-Border-Size) solid var(--EnergyBar-Bar-Line);
}
/*---------- BOXES ---------- */
.hholder {
background-image:linear-gradient(to bottom, var(--TextBox-Background-Gradient-1), var(--TextBox-Background-Gradient-2));
border-right:calc(var(--TextBox-Border-Size) * 2) solid var(--TextBox-Border-Shadow);
}
.box-text {
margin-top:-3px; /* text top gap offset */
width:100%;
padding:var(--TextBox-Text-Vertical-Padding) var(--TextBox-Text-Side-Padding);
color:var(--TextBox-Text-Color);
text-shadow:-1px 1px 1px var(--TextBox-Text-Shadow);
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
}
.title-box .intro-img {
margin-top:-2.5px;
margin-right:calc(var(--TextBox-Text-Side-Padding) * 0.75);
max-height:23px;
}
.title-box .box-text {
font-family:sdv;
letter-spacing:0.7px;
font-size:var(--TitleBox-Text-Font-Size);
line-height:var(--TitleBox-Line-Height);
}
.box-text a {
color:var(--TextBox-Link-Color);
}
.box-text li {
list-style-image:url("//cdn.discordapp.com/attachments/900692000364445736/900754854870388756/GentleLark_Feather.png");
}
.box-text li > span {
display:inline-block;
margin-left:3px;
vertical-align:top;
margin-top:-4px;
}
/*---------- BIO BOX ---------- */
.bio-box .box-text {
margin-top:0px;
font-family:aseprite;
font-size:var(--Bio-Box-Font-Size);
letter-spacing:0.3px;
line-height:var(--Bio-Box-Line-Height);
max-height:var(--Bio-Box-Maximum-Height);
overflow-y:auto;
height:0;
visibility:hidden;
}
.bio-box .box-text::-webkit-scrollbar {
width:var(--TextBox-Border-Size);
height:var(--TextBox-Border-Size);
background-color:var(--Scrollbar-Background);
}
.bio-box .box-text::-webkit-scrollbar-thumb {
background-color:var(--Scrollbar-Thumb);
}
.divider {
display:table;
margin:10px auto;
}
.divider img {
margin-top:3px;
}
/*---------- SIDEBAR BOXES ---------- */
/*---------- MUSIC BOX ---------- */
.musicrack {
display:flex;
align-items:center;
}
.music-controls {
width:var(--Music-Controls-Size);
overflow:hidden;
}
.music-controls svg {
width:var(--Music-Controls-Size);
height:var(--Music-Controls-Size);
color:var(--TextBox-Text-Color);
stroke-width:1.5px;
}
.pausee {display:none;}
.beff {display:none;}
.aff {display:block;}
.music-title {
margin-left:6px;
font-size:var(--Music-Title-Font-Size);
color:var(--TextBox-Text-Color);
}
/*---------- SIDEBAR IMAGE ---------- */
.sidebar-image-box {
margin:var(--Main-Grid-Gaps-Vertical) auto;
}
.imgcont {
display:flex;
align-items:center;
justify-content:center;
height:calc(var(--Sidebar-Width) - (var(--TextBox-Border-Size) * 2));
}
.sidebar-image {
width:var(--Sidebar-Image-Width);
}
/*---------- DESC BOX ---------- */
.desc-box .box-text {
font-family:sdv;
letter-spacing:0.7px;
font-size:var(--Desc-Box-Font-Size);
line-height:var(--Desc-Box-Line-Height);
text-align:center;
}
/*---------- CUSTOM LINKS ---------- */
.links-box {
margin-top:var(--Main-Grid-Gaps-Vertical);
}
.links-box .confusion::after {
content:"";
position:absolute;
margin-top:var(--TextBox-Border-Size);
right:0;margin-right:calc(var(--TextBox-Border-Size) * 2);
width:var(--TextBox-Border-Size);
height:var(--TextBox-Border-Size);
background:var(--TextBox-Border-Shadow);
z-index:3;
}
.wine {
margin-top:calc(var(--TextBox-Border-Size) * -1);
flex-wrap:wrap;
width:calc(100% + (var(--TextBox-Border-Size) * 2));
}
.tofu {
position:relative;
width:var(--Custom-Links-Icons-Size);
height:var(--Custom-Links-Icons-Size);
border-style:ridge;
border-width:var(--TextBox-Border-Size);
border-top-color:transparent;
border-right-color:var(--TextBox-Border-Shadow);
border-bottom-color:var(--TextBox-Border-Main-1);
border-left-color:transparent;
}
.tofu a {
display:inline-block;
width:100%;
height:100%;
}
.tofu-img {
display:flex;
align-items:center;
justify-content:center;
margin-left:calc(var(--TextBox-Border-Size) * -1);
}
.customlink-image {
width:100%;
padding:var(--Custom-Links-Icons-Padding);
box-sizing:border-box;
}
</style>
</head>
<body>
<!------- NAV LINKS ------->
<div id="navlinks">
<!---- START ONE NAV LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="navlink">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="return home">
<div class="nutbar"></div>
<div class="crispalou"></div>
<div class="fruitrack">
<div class="nut"></div>
<div class="papaya"></div>
<div class="nut"></div>
</div><!--fruitrack-->
<div class="imgwarp">
<div class="navicon svg">
<div class="navicon-home"></div>
</div><!--navicon-->
</div><!--imgwarp-->
<div class="fruitrack">
<div class="darknut"></div>
<div class="darkpapaya"></div>
<div class="darknut"></div>
</div><!--fruitrack-->
<div class="fruitrack yaku">
<div class="darknut"></div>
<div class="yakult"></div>
<div class="darknut"></div>
</div><!--fruitrack-->
<div class="nutbar dark"></div>
</a>
</div><!--navlink-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE NAV LINK ---->
<!---- START ONE NAV LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="navlink">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/ask" title="send mail">
<div class="nutbar"></div>
<div class="crispalou"></div>
<div class="fruitrack">
<div class="nut"></div>
<div class="papaya"></div>
<div class="nut"></div>
</div><!--fruitrack-->
<div class="imgwarp">
<div class="navicon svg">
<div class="navicon-ask"></div>
</div><!--navicon-->
</div><!--imgwarp-->
<div class="fruitrack">
<div class="darknut"></div>
<div class="darkpapaya"></div>
<div class="darknut"></div>
</div><!--fruitrack-->
<div class="fruitrack yaku">
<div class="darknut"></div>
<div class="yakult"></div>
<div class="darknut"></div>
</div><!--fruitrack-->
<div class="nutbar dark"></div>
</a>
</div><!--navlink-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE NAV LINK ---->
<!---- START ONE NAV LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="navlink">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/archive" title="visit archive">
<div class="nutbar"></div>
<div class="crispalou"></div>
<div class="fruitrack">
<div class="nut"></div>
<div class="papaya"></div>
<div class="nut"></div>
</div><!--fruitrack-->
<div class="imgwarp">
<div class="navicon svg">
<div class="navicon-archive"></div>
</div><!--navicon-->
</div><!--imgwarp-->
<div class="fruitrack">
<div class="darknut"></div>
<div class="darkpapaya"></div>
<div class="darknut"></div>
</div><!--fruitrack-->
<div class="fruitrack yaku">
<div class="darknut"></div>
<div class="yakult"></div>
<div class="darknut"></div>
</div><!--fruitrack-->
<div class="nutbar dark"></div>
</a>
</div><!--navlink-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE NAV LINK ---->
<!---- START ONE NAV LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="navlink">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="//glenthemes.tumblr.com" title="coded by glenthemes">
<div class="nutbar"></div>
<div class="crispalou"></div>
<div class="fruitrack">
<div class="nut"></div>
<div class="papaya"></div>
<div class="nut"></div>
</div><!--fruitrack-->
<div class="imgwarp">
<div class="navicon svg">
<div class="navicon-theme"></div>
</div><!--navicon-->
</div><!--imgwarp-->
<div class="fruitrack">
<div class="darknut"></div>
<div class="darkpapaya"></div>
<div class="darknut"></div>
</div><!--fruitrack-->
<div class="fruitrack yaku">
<div class="darknut"></div>
<div class="yakult"></div>
<div class="darknut"></div>
</div><!--fruitrack-->
<div class="nutbar dark"></div>
</a>
</div><!--navlink-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE NAV LINK ---->
</div><!--navlinks--><!--do not delete this line-->
<!------- MAIN GRID ------->
<div id="quois-a">
<div id="quois-b">
<div id="quois-c">
<div id="quois-d">
<div id="quois-grid">
<div id="quois-left">
<!---- START TITLE BOX ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="title-box">
<div class="soup"></div>
<div class="fruitrack">
<div class="maple"></div>
<div class="syrup"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="kami"></div>
<div class="nari"></div>
<div class="denki"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="skele">
<div class="cola"></div>
<div class="cotton"></div>
<div class="cola"></div>
</div>
<div class="freme">
<div class="confusion"></div>
<div class="mycabbages"></div>
<div class="hholder">
<div class="box-text">
<!-- small left image -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="intro-img" src="//cdn.discordapp.com/attachments/900692000364445736/900751576468176947/Moonlight-pendent13_TinyPlants.png">
<!-- title box title -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<span>—; sunlit memories</span>
</div><!--do not delete this line-->
</div>
</div><!--freme-->
<div class="skele">
<div class="booze"></div>
<div class="soda"></div>
<div class="ale"></div>
</div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="bread"></div>
<div class="heavens"></div>
<div class="qoo"></div>
</div><!--fruitrack-->
<div class="mojito"></div>
<div class="soup"></div>
</div><!--title-box-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END TITLE BOX ---->
<!---- START BIO BOX ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="bio-box">
<div class="soup"></div>
<div class="fruitrack">
<div class="maple"></div>
<div class="syrup"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="kami"></div>
<div class="nari"></div>
<div class="denki"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="skele">
<div class="cola"></div>
<div class="cotton"></div>
<div class="cola"></div>
</div>
<div class="freme">
<div class="confusion"></div>
<div class="mycabbages"></div>
<div class="hholder">
<div class="box-text">
<!-- bio box text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<li><span>HT, they/them, 21/05/1998, INFP</span>
<li><span>visual artist, digital designer, web developer</span>
<li><span>female protagonists; 100% fish in RPGs</span>
<div class="divider">
<img src="//cdn.discordapp.com/attachments/900692000364445736/900751789396230224/GentleLark_FallLeafDivider.png">
</div><!--end divider-->
<center>
It was November the <a title="quote by L.M. Montgomery">month</a> of crimson sunsets, parting birds, deep, sad hymns of the sea, passionate wind-songs in the pines.
</center>
</div><!--end box text--><!--do not delete this line-->
</div><!--do not delete this line-->
</div><!--freme-->
<div class="skele">
<div class="booze"></div>
<div class="soda"></div>
<div class="ale"></div>
</div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="bread"></div>
<div class="heavens"></div>
<div class="qoo"></div>
</div><!--fruitrack-->
<div class="mojito"></div>
<div class="soup"></div>
</div><!--end bio box-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END BIO BOX ---->
</div><!--quois-left--><!--end main grid: left -->
<!------- SIDEBAR ------->
<div id="quois-right">
<!---- START MINI TITLE BOX ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="desc-box">
<div class="soup"></div>
<div class="fruitrack">
<div class="maple"></div>
<div class="syrup"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="kami"></div>
<div class="nari"></div>
<div class="denki"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="skele">
<div class="cola"></div>
<div class="cotton"></div>
<div class="cola"></div>
</div>
<div class="freme">
<div class="confusion"></div>
<div class="mycabbages"></div>
<div class="hholder">
<div class="box-text">
<!-- mini title text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
About Me
</div><!--do not delete this line-->
</div><!--do not delete this line-->
</div><!--freme-->
<div class="skele">
<div class="booze"></div>
<div class="soda"></div>
<div class="ale"></div>
</div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="bread"></div>
<div class="heavens"></div>
<div class="qoo"></div>
</div><!--fruitrack-->
<div class="mojito"></div>
<div class="soup"></div>
</div><!--desc-box-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END MINI TITLE BOX ---->
<!---- START SIDEBAR IMAGE BOX ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="sidebar-image-box">
<div class="soup"></div>
<div class="fruitrack">
<div class="maple"></div>
<div class="syrup"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="kami"></div>
<div class="nari"></div>
<div class="denki"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="skele">
<div class="cola"></div>
<div class="cotton"></div>
<div class="cola"></div>
</div>
<div class="freme">
<div class="confusion"></div>
<div class="mycabbages"></div>
<div class="hholder">
<div class="imgcont">
<!-- sidebar image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="sidebar-image" src="//cdn.discordapp.com/attachments/900692000364445736/900751947345326120/King-Lulu-Deer_PumpkinSpiceAndEverythingNice.gif">
</div>
</div>
</div><!--freme-->
<div class="skele">
<div class="booze"></div>
<div class="soda"></div>
<div class="ale"></div>
</div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="bread"></div>
<div class="heavens"></div>
<div class="qoo"></div>
</div><!--fruitrack-->
<div class="mojito"></div>
<div class="soup"></div>
</div><!--sidebar-image-box-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END SIDEBAR IMAGE BOX ---->
<!---- START MUSIC BOX ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="desc-box">
<div class="soup"></div>
<div class="fruitrack">
<div class="maple"></div>
<div class="syrup"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="kami"></div>
<div class="nari"></div>
<div class="denki"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="skele">
<div class="cola"></div>
<div class="cotton"></div>
<div class="cola"></div>
</div>
<div class="freme">
<div class="confusion"></div>
<div class="mycabbages"></div>
<div class="hholder">
<div class="box-text musicrack">
<!-- music tooltip text (pref. long music name) -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a title="ConcernedApe — Fall (The Smell of Mushroom)">
<div class="music-controls">
<div class="playy"><i data-feather="play"></i></div>
<div class="pausee"><i data-feather="pause"></i></div> </div>
</a>
<!-- music title (pref. short) -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<div class="music-title">♫&ensp;Autumn</div>
<!-- music url -->
<!-- ✓ autoplay support -->
<!-- to generate a working url, read this: -->
<!-- linktr.ee/direct_file_links -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<audio id="audio" src="//cdn.discordapp.com/attachments/900670626774265886/900754931873628211/Fall_The_Smell_of_Mushroom.mp3" type="audio"></audio>
</div><!--box-text-->
</div><!--hholder-->
</div><!--freme-->
<div class="skele">
<div class="booze"></div>
<div class="soda"></div>
<div class="ale"></div>
</div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="bread"></div>
<div class="heavens"></div>
<div class="qoo"></div>
</div><!--fruitrack-->
<div class="mojito"></div>
<div class="soup"></div>
</div><!--desc-box-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END MUSIC BOX ---->
</div><!--quois-right--><!--end main grid: right-->
</div><!--quois-grid--><!--end main grid-->
<!------- CUSTOM LINKS ------->
<div class="links-box">
<div class="soup"></div>
<div class="fruitrack">
<div class="maple"></div>
<div class="syrup"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="kami"></div>
<div class="nari"></div>
<div class="denki"></div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="skele">
<div class="cola"></div>
<div class="cotton"></div>
<div class="cola"></div>
</div>
<div class="freme">
<div class="confusion"></div>
<div class="hholder">
<div class="fruitrack wine">
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/a/a5/Cheese.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/1/18/Dorado.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/a/a8/Carp.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/6/6e/Cheese_Cauliflower.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/7/78/Pale_Ale.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/b/b3/Beer.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//cdn.discordapp.com/attachments/900692000364445736/900755088803500082/Maple_Syrup.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/c/c6/Honey.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/7/70/Cookie.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/e/e2/Peach.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/5/59/Salmonberry.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!---- START ONE CUSTOM LINK ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div class="tofu">
<!-- link URL and tooltip text -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<a href="/" title="a custom link">
<div class="tofu-img">
<!-- custom link image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img class="customlink-image" src="//stardewvalleywiki.com/mediawiki/images/3/31/Hazelnut.png">
</div>
</a></div>
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- END ONE CUSTOM LINK ---->
<!--do not delete below this line-->
</div><!--fruitrack-->
</div><!--hholder-->
</div><!--freme-->
<div class="skele">
<div class="booze"></div>
<div class="soda"></div>
<div class="ale"></div>
</div>
</div><!--fruitrack-->
<div class="fruitrack">
<div class="bread"></div>
<div class="heavens"></div>
<div class="qoo"></div>
</div><!--fruitrack-->
<div class="mojito"></div>
<div class="soup"></div>
</div><!--end links box-->
</div><!--quois-d-->
</div><!--quois-c-->
</div><!--quois-b-->
</div><!--quois-a-->
<!--end main grid-->
<!------- STATUS TAB ------->
<!-- image and text are edited in :root, not here -->
<div id="status-tab"></div>
<!------- ENERGY BAR ------->
<!---- start one energy bar ---->
<!-- 🌱🌱🌱🌱🌱🌱🌱 -->
<div id="energybar">
<div class="lacie"></div>
<div class="deboui"></div>
<div class="fruitrack">
<div class="delia"></div>
<div class="delilah"></div>
<div class="delib"></div>
</div>
<div class="pourquoi">
<div class="energyicon img">
<!-- energy bar top icon image url -->
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
<img src="//stardewvalleywiki.com/mediawiki/images/archive/d/df/20191209011954%21Max_Energy.png">
</div>
</div>
<div class="fruitrack">
<div class="bepis"></div>
<div class="bepsi"></div>
<div class="bepis"></div>
</div>
<div class="fruitrack">
<div class="boob"></div>
<div class="hazel"></div>
<div class="boob"></div>
</div>
<div class="fruitrack">
<div class="anut"></div>
<div class="latte"></div>
<div class="bnut"></div>
</div>
<div class="fruitrack">
<div class="pyg"></div>
<div class="geneva"></div>
<div class="sty"></div>
</div>
<div class="fruitrack">
<div class="orz"></div>
<div class="maiswhat"></div>
<div class="urk"></div>
</div>
<div class="fruitrack">
<div class="kara"></div>
<div class="mais"></div>
<div class="made"></div>
</div>
<div class="fruitrack">
<div class="cara"></div>
<div class="mais"></div>
<div class="nade"></div>
</div>
<div class="fruitrack">
<div class="xenon"></div>
<div class="fennel"></div>
<div class="akroma"></div>
</div>
<div class="muffin"></div>
<div class="behold">
<div class="energybar-fill"></div>
</div>
</div><!--energybar-->
<!-- 🛑🛑🛑🛑🛑🛑🛑 -->
<!---- end one energy bar ---->
<script>feather.replace()</script>
</body>
</html>