1542 lines
46 KiB
Plaintext
1542 lines
46 KiB
Plaintext
<!-----------------------------------------------------------------------
|
|
About Page [13]: Sunlit Memories
|
|
Made by glenthemes
|
|
|
|
Initial release: 2019/11/30
|
|
Last updated: 2023/10/13
|
|
|
|
What's new:
|
|
✱ fixed status tab not showing
|
|
✱ music player bug fix
|
|
✱ fixed some loading issues
|
|
✱ NEW GUIDE!
|
|
|
|
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/presentation/d/13KZWoLUBasAWh-R1S49xIj4Wc1qLdV81wp1aws12LBE/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>
|
|
<html 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>
|
|
|
|
<script src="//static.tumblr.com/gtjt4bo/sgMrymui0/waitforelement.js"></script>
|
|
|
|
<link href="//glen-themes.gitlab.io/abt-pages/15/navlinks.css" rel="stylesheet">
|
|
|
|
<script src="//glen-themes.gitlab.io/abt-pages/15/navSVGs.js"></script>
|
|
|
|
<link href="//glen-themes.gitlab.io/abt-pages/15/boxes.css" rel="stylesheet">
|
|
|
|
<script src="//glen-themes.gitlab.io/abt-pages/15/status-tab.js"></script>
|
|
<link href="//glen-themes.gitlab.io/abt-pages/15/status-tab.css" rel="stylesheet">
|
|
|
|
<link href="//glen-themes.gitlab.io/abt-pages/15/energybar.css" rel="stylesheet">
|
|
|
|
<script src="//static.tumblr.com/gtjt4bo/jxSs2cboc/glenplayer0.js"></script>
|
|
|
|
<script>
|
|
$(document).ready(function(){
|
|
$("img").each(function(){
|
|
if ($(this).attr("src") == "//glen-themes.gitlab.io/abt-pages/15/imgs/Moonlight-pendent13_TinyPlants.png"){
|
|
$(this).wrap("<a title='art by Moonlight-pendent13 - DeviantArt'></a>");
|
|
}
|
|
|
|
if ($(this).attr("src") == "//glen-themes.gitlab.io/abt-pages/15/imgs/GentleLark_FallLeafDivider.png"){
|
|
$(this).wrap("<a title='art by GentleLark - DeviantArt'></a>");
|
|
}
|
|
|
|
if ($(this).attr("src") == "//glen-themes.gitlab.io/abt-pages/15/imgs/King-Lulu-Deer_PumpkinSpiceAndEverythingNice.gif"){
|
|
$(this).wrap("<a title='art by King-Lulu-Deer - DeviantArt'></a>");
|
|
}
|
|
});
|
|
});//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("//glen-themes.gitlab.io/abt-pages/15/imgs/Stardew-Valley-Cursor.png"), auto;
|
|
}
|
|
|
|
a, a [music-btn]{
|
|
cursor: url("//glen-themes.gitlab.io/abt-pages/15/imgs/Stardew-Valley-Hand.png"), auto!important;
|
|
}
|
|
|
|
a[title]:not([href]){
|
|
cursor: url("//glen-themes.gitlab.io/abt-pages/15/imgs/Stardew-Valley-Cursor-Help.png"), auto;
|
|
}
|
|
|
|
a[title] > img,
|
|
a[title] > .nutbar:first-child,
|
|
a[title] > .nutbar:first-child ~ *,
|
|
a[title] > [music-btn] > * {
|
|
pointer-events:none;
|
|
}
|
|
|
|
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-Controls-Gap-Right:7px;
|
|
--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-Left-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);
|
|
}
|
|
|
|
/*---- BULLET LIST ICON IMAGE ----*/
|
|
.box-text li {
|
|
list-style-image:url("//glen-themes.gitlab.io/abt-pages/15/imgs/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 ----------*/
|
|
[music-player] svg {
|
|
display:block;
|
|
width:var(--Music-Controls-Size);
|
|
height:var(--Music-Controls-Size);
|
|
color:var(--TextBox-Text-Color);
|
|
flex-shrink:0;
|
|
border-right:3px solid transparent;
|
|
}
|
|
|
|
.music-title {
|
|
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">
|
|
|
|
<!-- HOME link -->
|
|
<div class="navlink" home-link>
|
|
<a href="/" title="return home"></a>
|
|
</div>
|
|
|
|
<!-- ASK link -->
|
|
<div class="navlink" ask-link>
|
|
<a href="/ask" title="send mail"></a>
|
|
</div>
|
|
|
|
<!-- ARCHIVE link -->
|
|
<div class="navlink" archive-link>
|
|
<a href="/archive" title="visit archive"></a>
|
|
</div>
|
|
|
|
<!-- CREDIT -->
|
|
<!-- please do not remove -->
|
|
<div class="navlink" theme-link>
|
|
<a href="//glenthemes.tumblr.com" title="coded by glenthemes"></a>
|
|
</div>
|
|
</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="//glen-themes.gitlab.io/abt-pages/15/imgs/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>some bullet here</span>
|
|
|
|
<li><span>some bullet here</span>
|
|
|
|
<li><span>some bullet here</span>
|
|
|
|
<div class="divider">
|
|
<img src="//glen-themes.gitlab.io/abt-pages/15/imgs/GentleLark_FallLeafDivider.png">
|
|
</div><!--end divider-->
|
|
|
|
<center>
|
|
Example of how you can proc hover text: <a title="hover text here">hello</a>.
|
|
</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="//glen-themes.gitlab.io/abt-pages/15/imgs/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">
|
|
|
|
<div music-player btn-color="var(--TextBox-Text-Color)" btn-size="var(--Music-Controls-Size)" gap="var(--Music-Controls-Gap-Right)" btn-style="outlined">
|
|
|
|
<!-- music tooltip text (pref. long music name) -->
|
|
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
|
|
<a title="ConcernedApe — Fall (The Smell of Mushroom)">
|
|
<div music-btn>
|
|
<div btn-play></div>
|
|
<div btn-pause hidden></div>
|
|
</div>
|
|
</a>
|
|
|
|
<!-- music url -->
|
|
<!-- INSTRUCTIONS HERE: -->
|
|
<!-- linktr.ee/direct_file_links -->
|
|
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
|
|
<audio src="//rhizo.gitlab.io/m/Fall__The_Smell_of_Mushroom_.mp3" volume="100%"></audio>
|
|
|
|
<i data-feather="music"></i>
|
|
|
|
<!-- music title (pref. short) -->
|
|
<!-- 🔽🔽🔽🔽🔽🔽🔽 -->
|
|
<div class="music-title">
|
|
Autumn
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</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="//glen-themes.gitlab.io/abt-pages/15/imgs/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> |