mirror of
https://gitlab.com/octtspacc/sitoctt
synced 2025-06-05 22:09:20 +02:00
Agg. Devlogs, Home; Lavoro tema WM
This commit is contained in:
41
Assets/Assets/Pages/index.css
Normal file
41
Assets/Assets/Pages/index.css
Normal file
@@ -0,0 +1,41 @@
|
||||
.BlinkA {
|
||||
Animation: BlinkerA 0.25s Step-Start Infinite;
|
||||
}
|
||||
@keyframes BlinkerA {
|
||||
0% {Position: Absolute; Visibility: Hidden;}
|
||||
50% {Position: Static; Visibility: Visible;}
|
||||
100% {Position: Absolute; Visibility: Hidden;}
|
||||
}
|
||||
.BlinkO {
|
||||
Animation: BlinkerO 0.25s Step-Start Infinite;
|
||||
}
|
||||
@keyframes BlinkerO {
|
||||
0% {Position: Static; Visibility: Visible;}
|
||||
50% {Position: Absolute; Visibility: Hidden;}
|
||||
100% {Position: Static; Visibility: Visible;}
|
||||
}
|
||||
|
||||
/*--- Credits: https://codepen.io/jh3y/pen/WNrXqYz ---*/
|
||||
.WavyText {
|
||||
Text-Align: Center;
|
||||
Position: Absolute;
|
||||
Left: 50%;
|
||||
White-Space: NoWrap;
|
||||
Transform: Translate(-50%, -50%) Translate(Calc(Var(--x, 0) * 1%), Calc(Var(--y, 0) * 1%));
|
||||
font-variation-settings: 'wght' Var(--lower);
|
||||
Margin: 0;
|
||||
}
|
||||
.WavyText Span {
|
||||
Color: HSLA(300, 100%, 20%, Var(--alpha-l));
|
||||
Animation: Rise 2.25s infinite ease-in-out;
|
||||
Animation-Delay: Calc((Var(--index) - 6) * 0.225s);
|
||||
Display: Inline-Block;
|
||||
}
|
||||
@keyframes Rise {
|
||||
50% {
|
||||
font-variation-settings: 'wght' Var(--upper);
|
||||
Color: HSLA(300, 100%, 30%, Var(--alpha-u));
|
||||
Transform: Translate(0, -15%);
|
||||
}
|
||||
}
|
||||
/*--- -------------------------------------------- ---*/
|
@@ -6,7 +6,7 @@
|
||||
--WindowPadding: 4px;
|
||||
--WindowBorderSize: 4px;
|
||||
|
||||
--TitleBarHeight: 28px;
|
||||
--TitleBarHeight: 32px;
|
||||
--TitleBarForeground: #FFFFFF;
|
||||
--TitleBarBackground: #2A0A3A;
|
||||
|
||||
@@ -23,8 +23,10 @@ Body {
|
||||
Margin: 0;
|
||||
Padding: 0;
|
||||
Overflow-Y: Hidden;
|
||||
Background-Image: url(/home/octt/Dev/sitoctt-assets/public/Media/Backgrounds/Circles-Purple.png);
|
||||
Background-Repeat: Repeat;
|
||||
}
|
||||
|
||||
.NoDisplay {
|
||||
Display: None;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------*/
|
||||
@@ -42,8 +44,8 @@ Body {
|
||||
Background: #EEE0FF;
|
||||
}
|
||||
.WindowContent {
|
||||
Min-Width: Calc(100% + Var(--WindowPadding) + Var(--WindowPadding) + Var(--WindowBorderSize) + Var(--WindowBorderSize));
|
||||
Padding: Var(--WindowPadding);
|
||||
Min-Width: Calc(100% + Var(--WindowPadding)*2 + Var(--WindowBorderSize)*2);
|
||||
Padding: Calc(Var(--WindowPadding)*2);
|
||||
Overflow-Y: Auto;
|
||||
Margin-Left: Calc(0px - Var(--WindowPadding) - Var(--WindowBorderSize));
|
||||
Margin-Top: Var(--WindowBorderSize);
|
||||
@@ -59,14 +61,17 @@ Body {
|
||||
Padding: Var(--WindowPadding);
|
||||
Color: Var(--TitleBarForeground);
|
||||
Background: Var(--TitleBarBackground);
|
||||
Text-Align: Center;
|
||||
Vertical-Align: Top;
|
||||
Max-Height: Var(--TitleBarHeight);
|
||||
}
|
||||
.TitleBar > span:nth-child(1) {
|
||||
.TitleBarContent {
|
||||
Text-Align: Center;
|
||||
}
|
||||
|
||||
.TitleBarContent > Span:Nth-Child(1) {
|
||||
Float: Left;
|
||||
}
|
||||
.TitleBar > span:nth-child(4) {
|
||||
.TitleBarContent > Span:Nth-Child(3) {
|
||||
Float: Right;
|
||||
}
|
||||
|
||||
@@ -85,15 +90,38 @@ Body {
|
||||
Position: Fixed;
|
||||
Left: 0px;
|
||||
Bottom: Var(--TaskBarHeight);
|
||||
Padding: Var(--WindowPadding);
|
||||
Padding: Calc(Var(--WindowPadding)*2);
|
||||
Color: Var(--TaskBarForeground);
|
||||
Background: Var(--TaskBarBackground);
|
||||
Max-Height: Calc(90vh - Var(--TaskBarHeight));
|
||||
Overflow-Y: Scroll;
|
||||
}
|
||||
.TaskBarMenu A {
|
||||
Color: #DDCCFF !Important;
|
||||
}
|
||||
.MenuButton {
|
||||
Display: Inline-Block;
|
||||
Height: 100%;
|
||||
}
|
||||
|
||||
/*--- "Shade window" button --------------------------*/
|
||||
.CheckToggle {
|
||||
Position: Fixed;
|
||||
Opacity: 0;
|
||||
Visibility: Hidden;
|
||||
}
|
||||
.CheckLabel:Before {
|
||||
Content: '🔼';
|
||||
}
|
||||
:Checked ~ .TitleBarContent > Span > .CheckLabel:Before {
|
||||
Content: '🔽' !Important;
|
||||
}
|
||||
:Checked ~ .ToggleBox {
|
||||
Display: None;
|
||||
Visibility: Hidden;
|
||||
}
|
||||
/**** -------------------------------------------- ****/
|
||||
|
||||
/*--------------------------------------------------------*/
|
||||
|
||||
|
||||
@@ -102,25 +130,9 @@ Body {
|
||||
* Fritto Misto - Andrebbe ordinato *
|
||||
*--------------------------------------------------------*/
|
||||
|
||||
.CheckLabel:Before {
|
||||
Content: '🔼';
|
||||
}
|
||||
#MainWindowCheck {
|
||||
Position: Fixed;
|
||||
Opacity: 0;
|
||||
}
|
||||
|
||||
:Checked ~ Span > .CheckLabel:Before {
|
||||
Content: '🔽' !Important;
|
||||
}
|
||||
:Checked ~ .ToggleBox {
|
||||
Display: None;
|
||||
Visibility: Hidden;
|
||||
}
|
||||
|
||||
/* No selezione */
|
||||
.NoSelect,
|
||||
.TitleBar,
|
||||
.TitleBarContent,
|
||||
.TaskBar,
|
||||
#TitlesWindow {
|
||||
-webkit-touch-callout: none;
|
||||
@@ -139,7 +151,7 @@ Body {
|
||||
Max-Height: 90vh;
|
||||
Z-Index: 16;
|
||||
}
|
||||
#MainWindow > .WindowContent {
|
||||
#MainWindow .WindowContent {
|
||||
Max-Height: Calc(90vh - Calc(Var(--TitleBarHeight) * 2) - Var(--WindowPadding));
|
||||
}
|
||||
|
||||
@@ -151,7 +163,7 @@ Body {
|
||||
Max-Height: 60vh;
|
||||
Z-Index: 8;
|
||||
}
|
||||
#TitlesWindow > .WindowContent {
|
||||
#TitlesWindow .WindowContent {
|
||||
Max-Height: Calc(60vh - Calc(Var(--TitleBarHeight) * 2) - Var(--WindowPadding));
|
||||
}
|
||||
|
||||
|
@@ -32,6 +32,13 @@ Body {
|
||||
Overflow-Wrap: Break-Word;
|
||||
}
|
||||
|
||||
.NoDisplay {
|
||||
Display: None;
|
||||
}
|
||||
.NoCol {
|
||||
Color: Transparent !Important;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------*/
|
||||
|
||||
|
||||
@@ -55,12 +62,6 @@ Summary > H1, Summary > H2, Summary > H3, Summary > H4, Summary > H5, Summary >
|
||||
Display: Inline;
|
||||
}
|
||||
|
||||
.NoDisplay {
|
||||
Display: None;
|
||||
}
|
||||
.NoCol {
|
||||
Color: Transparent !Important;
|
||||
}
|
||||
A {
|
||||
Color: #D000D0;
|
||||
}
|
||||
@@ -96,16 +97,16 @@ Pre.Code, .CodeScroll {
|
||||
Padding-Bottom: 16px;
|
||||
}
|
||||
|
||||
#MainBox A:not(
|
||||
#MainBox A:Not(
|
||||
.NoLinkLink, .NoLinkLink A,
|
||||
.SectionLink A,
|
||||
#StatCounter A,
|
||||
#RingsDiv A,
|
||||
.SectionTitle > A
|
||||
)::Before {
|
||||
#RingsDiv A
|
||||
):Before {
|
||||
Content: '🔗 ';
|
||||
}
|
||||
|
||||
/* Clickable link at the left of every section title */
|
||||
.SectionTitle:Target {
|
||||
Color: #EEDDFF !Important;
|
||||
Background: #700070 !Important;
|
||||
@@ -407,29 +408,4 @@ H1, H2, H3, A, Img, Video, Summary {
|
||||
100% {Position: Static; Visibility: Visible;}
|
||||
}
|
||||
|
||||
/*--- Credits: https://codepen.io/jh3y/pen/WNrXqYz ---*/
|
||||
.WavyText {
|
||||
Text-Align: Center;
|
||||
Position: Absolute;
|
||||
Left: 50%;
|
||||
White-Space: NoWrap;
|
||||
Transform: Translate(-50%, -50%) Translate(Calc(Var(--x, 0) * 1%), Calc(Var(--y, 0) * 1%));
|
||||
font-variation-settings: 'wght' Var(--lower);
|
||||
Margin: 0;
|
||||
}
|
||||
.WavyText Span {
|
||||
Color: HSLA(300, 100%, 20%, Var(--alpha-l));
|
||||
Animation: Rise 2.25s infinite ease-in-out;
|
||||
Animation-Delay: Calc((Var(--index) - 6) * 0.225s);
|
||||
Display: Inline-Block;
|
||||
}
|
||||
@keyframes Rise {
|
||||
50% {
|
||||
font-variation-settings: 'wght' Var(--upper);
|
||||
Color: HSLA(300, 100%, 30%, Var(--alpha-u));
|
||||
Transform: Translate(0, -15%);
|
||||
}
|
||||
}
|
||||
/*--- -------------------------------------------- ---*/
|
||||
|
||||
/*--------------------------------------------------------*/
|
||||
|
Reference in New Issue
Block a user