equinoxhq.github.io/style.css at main · equinoxhq/equinoxhq.github.io · GitHub

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
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
/* THIS CSS IS A CRIME AGAINST HUMANITY */

/* font from ggle inc */
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");

/* icon from gogle */
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined");

/* stuff */
:root {
    --dc-font: "Adwaita Sans", "Inter", ui-sans-serif, system-ui, sans-serif;
    --dc-font-mono: "Adwaita Mono", "Iosevka Mono", ui-monospace,
        "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace;
    --dc-tx-1: light-dark(##323232, #ffffff);
    --dc-tx-2: light-dark(##2b2b2b, #ffffff);
    --dc-lk-1: light-dark(#3584e4, #3584e4);
    --dc-bg-3: display(none);
    --dc-bg-1: light-dark(#ffffff, #363636);
    --dc-bg-2: light-dark(#fafafa, #222226);
    --dc-ac-1: #364d6a; /* temp fix */
    /*--dc-ac-1: light-dark(#c2daf7, #364d6a)*/

    --full-mono: light-dark(#000, #fff);
    --active-button: light-dark(#e6e6e6, #3a3a3a);
    --darker-text: light-dark(#8f8f91, #a4a4a5);
}

.material-symbols-outlined {
    font-variation-settings:
        "FILL" var(--full-mono),
        "wght" 400,
        "GRAD" 0,
        "opsz" 24;
}

.icon-color {
    color: var(--full-mono);
}

.nav-icon {
    width: 1.2em;
    height: 1.2em;
}

.active-button {
    background-color: var(--active-button);
    border-radius: 6px;
}

.important-button {
    background-color: var(--dc-lk-1);
    border-radius: 6px;
}

.darker-text {
    color: var(--darker-text);
}

.flex-container {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* other */
a {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

a:active {
    text-decoration: none;
}

::before {
    display: none;
}

body main {
    border-radius: 12px;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
}

nav {
    margin-top: 6px;
    margin-bottom: -4px;
    line-height: 1.3;
}

ul li a {
    color: var(--dc-tx-1);
    display: block;
    padding: 8px 14px;
}

nav ul li {
    font-weight: bold;
    margin: 0% 25%;
    border-radius: 6px;
    transition: ease-in 0.1s;
}

nav ul li:hover {
    background-color: var(--active-button);
}

nav ul li a {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
}