css/main.scss


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88

@import "fonts";

$achernarColour: #007B34;

:root {
	font-family: "Raleway", "sans-serif";
}

* {
	margin:  0;
	padding: 0;

	box-sizing: border-box;
}

#body {
	background-color: var(--backgroundColour);
	color:            var(--textColour);
	z-index:          -1;

	&[data-theme = "light"] {
		--backgroundColour: oklch(100%     0 0);
		--foregroundColour: oklch( 96.875% 0 0);
		--textColour:       oklch( 25%     0 0);
	}

	&[data-theme = "dark"] {
		--backgroundColour: oklch( 20% 0.041075 270);
		--foregroundColour: oklch( 25% 0.041075 270);
		--textColour:       oklch(100% 0          0);
	}

	&[data-page = "about"] {
		--pageHighlightColour: #FFFFFF;
	}

	&[data-page = "ax"] {
		--pageHighlightColour: #FFFFFF;
	}

	&[data-page = "backspace"] {
		--pageHighlightColour: var(--textColour);
	}

	&[data-page = "benoit"] {
		--pageHighlightColour: #FFFFFF;
	}

	&[data-page = "bowshock"] {
		--pageHighlightColour: #FFEEE0;
	}

	&[data-page = "bzipper"] {
		--pageHighlightColour: #B4202D;
	}

	&[data-page = "deltaWorld"] {
		--pageHighlightColour: var(--textColour);
	}

	&[data-page = "eas"] {
		--pageHighlightColour: #00291B;
	}

	&[data-page = "luma"] {
		--pageHighlightColour: #FFFFFF;
	}

	&[data-page = "pollex"] {
		--pageHighlightColour: #FFFFFF;
	}

	&[data-page = "u8c"] {
		--pageHighlightColour: #A9E13D;
	}
}

ol, ul {
	list-style-type: none;
}

li p::before {
	content: "\2014\0020";
}

@import "navigationBar.scss";
@import "frontPage.scss";
@import "content.scss";