779 lines
21 KiB
Plaintext
779 lines
21 KiB
Plaintext
<!-----------------------------------------------------------------------
|
||
About Page [04]: Kuebiko
|
||
Made by glenthemes
|
||
|
||
Initial release: 2018/07/07
|
||
Re-release: 2020/08/01
|
||
Last updated: 2023/10/05
|
||
|
||
What's new:
|
||
✱ rehosted some assets
|
||
|
||
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:
|
||
🌼🌼🌼🌼🌼🌼🌼 = places to edit
|
||
------------------------------------------------------------------------>
|
||
|
||
<!DOCTYPE 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:50,
|
||
tip_fade_speed:0,
|
||
attribute:"title"
|
||
});
|
||
});
|
||
})(jQuery);
|
||
</script>
|
||
|
||
<link href="//fonts.googleapis.com/css?family=Darker+Grotesque:400,500|Padauk|Recursive|Monda|Libre+Franklin" rel="stylesheet">
|
||
|
||
<script src="//glen-themes.gitlab.io/abt-pages/04/kuebiko.js"></script>
|
||
|
||
<script src="//static.tumblr.com/2pnwama/DLppehqvd/feathericons.js"></script>
|
||
|
||
<!-------------------------------------------------------------------->
|
||
|
||
<style type="text/css">
|
||
|
||
/*--------------------TOOLTIPS--------------------*/
|
||
#s-m-t-tooltip {
|
||
padding:7px 10px;
|
||
margin:22px;
|
||
max-width:var(--BioText-Width);
|
||
background-color:var(--Tooltips-BG);
|
||
font-family:padauk;
|
||
font-size:var(--Tooltips-Font-Size);
|
||
text-transform:uppercase;
|
||
letter-spacing:1.3px;
|
||
color:var(--Tooltips-Text);
|
||
line-height:1.69em;
|
||
z-index:99;
|
||
}
|
||
|
||
/*--------------------TUMBLR CONTROLS--------------------*/
|
||
iframe#tumblr_controls, .iframe-controls--desktop {
|
||
top:7px!important;
|
||
right:7px!important;
|
||
position:fixed!important;
|
||
|
||
transform:scale(0.8,0.8);
|
||
-webkit-transform:scale(0.8,0.8);
|
||
-moz-transform:scale(0.8,0.8);
|
||
-o-transform:scale(0.8,0.8);
|
||
-ms-transform:scale(0.8,0.8);
|
||
|
||
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:var(--Text-On-Highlight-BG);
|
||
}
|
||
|
||
::-moz-selection {
|
||
background:var(--Text-On-Highlight-BG);
|
||
}
|
||
|
||
/*--------------------BASICS--------------------*/
|
||
body {
|
||
background-attachment:fixed;
|
||
line-height:1.6em;
|
||
font-size:12px;
|
||
overflow:hidden;
|
||
}
|
||
|
||
a {
|
||
color:var(--Links);
|
||
text-decoration:none;
|
||
-webkit-transition: all 0.269s ease-in-out;
|
||
-moz-transition: all 0.269s ease-in-out;
|
||
-o-transition: all 0.269s ease-in-out;
|
||
}
|
||
|
||
pre, code {
|
||
white-space:pre-wrap;
|
||
}
|
||
|
||
img {vertical-align:middle;}
|
||
|
||
* {
|
||
/*-------- CURSOR --------*/
|
||
/*-- 🌼🌼🌼🌼🌼🌼🌼 --*/
|
||
|
||
/* to remove the custom cursor, delete the line below */
|
||
|
||
cursor:url(https://glen-themes.gitlab.io/abt-pages/04/nier_cursor_5.png), auto;
|
||
}
|
||
|
||
/*------------ CUSTOMIZATION OPTIONS ------------*/
|
||
/*-- 🌼🌼🌼🌼🌼🌼🌼 --*/
|
||
/* all colors, sizes etc are edited inside :root
|
||
with the exception of the background color & image, edited below: */
|
||
|
||
body {
|
||
background-color:#fff; /* background color */
|
||
|
||
/* background image */
|
||
/* put the image url between the brackets */
|
||
/* do not remove the brackets or semicolon at the end */
|
||
background-image:url(//static.tumblr.com/c0a4e7cc4f5c2882a7779a37b63132bf/2pnwama/qAaoy90vm/tumblr_static_c7ybwm57sv4k0s0kswccgoss0.png);
|
||
|
||
/* if you have a large full-screen background, change
|
||
"repeat" to "no-repeat" */
|
||
background-repeat:repeat;
|
||
}
|
||
|
||
:root {
|
||
/*-- 🌼🌼🌼🌼🌼🌼🌼 --*/
|
||
|
||
/*------- TOP LINKS -------*/
|
||
--TopLinks-Padding:12px;
|
||
--TopLinks-BG:#fbfbfb;
|
||
--TopLinks-Border:#f2f2f2;
|
||
--TopLinks-Color:#333;
|
||
--TopLinks-Font-Size:12px;
|
||
|
||
--TopLinks-BG-On-Hover:#121212;
|
||
--TopLinks-Border-On-Hover:#121212;
|
||
--TopLinks-Color-On-Hover:#eee;
|
||
|
||
--TopLinks-Spacing:15px;
|
||
|
||
/*------- MUSIC PLAYER -------*/
|
||
--Music-Player-BG:#fbfbfb;
|
||
--Music-Player-Border:#f2f2f2;
|
||
|
||
--Music-Controls-Color:#333;
|
||
--Music-Controls-Size:12px;
|
||
|
||
--TopLinks-Bottom-Gap:15px;
|
||
|
||
/*------- MAIN CONTAINER -------*/
|
||
--Container-BG:#fbfbfb;
|
||
--Container-Border:#f2f2f2;
|
||
--Container-Padding:22px;
|
||
|
||
--BioText-Width:420px;
|
||
|
||
/*------- TITLE -------*/
|
||
--Title-Font-Size:18px;
|
||
--Title-Color:#222;
|
||
--Title-Shadow-Color:#e4e4e4;
|
||
|
||
/*------- SUBTITLE -------*/
|
||
--Subtitle-Top-Gap:1px;
|
||
--Subtitle-Lines-Color:#777;
|
||
--Subtitle-Color:#666;
|
||
--Subtitle-Font-Size:11px;
|
||
--Subtitle-Bottom-Gap:14px;
|
||
|
||
/*------- BIO TEXT -------*/
|
||
--BioText-Font-Size:12px;
|
||
--BioText-Color:#666;
|
||
--BioText-Line-Height:1.85;
|
||
|
||
--Links:#000;
|
||
--Links-Bottom-Border:#ddd;
|
||
|
||
--Links-On-Hover:#000;
|
||
--Links-Bottom-Border-On-Hover:#ddd;
|
||
|
||
--Scrollbar-Thumb:#999;
|
||
--Scrollbar-Track:#f0f0f0;
|
||
|
||
/*------- QUOTE -------*/
|
||
--Quote-Section-Top-Gap:16px;
|
||
--Quotation-Mark-Size:30px;
|
||
--Quotation-Mark-Color:#151515;
|
||
--Quote-Border-Color:#151515;
|
||
|
||
--Quote-Text-Left-Gap:15px;
|
||
--Quote-Text-Color:#555;
|
||
--Quote-Text-Font-Size:12px;
|
||
--Quote-Line-Height:2.2;
|
||
|
||
--Quote-Source-Line:#aaa;
|
||
--Quote-Source-Line-Width:20px;
|
||
--Quote-Source-Line-Spacing:8px;
|
||
--Quote-Source-Font-Size:10px;
|
||
--Quote-Source-Color:#888;
|
||
|
||
/*------- CUSTOM LINKS -------*/
|
||
--CustomLinks-Top-Gap:16px;
|
||
--CustomLinks-Per-Row:4;
|
||
--CustomLinks-Padding:9px;
|
||
|
||
--CustomLinks-BG:#fafafa;
|
||
--CustomLinks-Border-Color:#f2f2f2;
|
||
--CustomLinks-Color:#222;
|
||
|
||
--CustomLinks-BG-On-Hover:#121212;
|
||
--CustomLinks-Border-On-Hover:#121212;
|
||
--CustomLinks-Color-On-Hover:#eee;
|
||
|
||
--CustomLinks-Font-Size:9px;
|
||
--CustomLinks-Spacing:4px;
|
||
|
||
--Gutter-Width:25px; /* space between sidebar and text */
|
||
|
||
/*------- RIGHT SIDEBAR IMAGE -------*/
|
||
--Sidebar-Image-Width:300px;
|
||
--Sidebar-Image-Height:420px;
|
||
|
||
/*------- MISC/OTHER -------*/
|
||
--Tooltips-BG:#151515;
|
||
--Tooltips-Text:#eee;
|
||
--Tooltips-Font-Size:10px;
|
||
--Text-On-Highlight-BG:#f2f2f2;
|
||
}
|
||
|
||
/*---------- OUTER "CONTAINER" ----------*/
|
||
#horizontal-a {
|
||
position:fixed;
|
||
top:0;left:0;right:0;
|
||
margin:0 auto;
|
||
height:100vh;
|
||
text-align:center;
|
||
z-index:-1;
|
||
}
|
||
|
||
#horizontal-b {
|
||
display:inline-block;
|
||
}
|
||
|
||
#vertigo-a {
|
||
height:100vh;
|
||
display:table;
|
||
}
|
||
|
||
#vertigo-b {
|
||
display:table-cell;
|
||
vertical-align:middle;
|
||
}
|
||
|
||
#enigma {
|
||
text-align:left;
|
||
}
|
||
|
||
/*---------- TOP BOXES ----------*/
|
||
#topstuff {
|
||
display:flex;
|
||
align-items:center;
|
||
margin-bottom:var(--TopLinks-Bottom-Gap);
|
||
}
|
||
|
||
/*---------- TOP LINKS ----------*/
|
||
.toplinks {
|
||
display:flex;
|
||
align-items:center;
|
||
}
|
||
|
||
.toplinks a {
|
||
margin-right:var(--TopLinks-Spacing);
|
||
padding:var(--TopLinks-Padding) calc(var(--TopLinks-Padding) * 1.69);
|
||
background:var(--TopLinks-BG);
|
||
border:1px solid var(--TopLinks-Border);
|
||
font-family:darker grotesque;
|
||
font-weight:500;
|
||
font-size:var(--TopLinks-Font-Size);
|
||
text-transform:uppercase;
|
||
letter-spacing:2px;
|
||
color:var(--TopLinks-Color);
|
||
line-height:1em;
|
||
}
|
||
|
||
.toplinks a:hover {
|
||
background:var(--TopLinks-BG-On-Hover);
|
||
border-color:var(--TopLinks-Border-On-Hover);
|
||
color:var(--TopLinks-Color-On-Hover);
|
||
}
|
||
|
||
/*---------- MUSIC PLAYER ----------*/
|
||
.la-musique {
|
||
width:calc((var(--TopLinks-Padding) * 2) + var(--TopLinks-Font-Size) + 1px);
|
||
height:calc((var(--TopLinks-Padding) * 2) + var(--TopLinks-Font-Size) + 1px);
|
||
}
|
||
|
||
.parmesan {
|
||
width:100%;
|
||
height:100%;
|
||
background:var(--Music-Player-BG);
|
||
border:1px solid var(--Music-Player-Border);
|
||
box-sizing:border-box;
|
||
}
|
||
|
||
.music-controls {
|
||
display:flex;
|
||
align-items:center;
|
||
justify-content:center;
|
||
width:100%;
|
||
height:100%;
|
||
user-select:none;
|
||
}
|
||
|
||
.playy svg {
|
||
width:var(--Music-Controls-Size);
|
||
height:var(--Music-Controls-Size);
|
||
color:var(--Music-Controls-Color);
|
||
opacity:0.7;
|
||
}
|
||
|
||
.pausee {
|
||
display:none;
|
||
margin-top:1px;
|
||
font-size:calc(var(--Music-Controls-Size) - 3px);
|
||
color:var(--Music-Controls-Color);
|
||
line-height:1em;
|
||
}
|
||
|
||
.beff {display:none;}
|
||
.aff {display:block;}
|
||
|
||
/*---------- MAIN CONTAINER ----------*/
|
||
#iconteven {
|
||
padding:var(--Container-Padding);
|
||
background:var(--Container-BG);
|
||
border:1px solid var(--Container-Border);
|
||
display:table;
|
||
}
|
||
|
||
/*---------- LEFTSIDE ----------*/
|
||
#mainleft {
|
||
display:table-cell;
|
||
vertical-align:top;
|
||
width:var(--BioText-Width);
|
||
padding-right:var(--Gutter-Width);
|
||
}
|
||
|
||
.title {
|
||
font-family:darker grotesque;
|
||
font-weight:400;
|
||
font-size:var(--Title-Font-Size);
|
||
text-transform:uppercase;
|
||
letter-spacing:2.5px;
|
||
color:var(--Title-Color);
|
||
text-shadow:2px 2px 0px var(--Title-Shadow-Color);
|
||
line-height:1.69em;
|
||
}
|
||
|
||
.subtitle {
|
||
position:relative;
|
||
margin-top:calc(var(--Subtitle-Top-Gap) + (var(--Subtitle-Font-Size) / 2));
|
||
margin-bottom:var(--Subtitle-Bottom-Gap);
|
||
margin-left:calc(var(--Subtitle-Font-Size) * 2);
|
||
font-family:padauk;
|
||
font-size:var(--Subtitle-Font-Size);
|
||
text-transform:uppercase;
|
||
letter-spacing:2px;
|
||
color:var(--Subtitle-Color);
|
||
line-height:1em;
|
||
}
|
||
|
||
.subtitle:before {
|
||
content:"";
|
||
position:absolute;
|
||
margin-top:calc(var(--Subtitle-Font-Size) * -.5);
|
||
margin-left:calc(var(--Subtitle-Font-Size) * -2);
|
||
width:var(--Subtitle-Font-Size);
|
||
height:var(--Subtitle-Font-Size);
|
||
border-left:1px solid var(--Subtitle-Lines-Color);
|
||
border-bottom:1px solid var(--Subtitle-Lines-Color);
|
||
}
|
||
|
||
/*---------- BIO TEXT ----------*/
|
||
.bio-text {
|
||
width:calc(100% + 5px);
|
||
height:0px; /* won't actually be 0 */
|
||
overflow:hidden;
|
||
}
|
||
|
||
.the-text {
|
||
padding-top:2px;
|
||
padding-right:10px;
|
||
max-height:100%;
|
||
overflow-y:auto;
|
||
font-family:libre franklin;
|
||
font-size:var(--BioText-Font-Size);
|
||
letter-spacing:0.3px;
|
||
color:var(--BioText-Color);
|
||
line-height:var(--BioText-Line-Height);
|
||
text-align:justify;
|
||
}
|
||
|
||
.the-text a {
|
||
padding-bottom:2.5px;
|
||
border-bottom:1px solid var(--Links-Bottom-Border);
|
||
color:var(--Links);
|
||
}
|
||
|
||
.the-text a:hover {
|
||
border-color:var(--Links-Bottom-Border-On-Hover);
|
||
color:var(--Links-On-Hover);
|
||
}
|
||
|
||
|
||
.the-text::-webkit-scrollbar {
|
||
width:13px;
|
||
height:13px;
|
||
}
|
||
|
||
.the-text::-webkit-scrollbar-thumb {
|
||
background-color:var(--Scrollbar-Thumb);
|
||
border:6px solid var(--Container-BG);
|
||
}
|
||
|
||
.the-text::-webkit-scrollbar-track {
|
||
background:var(--Scrollbar-Track);
|
||
border:6px solid var(--Container-BG);
|
||
}
|
||
|
||
.the-text p:last-child {margin-bottom:0;}
|
||
|
||
/*---------- QUOTE ----------*/
|
||
.quote-sect {
|
||
margin-top:var(--Quote-Section-Top-Gap);
|
||
position:relative;
|
||
}
|
||
|
||
.quote-mark {
|
||
position:absolute;
|
||
width:var(--Quotation-Mark-Size);
|
||
height:var(--Quotation-Mark-Size);
|
||
background:var(--Container-BG);
|
||
border-radius:100%;
|
||
z-index:1;
|
||
}
|
||
|
||
.quote-svg svg {
|
||
}
|
||
|
||
.quote-text {
|
||
display:inline-block;
|
||
margin-left:calc((var(--Quotation-Mark-Size) / 2) - 1px);
|
||
padding-left:calc((var(--Quotation-Mark-Size) / 2) + var(--Quote-Text-Left-Gap) + 1px);
|
||
border-left:1px solid var(--Quote-Border-Color);
|
||
padding-right:var(--Quote-Text-Left-Gap);
|
||
font-family:recursive;
|
||
font-size:var(--Quote-Text-Font-Size);
|
||
color:var(--Quote-Text-Color);
|
||
line-height:var(--Quote-Line-Height);
|
||
text-align:left;
|
||
}
|
||
|
||
.quote-text p {
|
||
display:inline-block;
|
||
margin-top:3px;
|
||
}
|
||
|
||
.quote-text p:last-of-type {margin-bottom:-3px;}
|
||
|
||
.imdoingmybest {
|
||
display:table;
|
||
width:100%;
|
||
}
|
||
|
||
.quote-text span {
|
||
display:table-cell;
|
||
width:100%;
|
||
white-space:nowrap;
|
||
}
|
||
|
||
.quote-source {
|
||
display:table-cell;
|
||
vertical-align:middle;
|
||
}
|
||
|
||
.quote-source.right, .quote-source.inline {
|
||
display:table;
|
||
margin-left:auto;
|
||
}
|
||
|
||
.ergh {
|
||
position:absolute;
|
||
opacity:0;
|
||
}
|
||
|
||
.sausage {
|
||
display:flex;
|
||
align-items:center;
|
||
}
|
||
|
||
.q-line {
|
||
margin-right:var(--Quote-Source-Line-Spacing);
|
||
width:var(--Quote-Source-Line-Width);
|
||
height:1px;
|
||
background:var(--Quote-Source-Line);
|
||
}
|
||
|
||
.quote-source.inline .q-line {margin-top:-6px;}
|
||
|
||
.source-text {
|
||
font-family:padauk;
|
||
font-size:var(--Quote-Source-Font-Size);
|
||
text-transform:uppercase;
|
||
letter-spacing:1.5px;
|
||
color:var(--Quote-Source-Color);
|
||
line-height:1em;
|
||
white-space:nowrap;
|
||
}
|
||
|
||
.quote-source.inline .source-text {margin-top:-6px;}
|
||
|
||
/*---------- CUSTOM LINKS ----------*/
|
||
.customlinks {
|
||
margin-top:calc(var(--CustomLinks-Top-Gap) - var(--CustomLinks-Spacing));
|
||
margin-bottom:calc(var(--CustomLinks-Spacing) * -1);
|
||
margin-left:calc(var(--CustomLinks-Spacing) * -1);
|
||
width:calc(100% + (var(--CustomLinks-Spacing) * 2));
|
||
display:flex;
|
||
flex-wrap:wrap;
|
||
}
|
||
|
||
.customlinks a {
|
||
display:block;
|
||
margin:var(--CustomLinks-Spacing);
|
||
width:calc((100% / var(--CustomLinks-Per-Row)) - (var(--CustomLinks-Spacing) * 2));
|
||
box-sizing:border-box;
|
||
padding:var(--CustomLinks-Padding) calc(var(--CustomLinks-Padding) * 1.5);
|
||
background:var(--CustomLinks-BG);
|
||
border:1px solid var(--CustomLinks-Border-Color);
|
||
font-family:Monda;
|
||
font-size:var(--CustomLinks-Font-Size);
|
||
text-transform:uppercase;
|
||
letter-spacing:1.3px;
|
||
color:var(--CustomLinks-Color);
|
||
line-height:1.5em;
|
||
text-align:center;
|
||
}
|
||
|
||
.customlinks a:hover {
|
||
background:var(--CustomLinks-BG-On-Hover);
|
||
border-color:var(--CustomLinks-Border-On-Hover);
|
||
color:var(--CustomLinks-Color-On-Hover);
|
||
}
|
||
|
||
/*---------- RIGHT SIDEBAR IMAGE ----------*/
|
||
#sidebar {
|
||
display:table-cell;
|
||
vertical-align:top;
|
||
width:var(--Sidebar-Image-Width);
|
||
height:var(--Sidebar-Image-Height);
|
||
|
||
/*------- SIDEBAR IMAGE -------*/
|
||
/*-- 🌼🌼🌼🌼🌼🌼🌼 --*/
|
||
/* image url goes between brackets. do not remove brackets or semicolon */
|
||
|
||
background-image:url(//64.media.tumblr.com/13c8afc22302c8fa44a8268bdfed673f/8a31703dcece7b58-41/s1280x1920/a149e70bd96309aa7b19090bf9adfd6fe04eb7fd.jpg);
|
||
|
||
background-repeat:no-repeat;
|
||
background-size:cover;
|
||
background-position:center;
|
||
}
|
||
|
||
</style>
|
||
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<div id="horizontal-a">
|
||
<div id="horizontal-b">
|
||
<div id="vertigo-a">
|
||
<div id="vertigo-b">
|
||
<div id="enigma">
|
||
<div id="topstuff">
|
||
|
||
|
||
<!--------- TOP LINKS --------->
|
||
<!-- home, ask, archive, etc -->
|
||
<!-- 🌼🌼🌼🌼🌼🌼🌼 -->
|
||
<!-- url goes between quotation marks of href="" -->
|
||
|
||
<div class="toplinks">
|
||
<a href="/">index</a>
|
||
<a href="/ask">message</a>
|
||
<a href="/archive">archive</a>
|
||
|
||
<!-- pls do not remove the credit, thank you! *\(^o^)-＊ -->
|
||
<a href="//glenthemes.tumblr.com" title="page by glenthemes">credit</a>
|
||
</div><!--end toplinks-->
|
||
|
||
|
||
|
||
<!--------- MUSIC PLAYER --------->
|
||
<div class="la-musique">
|
||
<div class="parmesan">
|
||
|
||
<!----- MUSIC TITLE ----->
|
||
<!-- 🌼🌼🌼🌼🌼🌼🌼 -->
|
||
<!-- music title goes between quotation marks of title="''" -->
|
||
|
||
<a class="music-controls" title="'Blissful Death'">
|
||
<div class="playy">
|
||
<i data-feather="play"></i>
|
||
</div>
|
||
<div class="pausee">⌷⌷</div>
|
||
</a>
|
||
</div><!--parmesan-->
|
||
</div><!--la-musique-->
|
||
|
||
|
||
<!--------- MUSIC LINK --------->
|
||
<!-- 🌼🌼🌼🌼🌼🌼🌼 -->
|
||
<!--
|
||
HOW TO ADD YOUR OWN MUSIC: PLEASE READ:
|
||
linktr.ee/direct_file_links
|
||
|
||
Put the finalized url between the quotation marks of src=""
|
||
-->
|
||
|
||
<audio id="audio" src="https://rhizo.gitlab.io/nier/Blissful_Death.mp3" type="audio"></audio>
|
||
|
||
<!--end music player-->
|
||
</div><!--topstuff--><!--do not delete this line-->
|
||
|
||
|
||
|
||
|
||
<div id="iconteven">
|
||
<div id="mainleft">
|
||
|
||
|
||
<!--------- TITLE & SUBTITLE --------->
|
||
<div class="title">your title here</div>
|
||
<div class="subtitle">your subtitle here</div>
|
||
|
||
|
||
|
||
<div class="bio-text">
|
||
<div class="the-text">
|
||
|
||
<!--------- BIO TEXT --------->
|
||
<!-- height is autoatically generated -->
|
||
|
||
Biography text goes here.
|
||
<p>
|
||
Supports long text. Text that's too long will overflow, and a scrollbar will be added automatically.
|
||
<p>
|
||
NOTE: open your page in a new tab and refresh periodically to see your changes live. the editor panel isn't always accurate (especially the height of this text space).
|
||
|
||
</div><!--do not delete this line-->
|
||
</div><!--do not delete this line-->
|
||
|
||
|
||
|
||
|
||
<div class="quote-sect">
|
||
<div class="quote-mark">
|
||
<div class="quote-svg"></div>
|
||
</div>
|
||
<div class="quote-text">
|
||
|
||
<!--------- A QUOTE HERE --------->
|
||
<!-- 🌼🌼🌼🌼🌼🌼🌼 -->
|
||
<!-- do not remove the <p> & </p> -->
|
||
<!-- you CAN have multiple paragraphs but personally
|
||
I recommend 1-2 -->
|
||
|
||
<p>
|
||
|
||
We want our lives back, we want to get back to ‘normal’.
|
||
But life doesn’t care.
|
||
Now it is night again and I am waiting for
|
||
the dawn tomorrow.
|
||
|
||
</p>
|
||
|
||
|
||
<!--------- QUOTE SOURCE --------->
|
||
<!-- 🌼🌼🌼🌼🌼🌼🌼 -->
|
||
<!--
|
||
you have 3 choices for the positioning:
|
||
> position="left" : under the quote, on the left.
|
||
> position="right" : under the quote, on the right.
|
||
> position="inline" : on the same line as the quote,
|
||
on the right.
|
||
-->
|
||
<div class="quote-source ergh" position="inline">
|
||
<div class="sausage">
|
||
<div class="q-line"></div>
|
||
|
||
<!----- QUOTE SOURCE TEXT (THEIR NAME) ----->
|
||
<!-- 🌼🌼🌼🌼🌼🌼🌼 -->
|
||
|
||
<div class="source-text">Nayyirah Waheed</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</div><!--quote-text-->
|
||
</div><!--quote-sect-->
|
||
|
||
|
||
|
||
|
||
|
||
<!--------- CUSTOM LINKS --------->
|
||
<!-- 🌼🌼🌼🌼🌼🌼🌼 -->
|
||
<!--
|
||
> put the url between the quotation marks of href=""
|
||
|
||
> if your display text is too long to fit, you can change
|
||
the number of links per row. scroll up and search for
|
||
--CustomLinks-Per-Row
|
||
|
||
> feel free to add/delete as you want
|
||
-->
|
||
<div class="customlinks">
|
||
<a href="">link 1</a>
|
||
<a href="">link 2</a>
|
||
<a href="">link 3</a>
|
||
<a href="">link 4</a>
|
||
<a href="">link 5</a>
|
||
<a href="">link 6</a>
|
||
<a href="">link 7</a>
|
||
<a href="">link 8</a>
|
||
</div><!--customlinks--><!--do not delete this line-->
|
||
</div><!--mainleft-->
|
||
|
||
|
||
|
||
<!--------- RIGHT SIDEBAR IMAGE --------->
|
||
<!-- not changed here. scroll up and search for #sidebar -->
|
||
<div id="sidebar"></div>
|
||
|
||
</div><!--iconteven-->
|
||
</div><!--enigma-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>feather.replace()</script>
|
||
</body>
|
||
|
||
</html> |