793 lines
21 KiB
Plaintext
793 lines
21 KiB
Plaintext
|
<!-----------------------------------------------------------------------
|
||
|
Redirect Page [01]: Komorebi
|
||
|
Made by glenthemes
|
||
|
|
||
|
Initial release: 2020/05/20
|
||
|
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.
|
||
|
|
||
|
INSTALLATION & GUIDE:
|
||
|
docs.google.com/document/d/18wRmcBsBUKIJvnddK97Dc1AyLppSaPqa6X-DTFLF9J4/edit?usp=sharing
|
||
|
|
||
|
Customization pointers:
|
||
|
🍎🍎🍎🍎🍎🍎🍎 = places to edit
|
||
|
|
||
|
Credits:
|
||
|
glenthemes.tumblr.com/acnh-crd
|
||
|
------------------------------------------------------------------------>
|
||
|
|
||
|
<!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:50,
|
||
|
tip_fade_speed:0,
|
||
|
attribute:"title"
|
||
|
});
|
||
|
});
|
||
|
})(jQuery);
|
||
|
</script>
|
||
|
|
||
|
<link href="//fonts.googleapis.com/css?family=Nunito|Balsamiq+Sans" rel="stylesheet">
|
||
|
|
||
|
<link rel="stylesheet" href="//use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
|
||
|
|
||
|
<script src="//glenthemes.s3.eu-west-2.amazonaws.com/redirect-pages/01/komorebi.js"></script>
|
||
|
|
||
|
<!------------------------------------------------->
|
||
|
|
||
|
<style type="text/css">
|
||
|
|
||
|
/*--------------------TOOLTIPS--------------------*/
|
||
|
#s-m-t-tooltip {
|
||
|
padding:5px 10px;
|
||
|
margin:20px;
|
||
|
background-color:var(--Links-Blob-Background);
|
||
|
border-radius:5px;
|
||
|
font-family:nunito;
|
||
|
font-size:calc(var(--Links-Font-Size) - 5px);
|
||
|
text-transform:uppercase;
|
||
|
letter-spacing:1px;
|
||
|
color:var(--Links);
|
||
|
z-index:99;
|
||
|
max-width:40vw;
|
||
|
}
|
||
|
|
||
|
/*--------------------TUMBLR CONTROLS--------------------*/
|
||
|
iframe#tumblr_controls, .iframe-controls--desktop {
|
||
|
top:8px!important;
|
||
|
right:40px!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:99!important;
|
||
|
}
|
||
|
|
||
|
.glenjadot {
|
||
|
position:fixed;
|
||
|
display:flex;
|
||
|
align-items:center;
|
||
|
justify-content:center;
|
||
|
top:0;margin-top:20px;
|
||
|
right:0;margin-right:20px;
|
||
|
width:12px;
|
||
|
height:12px;
|
||
|
border-radius:100%;
|
||
|
border:1px solid var(--Links-Blob-Background);
|
||
|
}
|
||
|
|
||
|
.bloop {
|
||
|
width:9px;
|
||
|
height:9px;
|
||
|
background:var(--Links-Blob-Background);
|
||
|
border-radius:100%;
|
||
|
}
|
||
|
|
||
|
/*--------------------TEXT HIGHLIGHT--------------------*/
|
||
|
::selection {
|
||
|
background:#BBD3FD;
|
||
|
}
|
||
|
|
||
|
::-moz-selection {
|
||
|
background:#BBD3FD;
|
||
|
}
|
||
|
|
||
|
/*--------------------BASICS--------------------*/
|
||
|
body {
|
||
|
background-attachment:fixed;
|
||
|
font-family:Balsamiq Sans;
|
||
|
line-height:1.6em;
|
||
|
font-size:12px;
|
||
|
text-align:left;
|
||
|
}
|
||
|
|
||
|
blockquote {
|
||
|
padding-left:10px;
|
||
|
margin-left:5px;
|
||
|
border-left:1px solid;
|
||
|
border-color:#aaa;
|
||
|
margin:10px;
|
||
|
}
|
||
|
|
||
|
a {
|
||
|
color:var(--Links);
|
||
|
text-decoration:none;
|
||
|
cursor:pointer;
|
||
|
}
|
||
|
|
||
|
pre, code {
|
||
|
white-space:pre-wrap;
|
||
|
}
|
||
|
|
||
|
img {vertical-align:middle;}
|
||
|
|
||
|
/*---------- CUSTOMIZATION OPTIONS ----------*/
|
||
|
/*--🍎🍎🍎🍎🍎🍎🍎--*/
|
||
|
|
||
|
body {
|
||
|
background-color:#d69d80; /* background color edited here */
|
||
|
}
|
||
|
|
||
|
.background-image {
|
||
|
display:none;
|
||
|
position:fixed;
|
||
|
top:0;left:0;
|
||
|
width:100%;
|
||
|
height:100%;
|
||
|
|
||
|
/* background image is set here */
|
||
|
background-image:url(//cdn.discordapp.com/attachments/382037367940448256/712470211629940777/acfihing_3c.png);
|
||
|
/* put the url between brackets. do not remove semicolon */
|
||
|
|
||
|
background-repeat:no-repeat;
|
||
|
background-size:cover;
|
||
|
z-index:-1;
|
||
|
}
|
||
|
|
||
|
/* ALL OTHER COLORS, SIZES ETC EDITED BELOW */
|
||
|
/*--🍎🍎🍎🍎🍎🍎🍎--*/
|
||
|
|
||
|
:root {
|
||
|
/* clock [bottom left] */
|
||
|
--Clock-Font-Size:15px;
|
||
|
--Clock-Text:#fefae5;
|
||
|
--Clock-Line:#fefae5;
|
||
|
--Clock-Line-Gap:9px;
|
||
|
--Weekday-Background:#fefae5;
|
||
|
--Weekday-Padding:10px;
|
||
|
--Weekday-Text:#3c3c3c;
|
||
|
|
||
|
/* main cloud/bubble [center] */
|
||
|
--Bubble-Width:380px;
|
||
|
--Bubble-Height:120px;
|
||
|
--Bubble-Background:#fefae5;
|
||
|
--Bubble-Border:#f5dabd;
|
||
|
--Bubble-Border-Size:15.5px;
|
||
|
--Bubble-Font-Size:15px;
|
||
|
--Bubble-Text:#35323c;
|
||
|
--Typewriter-Speed:36; /* number ONLY. in milliseconds
|
||
|
if don't want a typewriter effect,
|
||
|
ctrl+F typewriter="yes" and change yes to no
|
||
|
*/
|
||
|
|
||
|
/* cloud/bubble name [top left] */
|
||
|
--Name-Font-Size:11px;
|
||
|
--Name:#827562;
|
||
|
--Name-Background:#fefae5;
|
||
|
--Name-Padding:13px;
|
||
|
--Name-Positioning-X:18px;
|
||
|
--Name-Positioning-Y:-7px;
|
||
|
|
||
|
/* popup-ish links blob box */
|
||
|
--Links-Blob-Width:auto;
|
||
|
--Links-Blob-Background:#ffebd2;
|
||
|
--Links-Blob-Padding:18px;
|
||
|
--Links-Cursor-Size:28px;
|
||
|
--Links:#4e474a;
|
||
|
--Links-Font-Size:13px;
|
||
|
--Links-Bottom-Border:#fdc690;
|
||
|
--Links-Spacing:0px;
|
||
|
--Links-Blob-Position-X:-30px;
|
||
|
--Links-Blob-Position-Y:-12px;
|
||
|
|
||
|
/* custom links [bottom right] */
|
||
|
--Corner-Links-Outer-Padding:7px;
|
||
|
--Corner-Links-Background:#ffebd2;
|
||
|
|
||
|
--Corner-Links-Symbol-Size:13px;
|
||
|
--Corner-Links-Symbol-Color:#ffebd2;
|
||
|
--Corner-Links-Symbol-Background:#4e474a;
|
||
|
--Corner-Links-Symbol-Padding:5px;
|
||
|
--Corner-Links-Symbol-Right-Gap:7px;
|
||
|
--Corner-Links-Font-Size:12px;
|
||
|
--Corner-Links-Text:#4e474a;
|
||
|
--Corner-Links-Spacing:12px;
|
||
|
|
||
|
--Corner-Links-Background-Hover:#6f5e68;
|
||
|
--Corner-Links-Symbol-Hover:#6f5e68;
|
||
|
--Corner-Links-Symbol-Background-Hover:#ffebd2;
|
||
|
--Corner-Links-Text-Hover:#ffebd2;
|
||
|
|
||
|
/* other */
|
||
|
--Window-Margin-Bottom:52px;
|
||
|
--Window-Margin-Sides:42px;
|
||
|
}
|
||
|
|
||
|
/*------------ CLOCK [BOTTOM LEFT] ------------*/
|
||
|
.clock {
|
||
|
display:none;
|
||
|
position:fixed;
|
||
|
bottom:0;margin-bottom:var(--Window-Margin-Bottom);
|
||
|
left:0;margin-left:var(--Window-Margin-Sides);
|
||
|
padding:0 3px;
|
||
|
font-family:Balsamiq Sans!important;
|
||
|
color:var(--Clock-Text);
|
||
|
}
|
||
|
|
||
|
.clock > * {
|
||
|
margin:auto;
|
||
|
}
|
||
|
|
||
|
.timeandshit {
|
||
|
padding:0 13px;
|
||
|
font-size:calc(var(--Clock-Font-Size) + 5px);
|
||
|
letter-spacing:2px;
|
||
|
text-align:center;
|
||
|
}
|
||
|
|
||
|
.am-pm {
|
||
|
font-size:var(--Clock-Font-Size);
|
||
|
}
|
||
|
|
||
|
.divider {
|
||
|
margin:var(--Clock-Line-Gap) auto;
|
||
|
width:100%;
|
||
|
height:2px;
|
||
|
border-radius:2px;
|
||
|
background:var(--Clock-Line);
|
||
|
}
|
||
|
|
||
|
.date {
|
||
|
display:flex;
|
||
|
align-items:center;
|
||
|
justify-content:center;
|
||
|
padding:0 3px;
|
||
|
}
|
||
|
|
||
|
.weekday {
|
||
|
display:inline-block;
|
||
|
padding:var(--Weekday-Padding);
|
||
|
background:var(--Weekday-Background);
|
||
|
border-radius:var(--Clock-Font-Size);
|
||
|
font-size:calc(var(--Clock-Font-Size) - 1px);
|
||
|
color:var(--Weekday-Text);
|
||
|
line-height:.9em;
|
||
|
}
|
||
|
|
||
|
.monthday {
|
||
|
margin-left:10px;
|
||
|
font-size:calc(var(--Clock-Font-Size) + 1px);
|
||
|
}
|
||
|
|
||
|
/*------------ BLOB CLOUDS ------------*/
|
||
|
#cent-a {
|
||
|
position:fixed;
|
||
|
bottom:0;left:0;right:0;
|
||
|
text-align:center;
|
||
|
z-index:-1;
|
||
|
}
|
||
|
|
||
|
#cent-b {
|
||
|
display:inline-block;
|
||
|
}
|
||
|
|
||
|
.thestuff {
|
||
|
position:relative;
|
||
|
margin-bottom:var(--Window-Margin-Bottom);
|
||
|
animation:blorg 0.9s linear 0s;
|
||
|
}
|
||
|
|
||
|
.blobsquad {
|
||
|
position:relative;
|
||
|
margin-bottom:-5px;
|
||
|
}
|
||
|
|
||
|
/* top bubble */
|
||
|
.bub-top {
|
||
|
margin-bottom:calc(var(--Bubble-Height) * -0.6);
|
||
|
width:var(--Bubble-Width);
|
||
|
height:var(--Bubble-Height);
|
||
|
background:var(--Bubble-Border);
|
||
|
clip-path:ellipse(50% 50% at 50% 50%);
|
||
|
display:flex;
|
||
|
align-items:center;
|
||
|
justify-content:center;
|
||
|
}
|
||
|
|
||
|
.lemon {
|
||
|
width:calc(var(--Bubble-Width) - (var(--Bubble-Border-Size) * 2));
|
||
|
height:calc(var(--Bubble-Height) - (var(--Bubble-Border-Size) * 2));
|
||
|
background:var(--Bubble-Background);
|
||
|
clip-path:ellipse(50% 50% at 50% 50%);
|
||
|
}
|
||
|
|
||
|
/* bottom bubble */
|
||
|
.bub-bot {
|
||
|
margin-left:auto;
|
||
|
margin-right:10px;
|
||
|
width:calc(var(--Bubble-Width) * 0.9);
|
||
|
height:calc(var(--Bubble-Height) * 0.9);
|
||
|
background:var(--Bubble-Border);
|
||
|
clip-path:ellipse(50% 50% at 50% 50%);
|
||
|
display:flex;
|
||
|
justify-content:center;
|
||
|
}
|
||
|
|
||
|
.cheese {
|
||
|
margin-top:-5px;
|
||
|
margin-left:-3px;
|
||
|
width:calc((var(--Bubble-Width) * 0.9) - (var(--Bubble-Border-Size) * 1.5));
|
||
|
height:calc((var(--Bubble-Height) * 0.9) - var(--Bubble-Border-Size) + 5px);
|
||
|
background:var(--Bubble-Background);
|
||
|
clip-path:ellipse(50% 50% at 50% 50%);
|
||
|
}
|
||
|
|
||
|
/* bubble text container */
|
||
|
.deja {
|
||
|
position:absolute;
|
||
|
top:0;margin-top:calc(var(--Bubble-Border-Size) * 2);
|
||
|
margin-left:calc(var(--Bubble-Border-Size) * 5);
|
||
|
width:calc(var(--Bubble-Width) - (var(--Bubble-Border-Size) * 10));
|
||
|
height:calc((var(--Bubble-Height) * 1.3) - (var(--Bubble-Border-Size) * 4));
|
||
|
display:table;
|
||
|
overflow:hidden;
|
||
|
}
|
||
|
|
||
|
.vu {
|
||
|
display:table-cell;
|
||
|
vertical-align:middle;
|
||
|
}
|
||
|
|
||
|
/* bubble text */
|
||
|
.bub-text {
|
||
|
font-size:var(--Bubble-Font-Size);
|
||
|
color:var(--Bubble-Text);
|
||
|
line-height:1.7em;
|
||
|
animation:appear 1s linear 0s;
|
||
|
}
|
||
|
|
||
|
.text-area {
|
||
|
position:absolute;
|
||
|
visibility:hidden;
|
||
|
}
|
||
|
|
||
|
.nt {
|
||
|
position:relative;
|
||
|
visibility:visible;
|
||
|
}
|
||
|
|
||
|
/* name/badge (top left) */
|
||
|
.potatoe {
|
||
|
position:relative;
|
||
|
text-align:left;
|
||
|
z-index:1;
|
||
|
}
|
||
|
|
||
|
.name-badge {
|
||
|
position:absolute;
|
||
|
margin-left:var(--Name-Positioning-X);
|
||
|
bottom:0;margin-bottom:calc(((var(--Name-Font-Size) + var(--Name-Padding)) * -1) + var(--Name-Positioning-Y));
|
||
|
padding:var(--Name-Padding);
|
||
|
background:var(--Name-Background);
|
||
|
clip-path:ellipse(50% 85% at 50% 50%);
|
||
|
font-size:var(--Name-Font-Size);
|
||
|
text-transform:uppercase;
|
||
|
letter-spacing:1px;
|
||
|
word-spacing:1px;
|
||
|
color:var(--Name);
|
||
|
line-height:1.05em;
|
||
|
transform:rotate(-12deg);
|
||
|
}
|
||
|
|
||
|
/*------------ [POPUP-ish] LINKS ------------*/
|
||
|
.links-blob {
|
||
|
display:none;
|
||
|
position:absolute;
|
||
|
bottom:0;
|
||
|
margin-bottom:calc((var(--Bubble-Height) + (var(--Bubble-Border-Size) * 1)) + var(--Links-Blob-Position-Y));
|
||
|
right:0;margin-right:calc((var(--Bubble-Border-Size) * -1) + var(--Links-Blob-Position-X));
|
||
|
width:var(--Links-Blob-Width);
|
||
|
padding:var(--Links-Blob-Padding);
|
||
|
background:var(--Links-Blob-Background);
|
||
|
border-radius:var(--Links-Blob-Padding);
|
||
|
z-index:2;
|
||
|
animation:blorg 0.5s linear 0s;
|
||
|
}
|
||
|
|
||
|
@keyframes blorg {
|
||
|
0% {
|
||
|
opacity:0;
|
||
|
}
|
||
|
|
||
|
25% {
|
||
|
opacity:1;
|
||
|
transform:scale(1.069);
|
||
|
}
|
||
|
|
||
|
69% {
|
||
|
opacity:1;
|
||
|
transform:scale(1);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.one-link {
|
||
|
display:flex;
|
||
|
align-items:center;
|
||
|
margin:var(--Links-Spacing) 0;
|
||
|
animation:appear .7s linear 0s;
|
||
|
}
|
||
|
|
||
|
@keyframes appear {
|
||
|
0% {
|
||
|
opacity:0;
|
||
|
}
|
||
|
|
||
|
69% {
|
||
|
opacity:0;
|
||
|
}
|
||
|
|
||
|
100% {
|
||
|
opacity:1;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.one-link:first-of-type {margin-top:0;}
|
||
|
.one-link:last-of-type {margin-bottom:0;}
|
||
|
|
||
|
.c-hold {
|
||
|
margin-top:2px;
|
||
|
margin-left:calc((var(--Links-Blob-Padding) + (var(--Links-Cursor-Size) / 1.5)) * -1);
|
||
|
margin-right:calc(var(--Links-Cursor-Size) * 0.5);
|
||
|
width:calc(var(--Links-Cursor-Size) * 1.25);
|
||
|
}
|
||
|
|
||
|
.cursor {
|
||
|
width:var(--Links-Cursor-Size);
|
||
|
opacity:0;
|
||
|
}
|
||
|
|
||
|
@keyframes point {
|
||
|
50% {
|
||
|
margin-left:calc(var(--Links-Cursor-Size) * 0.269);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.one-link:hover .cursor {
|
||
|
opacity:1;
|
||
|
animation:point 0.69s linear 0s infinite;
|
||
|
}
|
||
|
|
||
|
.one-link span {
|
||
|
padding:0 2px;
|
||
|
margin-right:calc(var(--Links-Cursor-Size) * 0.5);
|
||
|
font-size:var(--Links-Font-Size);
|
||
|
color:var(--Links);
|
||
|
line-height:1.7em;
|
||
|
box-shadow:transparent 0px calc((var(--Links-Font-Size) * 1.7) / -2) 0px inset;
|
||
|
}
|
||
|
|
||
|
.one-link:hover span {
|
||
|
box-shadow:var(--Links-Bottom-Border) 0px calc((var(--Links-Font-Size) * 1.7) / -2) 0px inset;
|
||
|
}
|
||
|
|
||
|
.one-link, .one-link span, .one-link:hover {
|
||
|
-webkit-transition: box-shadow 0.25s ease-in-out;
|
||
|
-moz-transition: box-shadow 0.25s ease-in-out;
|
||
|
-o-transition: box-shadow 0.25s ease-in-out;
|
||
|
}
|
||
|
|
||
|
/*------------ CUSTOM LINKS [BOTTOM RIGHT] ------------*/
|
||
|
.corner-links {
|
||
|
position:fixed;
|
||
|
bottom:0;margin-bottom:var(--Window-Margin-Bottom);
|
||
|
right:0;margin-right:var(--Window-Margin-Sides);
|
||
|
display:flex;
|
||
|
align-items:center;
|
||
|
}
|
||
|
|
||
|
.one-cornerlink {
|
||
|
display:flex;
|
||
|
align-items:center;
|
||
|
margin-left:var(--Corner-Links-Spacing);
|
||
|
padding:var(--Corner-Links-Outer-Padding) calc(var(--Corner-Links-Outer-Padding) * 1.5);
|
||
|
background:var(--Corner-Links-Background);
|
||
|
border-radius:var(--Corner-Links-Outer-Padding);
|
||
|
line-height:1em;
|
||
|
}
|
||
|
|
||
|
.one-cornerlink, .one-cornerlink > *, .one-cornerlink > *:hover {
|
||
|
-webkit-transition: all 0.1s ease-in-out;
|
||
|
-moz-transition: all 0.1s ease-in-out;
|
||
|
-o-transition: all 0.1s ease-in-out;
|
||
|
}
|
||
|
|
||
|
.one-cornerlink:hover {
|
||
|
background:var(--Corner-Links-Background-Hover);
|
||
|
}
|
||
|
|
||
|
.one-cornerlink i {
|
||
|
margin-right:var(--Corner-Links-Symbol-Right-Gap);
|
||
|
padding:var(--Corner-Links-Symbol-Padding);
|
||
|
background:var(--Corner-Links-Symbol-Background);
|
||
|
border-radius:100%;
|
||
|
font-size:var(--Corner-Links-Symbol-Size);
|
||
|
width:var(--Corner-Links-Symbol-Size);
|
||
|
height:var(--Corner-Links-Symbol-Size);
|
||
|
color:var(--Corner-Links-Symbol-Color);
|
||
|
}
|
||
|
|
||
|
.one-cornerlink:hover i {
|
||
|
color:var(--Corner-Links-Symbol-Hover);
|
||
|
background:var(--Corner-Links-Symbol-Background-Hover);
|
||
|
}
|
||
|
|
||
|
.one-cornerlink span, .one-cornerlink span > * {
|
||
|
font-size:var(--Corner-Links-Font-Size);
|
||
|
color:var(--Corner-Links-Text);
|
||
|
}
|
||
|
|
||
|
.one-cornerlink:hover span, .one-cornerlink:hover span > * {
|
||
|
color:var(--Corner-Links-Text-Hover);
|
||
|
}
|
||
|
|
||
|
</style>
|
||
|
|
||
|
</head>
|
||
|
|
||
|
<body>
|
||
|
|
||
|
<!-- background image is NOT edited here -->
|
||
|
<!-- look for .background-image (go up) -->
|
||
|
<div class="background-image"></div>
|
||
|
|
||
|
<a class="glenjadot" href="//glenthemes.tumblr.com" title="coded by glenthemes">
|
||
|
<div class="bloop"></div>
|
||
|
</a>
|
||
|
|
||
|
|
||
|
<div class="clock">
|
||
|
<div class="timeandshit">
|
||
|
|
||
|
<!--🍎🍎🍎🍎🍎🍎🍎-->
|
||
|
|
||
|
<!----------- TIME ----------->
|
||
|
<!--
|
||
|
Step 1: go to //24timezones.com/clock-widget/text
|
||
|
Step 2: choose your time zone
|
||
|
Step 3: DO NOT touch the other options
|
||
|
Step 4: in the "your website" box, just type google.com
|
||
|
Step 5: click "Get Code"
|
||
|
Step 6: Replace the following. Done!
|
||
|
|
||
|
Note: if you use clocks from any other sites, they may break
|
||
|
-->
|
||
|
|
||
|
<!--paste start point-->
|
||
|
<a href="//24timezones.com/current_time/united_kingdom_manchester_clock.php" style="text-decoration: none" class="clock24" id="tz24-1589998133-c216152-eyJob3VydHlwZSI6MTIsInNob3dkYXRlIjoiMCIsInNob3dzZWNvbmRzIjoiMCIsInNob3d0aW1lem9uZSI6IjEiLCJ0eXBlIjoiZCIsImxhbmciOiJlbiJ9" title="time in Manchester" target="_blank" rel="nofollow">Manchester</a>
|
||
|
<script type="text/javascript" src="//w.24timezones.com/l.js" async></script>
|
||
|
<!--paste end point-->
|
||
|
|
||
|
</div><!--do not delete this line-->
|
||
|
|
||
|
|
||
|
<div class="divider"></div>
|
||
|
|
||
|
|
||
|
<div class="date">
|
||
|
<div class="weekday">
|
||
|
|
||
|
<!--🍎🍎🍎🍎🍎🍎🍎-->
|
||
|
|
||
|
<!----------- WEEKDAY / DAY OF WEEK ----------->
|
||
|
<!--
|
||
|
Step 1: REFRESH //24timezones.com/clock-widget/text
|
||
|
Step 2: choose your time zone
|
||
|
Step 3: in "Show date", select "YES, SHOW DATE"
|
||
|
Step 4: do not touch other options
|
||
|
Step 5: in the "your website" box, just type google.com
|
||
|
Step 6: click "Get Code"
|
||
|
Step 7: Replace the following. Done!
|
||
|
|
||
|
Note: you CANNOT use the same code as you pasted above
|
||
|
(the clock will disappear if you do)
|
||
|
you must refresh the clock website and generate a new code
|
||
|
-->
|
||
|
|
||
|
<!--paste start point-->
|
||
|
<a href="//24timezones.com/current_time/united_kingdom_manchester_clock.php" style="text-decoration: none" class="clock24" id="tz24-1589998712-c216152-eyJob3VydHlwZSI6MTIsInNob3dkYXRlIjoiMSIsInNob3dzZWNvbmRzIjoiMCIsInNob3d0aW1lem9uZSI6IjEiLCJ0eXBlIjoiZCIsImxhbmciOiJlbiJ9" title="World Time :: Manchester" target="_blank" rel="nofollow">Current time in Manchester</a>
|
||
|
<script type="text/javascript" src="//w.24timezones.com/l.js" async></script>
|
||
|
<!--paste end point-->
|
||
|
|
||
|
</div><!--do not delete this line-->
|
||
|
|
||
|
|
||
|
|
||
|
<div class="monthday">
|
||
|
<!--🍎🍎🍎🍎🍎🍎🍎-->
|
||
|
|
||
|
<!----------- DATE NUMBER + MONTH ----------->
|
||
|
<!--
|
||
|
Step 1: REFRESH //24timezones.com/clock-widget/text
|
||
|
Step 2: choose your time zone
|
||
|
Step 3: in "Show date", select "YES, SHOW DATE"
|
||
|
Step 4: do not touch other options
|
||
|
Step 5: in the "your website" box, just type google.com
|
||
|
Step 6: click "Get Code"
|
||
|
Step 7: Replace the following. Done!
|
||
|
|
||
|
Note: you CANNOT use the same code as you pasted above
|
||
|
(the clock will disappear if you do)
|
||
|
you must refresh the clock website and generate a new code
|
||
|
-->
|
||
|
|
||
|
<!--paste start point-->
|
||
|
<a href="//24timezones.com/current_time/united_kingdom_manchester_clock.php" style="text-decoration: none" class="clock24" id="tz24-1589998903-c216152-eyJob3VydHlwZSI6MTIsInNob3dkYXRlIjoiMSIsInNob3dzZWNvbmRzIjoiMCIsInNob3d0aW1lem9uZSI6IjEiLCJ0eXBlIjoiZCIsImxhbmciOiJlbiJ9" title="Manchester clock" target="_blank" rel="nofollow">Current time in Manchester</a>
|
||
|
<script type="text/javascript" src="//w.24timezones.com/l.js" async></script>
|
||
|
<!--paste end point-->
|
||
|
|
||
|
</div><!--do not delete this line-->
|
||
|
</div><!--date-->
|
||
|
</div><!--clock-->
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
<div id="cent-a">
|
||
|
<div id="cent-b">
|
||
|
<div class="thestuff">
|
||
|
<div class="potatoe">
|
||
|
|
||
|
<!--🍎🍎🍎🍎🍎🍎🍎-->
|
||
|
|
||
|
<!---------- YOUR NAME ---------->
|
||
|
<!-- (topleft of cloud -->
|
||
|
<div class="name-badge">your name</div>
|
||
|
|
||
|
</div>
|
||
|
|
||
|
|
||
|
|
||
|
<div class="blobsquad">
|
||
|
<div class="bub-top">
|
||
|
<div class="lemon"></div>
|
||
|
</div>
|
||
|
<div class="bub-bot">
|
||
|
<div class="cheese"></div>
|
||
|
</div>
|
||
|
|
||
|
<div class="deja">
|
||
|
<div class="vu">
|
||
|
|
||
|
<!--🍎🍎🍎🍎🍎🍎🍎-->
|
||
|
|
||
|
<!---------- MAIN CLOUD/BUBBLE TEXT ---------->
|
||
|
<!--
|
||
|
Use <br> for a line break
|
||
|
|
||
|
To disable typewriter effect, change "yes" to "no"
|
||
|
|
||
|
Note: you may not see the text in the tumblr preview.
|
||
|
open your blog page in a new tab to see the changes
|
||
|
-->
|
||
|
|
||
|
<div class="text-area bub-text" typewriter="yes">This villager has moved!<br>What would you like to do?
|
||
|
|
||
|
|
||
|
</div><!--do not delete this line-->
|
||
|
|
||
|
<div id="feed" class="bub-text"></div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div><!--blobsquad-->
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
<div class="links-blob">
|
||
|
|
||
|
<!--🍎🍎🍎🍎🍎🍎🍎-->
|
||
|
|
||
|
<!---------- CLOUD/BUBBLE LINKS ---------->
|
||
|
<!--
|
||
|
link url goes between quotes marks of href=""
|
||
|
|
||
|
display text goes between <span> </span>
|
||
|
-->
|
||
|
|
||
|
<!--start one link-->
|
||
|
<a class="one-link" href="">
|
||
|
<div class="c-hold"><img class="cursor" src="//cdn.discordapp.com/attachments/382037367940448256/712491717781356615/ac_cursor_w.png"></div>
|
||
|
<span>Blob link 1.</span>
|
||
|
</a>
|
||
|
<!--end one link-->
|
||
|
|
||
|
<!--start one link-->
|
||
|
<a class="one-link" href="">
|
||
|
<div class="c-hold"><img class="cursor" src="//cdn.discordapp.com/attachments/382037367940448256/712491717781356615/ac_cursor_w.png"></div>
|
||
|
<span>Blob link 2.</span>
|
||
|
</a>
|
||
|
<!--end one link-->
|
||
|
|
||
|
|
||
|
</div><!--links-blob-->
|
||
|
</div><!--thestuff-->
|
||
|
</div><!--bubble-end1-->
|
||
|
</div><!--bubble-end2-->
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
<div class="corner-links">
|
||
|
|
||
|
<!--🍎🍎🍎🍎🍎🍎🍎-->
|
||
|
|
||
|
<!-------- CUSTOM LINKS [BOTTOM RIGHT] -------->
|
||
|
|
||
|
<!--
|
||
|
instructions for changing symbols/icons:
|
||
|
Step 1: go to fontawesome.com/icons
|
||
|
Step 2: type in / search for an icon you want
|
||
|
Step 3: click it; you will see something that starts with <i class
|
||
|
Step 4: click it to copy, then paste it below
|
||
|
|
||
|
link url goes between quotes marks of href=""
|
||
|
-->
|
||
|
|
||
|
<!--start one link-->
|
||
|
<a class="one-cornerlink" href="">
|
||
|
<i class="fab fa-steam-symbol"></i>
|
||
|
<span>Link text</span>
|
||
|
</a>
|
||
|
<!--end one link-->
|
||
|
|
||
|
<!--start one link-->
|
||
|
<a class="one-cornerlink" href="">
|
||
|
<i class="fab fa-discord"></i>
|
||
|
<span>Link text</span>
|
||
|
</a>
|
||
|
<!--end one link-->
|
||
|
|
||
|
</div><!--do not delete this line-->
|
||
|
|
||
|
</body>
|
||
|
</html>
|