From e354c941c90cf2e91194a2d87a52c78e1d016704 Mon Sep 17 00:00:00 2001 From: HT Date: Tue, 17 Oct 2023 20:36:38 +0100 Subject: [PATCH] =?UTF-8?q?=E2=82=8A=E2=81=BA=E2=9C=BF=CB=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- faq-pages/01-faq | 405 +++++++++++++++++++++++++++++------------------ 1 file changed, 253 insertions(+), 152 deletions(-) diff --git a/faq-pages/01-faq b/faq-pages/01-faq index 481fd4a..1a8bf28 100644 --- a/faq-pages/01-faq +++ b/faq-pages/01-faq @@ -1,9 +1,13 @@ - +https://docs.google.com/presentation/d/1GCoSQkmeSqPe4sgVbh6attsJ8q064Z-pIzJHBQWexSQ/edit?usp=sharing +-------------------------------------------------------------------> @@ -45,11 +46,11 @@ attribute:"title" })(jQuery); - + - + - + @@ -63,11 +64,11 @@ attribute:"title" margin:20px; background-color:var(--Tooltip-Background); border:1px solid var(--Tooltip-Border); - font-family:canela; - font-size:9px; - letter-spacing:1px; + font-family:"tenor sans"; + font-size:var(--Tooltip-Font-Size); + letter-spacing:.5px; text-transform:uppercase; - color:var(--Tooltip-Text); + color:var(--Tooltip-Text-Color); z-index:99; max-width:40vw; } @@ -82,8 +83,15 @@ iframe#tumblr_controls, .iframe-controls--desktop { -webkit-transform:scale(0.8,0.8); transform-origin:100% 0; + opacity:0.9; z-index:999999!important; } + +.tmblr-iframe--follow-teaser, .follow-teaser, .iframe-controls--phone-mobile, .tmblr-iframe--app-cta-button { + display:none!important; + visibility:hidden!important; + height:0!important; +} /*--------------------SCROLLBAR--------------------*/ ::-webkit-scrollbar { @@ -108,46 +116,91 @@ iframe#tumblr_controls, .iframe-controls--desktop { background-color:var(--Scrollbar-Track); } -/*--------------------COLORS--------------------*/ +::-webkit-scrollbar-corner { + background:var(--Background); +} + +/*----------- CUSTOMIZATION OPTIONS -----------*/ :root { --Background:#10121F; - --Title:#d8d4d6; + --Screen-Margin:100px; + + /*----- MAIN TITLE -----*/ + --Title-Size:21px; + --Title-Color:#d8d4d6; --Title-Text-Shadow:#10121F; + --Title-Side-Gaps:20px; + --Title-Bottom-Gap:24px; --Title-Border:#d8d4d6; + + /*----- Q&A CONTAINER -----*/ + --FAQ-Section-Top-Gap:80px; + --Container-Width:650px; + + /*----- QUESTIONS -----*/ + --Question-Top-Gap:30px; --Q:#BEB8BB; + --Q-Size:22px; --Q-Text-Shadow:#10121F; --Question-Lines:#8F8A8C; --Question-Text:#BEB8BB; --Question-Text-Shadow:#10121F; + /*----- ANSWERS -----*/ + --Answer-Top-Gap:30px; --Answer-Lines:#8F8A8C; --Answer-Text:#BEB8BB; --Answer-Text-Shadow:#10121F; --A:#BEB8BB; + --A-Size:22px; --A-Text-Shadow:#10121F; - --Links:#e9e9e9; + /*----- TEXT FORMATTING -----*/ + --Bold:#e6c6a3; + --Italic:#dabca4; - --Custom-Links:#BEB8BB; - + --Links:#c0b492; + --Links-Underline:#666; + + /*----- MUSIC PLAYER -----*/ + --Music-Player-Edge-Distance:20px; + --Music-Player-Color:#BEB8BB; + --Music-Player-Buttons-Size:10px; + --Music-Player-Note-Icon-Size:12px; + --Music-Player-Text-Size:11px; + --Music-Player-Text-Shadow:#10121F; + --Music-Player-Gaps:9px; + + /*---- CUSTOM LINKS (LEFT) ----*/ + --Custom-Links-Font-Size:10px; + --Custom-Links-Color:#BEB8BB; + + /*----- SCROLLBAR -----*/ + /* doesn't work on firefox */ --Scrollbar-Track:#393738; --Scrollbar-Thumb:#989395; - --Music-Player:#BEB8BB; - + /*----- TOOLTIPS -----*/ + /* hover text */ --Tooltip-Background:#10121F; - --Tooltip-Border:#8F8A8C; - --Tooltip-Text:#BEB8BB; + --Tooltip-Border:#686466; + --Tooltip-Font-Size:9px; + --Tooltip-Text-Color:#BEB8BB; } /*--------------------BASICS--------------------*/ body { - background:#10121F url('//rhizo.gitlab.io/random/images/iMrKRSd.png'); + /*--- PAGE BACKGROUND COLOR ---*/ + background-color:#10121F; + + /*--- PAGE BACKGROUND IMAGE ---*/ + background-image:url('//rhizo.gitlab.io/random/images/iMrKRSd.png'); background-attachment:fixed; background-repeat:no-repeat; background-position:center; background-size:cover; + color:#888; cursor:normal; font-family:inconsolata; @@ -175,17 +228,24 @@ a, .sq { -o-transition: all 0.4s ease-in-out; } -b, strong { - font-weight:bold; +a[title] > * { + pointer-events:none; } -i, em {color:;} +b, strong { + color:var(--Bold); +} + +i, em { + color:var(--Italic); +} pre, code { white-space:pre-wrap; display:block; } +p:first-child {margin-top:0px;} p:last-child {margin-bottom:0px;} /*--------------------CONTAINER--------------------*/ @@ -199,48 +259,77 @@ p:last-child {margin-bottom:0px;} #cont-h-2 {display:inline-block;} -#box {margin-top:14vh;} - +#box {margin-top:var(--Screen-Margin);} /*-----TITLE-----*/ -#title:before {content:".:"} -#title:after {content:":."} -#title:before, #title:after {margin:20px;} - -#title { - display:inline-block; - font-family:canela; - font-size:21px; - text-transform:uppercase; - letter-spacing:3px; - color:var(--Title); - text-shadow:1px 1px 1px var(--Title-Text-Shadow); +#title-wrap, #title { + position:relative; } -#title-border { - margin:24px auto auto auto; +#title-wrap { + display:inline-block; + padding:0 calc((var(--Title-Side-Gaps) * 2) + var(--Title-Size)); +} + +#title-wrap:after { + content:""; + position:absolute; + margin-bottom:calc(0px - var(--Title-Bottom-Gap)); + bottom:0;left:0; + width:100%; height:1px; background:-webkit-linear-gradient(left, transparent 0%, var(--Title-Border) 50%, transparent 100%); } +#title { + font-family:canela; + font-size:var(--Title-Size); + text-transform:uppercase; + letter-spacing:3px; + color:var(--Title-Color); + text-shadow:1px 1px 1px var(--Title-Text-Shadow); +} + +#title:before { + content:".:"; + position:absolute; + right:100%; + margin-right:var(--Title-Side-Gaps); + bottom:0; +} + +#title:after { + content:":."; + position:absolute; + left:100%; + margin-left:var(--Title-Side-Gaps); + bottom:0; +} + /*-----Q&A MAIN CONTAINER-----*/ #contwrap { - padding-top:8px; - margin-bottom:14vh; - width:650px; + padding-top:var(--Title-Bottom-Gap); + margin-bottom:var(--FAQ-Section-Top-Gap); + width:var(--Container-Width); } #contwrap > .one-question { - max-width:calc((650px / 2) + 70px); + max-width:calc((var(--Container-Width) / 2) + 70px); } #contwrap > .one-answer { - width:calc((650px / 2) + 70px); + width:calc((var(--Container-Width) / 2) + 70px); +} + +#contwrap a { + color:var(--Links); + padding-bottom:0.25em; + border-bottom:1px solid var(--Links-Underline); } /*-----QUESTION STYLING-----*/ .one-question { - margin-top:30px; + margin-top:var(--Question-Top-Gap); display:flex; } @@ -248,12 +337,16 @@ p:last-child {margin-bottom:0px;} margin-top:12px; font-family:canela; text-transform:uppercase; - font-size:22px; - letter-spacing:5px; + font-size:var(--Q-Size); color:var(--Q); text-shadow:1px 1px 1px var(--Q-Text-Shadow); } +.q-marker[dot]:after { + content:"."; + margin-left:5px; +} + .line-beef { margin-top:22px; margin-left:14px; @@ -294,8 +387,8 @@ p:last-child {margin-bottom:0px;} /*-----ANSWER STYLING-----*/ .one-answer { - margin-top:30px; - margin-left:calc((650px / 2) - 70px); + margin-top:var(--Answer-Top-Gap); + margin-left:calc((var(--Container-Width) / 2) - 70px); display:flex; } @@ -347,12 +440,16 @@ p:last-child {margin-bottom:0px;} margin-bottom:12px; font-family:canela; text-transform:uppercase; - font-size:22px; - letter-spacing:5px; + font-size:var(--A-Size); color:var(--A); text-shadow:1px 1px 1px var(--A-Text-Shadow); } +.a-marker[dot]:after { + content:"."; + margin-left:5px; +} + /*-----CUSTOM LINKS-----*/ #cl-a { position:fixed; @@ -367,10 +464,10 @@ p:last-child {margin-bottom:0px;} vertical-align:middle; } -#customlinks { +.customlink { padding:10px 0; display:flex; - color:var(--Custom-Links); + color:var(--Custom-Links-Color); } .sq { @@ -378,58 +475,47 @@ p:last-child {margin-bottom:0px;} -webkit-align-self:center; width:10px; height:10px; - border:1px solid var(--Custom-Links); + border:1px solid var(--Custom-Links-Color); border-radius:3px; } -#customlinks:hover .sq {background:var(--Custom-Links);} +.customlink:hover .sq {background:var(--Custom-Links-Color);} .sq-a { margin-left:15px; margin-top:1px; font-family:canela; text-transform:uppercase; - font-size:10px; + font-size:var(--Custom-Links-Font-Size); letter-spacing:2px; } /*-------MUSIC PLAYER-------*/ -#glenplayer02 { - position:fixed; - bottom:0;margin-bottom:20px; - left:0;margin-left:20px; - display:flex; - z-index:99; -} -#glenplayer02 a {text-decoration:none;} - -#glenplayer02 > div { - align-self:center; - -webkit-align-self:center; +[music-player]{ + position:fixed; + bottom:0;margin-bottom:var(--Music-Player-Edge-Distance); + left:0;margin-left:var(--Music-Player-Edge-Distance); + color:var(--Music-Player-Color); + z-index:10; } -.music-controls { - user-select:none; - -webkit-user-select:none; - width:13px; - font-size:13px; - cursor:pointer; +.note-icon { + transform:perspective(0); + margin-top:-0.5px; } -.playy, .pausee {color:var(--Music-Player);} - -.pausee {display:none;} - -.sonata { - margin-left:10px; - color:var(--Music-Player); +.note-icon svg { + display:block; + width:var(--Music-Player-Note-Icon-Size); + height:var(--Music-Player-Note-Icon-Size); + line-height:0; } -.labeltext { - margin-left:8px; - font-family:courier new; - font-size:9px; - color:var(--Music-Player); +.music-title { + font-family:"Chivo Mono"; + font-size:var(--Music-Player-Text-Size); + letter-spacing:.3px; + text-shadow:1px 1px 1px var(--Music-Player-Text-Shadow); } @@ -442,26 +528,22 @@ p:last-child {margin-bottom:0px;}
- -
-
index
- + + index + - -
-
message
- + + message + - -
-
archive
- + + archive + - -
-
credit
- + + credit +
@@ -469,18 +551,24 @@ p:last-child {margin-bottom:0px;} -
-
-
►
-
❚❚
-
-
♫
-
Sound of Crumbling Lies
-
- - - - +
+
+
+ +
+ + + + + +
+ +
+ + Sound of Crumbling Lies +
+ +
@@ -488,50 +576,63 @@ p:last-child {margin-bottom:0px;}
-
Questions
-
+
+
+ + + Questions + +
+
+ +
-
Q.
-
-
-
-
This is a sample question.
-
-
-
+
Q
+
+ This is a sample question. +
+ bold +
+ italic +
+ sample link +
+
+
-
-
-
And this is an answer.
-
-
-
-
A.
-
+
+ + And this is an answer + +
+ +
A
+
+ + +
-
Q.
-
-
-
-
This is a sample question.
-
-
-
+
Q
+
+ This is a sample question. +
+
+
-
-
-
And this is an answer.
-
-
-
-
A.
-
+
+ And this is an answer +
+ +
A
+ + +