aboutsummaryrefslogtreecommitdiff
path: root/assets/css/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'assets/css/style.css')
-rw-r--r--assets/css/style.css144
1 files changed, 118 insertions, 26 deletions
diff --git a/assets/css/style.css b/assets/css/style.css
index 7cc08e9..8c4011a 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1,48 +1,140 @@
+/* Root */
+:root
+{
+ /* Dark mode */
+ --dark-bg: #0d0d0d;
+ --dark-text: #ffdab9;
+ --dark-link: black;
+ --dark-link-bg: #f08080;
+ --dark-title: #f08080;
+ --dark-quote-border: #fbc4ab;
+
+ /* Light mode */
+ --light-bg: #ffdab9;
+ --light-text: #0d0d0d;
+ --light-link: white;
+ --light-link-bg: white;
+ --light-title: white;
+ --light-quote-border: white;
+
+ /* Default mode */
+ --bg-color: var(--dark-bg);
+ --text-color: var(--dark-text);
+ --link-color: var(--dark-link);
+ --link-bg-color: var(--dark-link-bg);
+ --title-color: var(--dark-title);
+ --quote-border: var(--dark-quote-border);
+ --switch-icon: var(--dark-switch-icon);
+ --switch-text: var(--dark-switch-text);
+}
+
+/* Body */
body
{
+ color: var(--text-color);
+ background-color: var(--bg-color);
+
margin: 2vh auto;
max-width: 80vw;
- color:#00072D;
- background-color: #C2EAFF;
}
-h1, footer
+/*
+ HEADER
+*/
+
+/* Navbar */
+nav ul
{
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+
+ display: flex;
+ justify-content: space-between;
+}
+
+nav a
+{
+ padding: 0.1rem 1rem;
+ margin: 0rem 0.3rem;
+
text-align: center;
+ text-decoration: none;
+ text-transform: uppercase;
+
+ background-color: var(--link-bg-color);
+ color: var(--link-color);
}
-a
+nav a:hover
{
- color: #87B37A;
- text-decoration: none;
+ color: var(--link-bg-color);
+ background-color: var(--bg-color);
+ border: 1px solid var(--link-bg-color);
}
-a:hover
-{
- text-decoration:underline;
+/*
+ MAIN
+*/
+
+main h1, main h2, main h3, main h4
+{
+ color: var(--title-color);
+}
+
+main h1
+{
+ text-align: center;
+ text-transform: uppercase;
}
-.center {
- display: block;
- margin-left: auto;
- margin-right: auto;
- width: 60%;
+main a
+{
+ color: var(--link-bg-color);
}
-.header{
- margin: 1em 0;
- display: block;
- width:100%;
+/* Date for link */
+main li a + p
+{
+ display: inline;
+ margin: 1vw;
+
+ font-size: small;
}
-.navbar{
- display: flex;
- justify-content: space-between;
- font-weight: bold;
+/* Blockquote */
+main blockquote
+{
+ padding-left: 1vw;
+
+ background-color: var(--link-bg-color);
+ color: var(--link-color);
+ border-left: 2px solid var(--quote-border);
}
-blockquote {
- border-left: 3px solid #0077b6;
- padding-left: 10px;
- background-color: #90e0ef;
+/*
+ FOOTER
+*/
+
+footer
+{
+ text-align: center;
}
+
+footer li
+{
+ display: inline;
+}
+
+footer li a
+{
+ padding: 0.1rem 1rem;
+ margin: 0rem 0.3rem;
+
+ text-align: center;
+ text-decoration: none;
+ text-transform: uppercase;
+
+ background-color: var(--link-bg-color);
+ color: var(--link-color);
+} \ No newline at end of file
ArKa projects. All rights to me, and your next child right arm.