Miglioramenti CSS (tema WM, generazione dei titoli link)

Assets/Assets/WM.css

@@ -1,23 +1,33 @@
 /*--------------------------------------------------------*
- *    Costanti Globali                                    *
+ *    Globale                                             *
  *--------------------------------------------------------*/
 
 :Root {
 	--WindowPadding: 4px;
+
 	--TitleBarHeight: 28px;
+	--TitleBarForeground: #FFFFFF;
+	--TitleBarBackground: #2A0A3A;
+
+	--TaskBarForeground: #FFFFFF;
+	--TaskBarBackground: #2A0A3A;
 	--TaskBarHeight: 36px;
 }
 
-/*--------------------------------------------------------*/
-
-
+* {
+    Box-Sizing: Border-Box;
+}
 
 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;
 }
 
+/*--------------------------------------------------------*/
+
 
 
 /*--------------------------------------------------------*
@@ -26,9 +36,9 @@ Body {
 
 .Window {
 	Margin: Var(--WindowPadding);
-	Border: Solid 2px;
+	Border: Solid 3px Var(--TitleBarBackground);
 	Color: #000000;
-	Background: #FFFFFF;
+	Background: #EEE0FF;
 }
 .WindowContent {
 	Min-Width: 100%;
@@ -41,32 +51,41 @@ Body {
 
 .TitleBar {
 	Padding: Var(--WindowPadding);
-	Color: #FFFFFF;
-	Background: #000000;
+	Color: Var(--TitleBarForeground);
+	Background: Var(--TitleBarBackground);
 	Text-Align: Center;
 	Vertical-Align: Top;
 	Max-Height: Var(--TitleBarHeight);
 }
-.TitleBar span:nth-child(1) {
+.TitleBar > span:nth-child(1) {
 	Float: Left;
 }
-.TitleBar span:nth-child(3) {
+.TitleBar > span:nth-child(3) {
 	Float: Right;
 }
 
 .TaskBar {
 	Width: 100%;
-	Color: #FFFFFF;
-	Background: #000000;
+	Color: Var(--TaskBarForeground);
+	Background: Var(--TaskBarBackground);
 	Position: Fixed;
 	Bottom: 0px;
 	Padding: Var(--WindowPadding);
+	Min-Height: Var(--TaskBarHeight);
 	Max-Height: Var(--TaskBarHeight);
 	Z-Index: 256;
 }
+.TaskBar > Details > Div {
+	Position: Fixed;
+	Left: 0px;
+	Bottom: Var(--TaskBarHeight);
+	Padding: Var(--WindowPadding);
+	Color: Var(--TaskBarForeground);
+	Background: Var(--TaskBarBackground);
+}
 .MenuButton {
 	Display: Inline-Block;
-	Min-Height: 100%;
+	Height: 100%;
 }
 
 /*--------------------------------------------------------*/
@@ -77,32 +96,41 @@ Body {
  *    Fritto Misto - Andrebbe ordinato                    *
  *--------------------------------------------------------*/
 
-* {
-    Box-Sizing: Border-Box;
+/* No selezione */
+.NoSelect,
+.TitleBar,
+.TaskBar,
+#TitlesWindow {
+	-webkit-touch-callout: none;
+	-webkit-user-select: none;
+	-khtml-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	User-Select: none;
 }
 
 #MainWindow {
-	Width: 80vw;
+	Max-Width: 80vw;
 	Position: Absolute;
-	Top: 16px;
-	Right: 16px;
-	Max-Height: 80vh;
+	Top: 12px;
+	Right: 12px;
+	Max-Height: 90vh;
 	Z-Index: 16;
 }
 #MainWindow > .WindowContent {
-	Max-Height: Calc(80vh - Calc(Var(--TitleBarHeight) * 2) - Var(--WindowPadding));
+	Max-Height: Calc(90vh - Calc(Var(--TitleBarHeight) * 2) - Var(--WindowPadding));
 }
 
 #TitlesWindow {
-	Width: 50vw;
+	Max-Width: 60vw;
 	Position: Absolute;
 	Top: 80px;
-	Left: 16px;
-	Max-Height: 50vh;
+	Left: 12px;
+	Max-Height: 60vh;
 	Z-Index: 8;
 }
 #TitlesWindow > .WindowContent {
-	Max-Height: Calc(50vh - Calc(Var(--TitleBarHeight) * 2) - Var(--WindowPadding));
+	Max-Height: Calc(60vh - Calc(Var(--TitleBarHeight) * 2) - Var(--WindowPadding));
 }
 
 /*--------------------------------------------------------*/

Assets/Assets/loli-documentatrice.css

@@ -93,3 +93,19 @@ article .e-content {
 #BuildTimeLine > Span {
 	Display: Inline-Block;
 }
+
+.SectionTitle:Target {
+	Text-Decoration: Underline;
+}
+.SectionLink {
+	Opacity: 0.1;
+}
+.SectionLink:Hover {
+	Opacity: 0.8;
+}
+.SectionLink > A::Before {
+	Content: '🔗';
+}
+.SectionLink > A > Span {
+	Font-Size: 0;
+}

Assets/Assets/sitoctt.css

@@ -1,10 +1,35 @@
 /*--------------------------------------------------------*
- *    Costanti Globali                                    *
+ *    Globale                                             *
  *--------------------------------------------------------*/
 
 :Root {
 	--ScreenBorderPadding: 4px;
 	--ContentPadding: 8px;
+
+	--BodyTextColor: #080810;
+}
+
+* {
+	Box-Sizing: Border-Box;
+}
+
+::Selection {
+	Background-Color: RGBA(170, 170, 255, 0.2);
+}
+
+Body {
+	Margin: 0;
+	Box-Sizing: Border-Box;
+	Width: 100%;
+	Max-Width: 100%;
+	Position: Absolute;
+	Left: Auto;
+	Right: Auto;
+	Color: Var(--BodyTextColor);
+	Background: #eeddff;
+	Font-Size: 13pt;
+	Padding: Var(--ContentPadding);
+	Overflow-Wrap: Break-Word;
 }
 
 /*--------------------------------------------------------*/
@@ -15,26 +40,6 @@
  *    Fritto Misto - Andrebbe ordinato                    *
  *--------------------------------------------------------*/
 
-::Selection {
-	Background-Color: RGBA(170, 170, 255, 0.2);
-}
-Body {
-	Margin: 0;
-	Box-Sizing: Border-Box;
-	Width: 100%;
-	Max-Width: 100%;
-	Position: Absolute;
-	Left: Auto;
-	Right: Auto;
-	Color: #080810;
-	Background: #eeddff;
-	Font-Size: 13pt;
-	Padding: Var(--ContentPadding);
-	Overflow-Wrap: Break-Word;
-}
-Div {
-	Box-Sizing: Border-Box;
-}
 Details Div {
 	Margin: 8px;
 	Padding: 4px;
@@ -95,17 +100,22 @@ Pre.Code, .CodeScroll {
 	.NoLinkLink, .NoLinkLink A,
 	.SectionLink A,
 	#StatCounter A,
-	#RingsDiv A
+	#RingsDiv A,
+	.SectionTitle > A
 )::Before {
 	Content: '🔗 ';
 }
 
+.SectionTitle:Target {
+	Color: #EEDDFF !Important;
+	Background: #700070 !Important;
+	Text-Decoration: Underline;
+}
 .SectionLink {
 	Position: Absolute;
 	Left: -1.5em;
-	Opacity: 0.1;
+	Opacity: 0.08;
 }
-.SectionLink:Target,
 .SectionLink:Hover {
 	Opacity: 0.8;
 }
@@ -332,6 +342,7 @@ H3:hover {
 }
 
 /* No selezione */
+.NoSelect,
 #LeftBox,
 #LeftBoxContainer,
 #RightBox,
@@ -343,7 +354,7 @@ H3:hover {
 	-khtml-user-select: none;
 	-moz-user-select: none;
 	-ms-user-select: none;
-	User-select: none;
+	User-Select: none;
 }
 
 /*--------------------------------------------------------*/