aboutsummaryrefslogtreecommitdiff
path: root/docs/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'docs/style.css')
-rw-r--r--docs/style.css346
1 files changed, 236 insertions, 110 deletions
diff --git a/docs/style.css b/docs/style.css
index 74eebb9..d35af15 100644
--- a/docs/style.css
+++ b/docs/style.css
@@ -1,117 +1,243 @@
-/* Cem Keylan (C) 2019-2020 */
-
+/*
+ * Stylesheet for Carbs Linux website
+ * Copyright (c) 2019-2021 Cem Keylan
+ */
:root {
- --color0: #0A1E2B;
- --color1: #5C5B6F;
- --color2: #9B506D;
- --color3: #C34266;
- --color4: #7B9BB7;
- --color5: #BF6790;
- --color6: #6a9faf;
- --color7: #A676D2;
- --color8: #8b8288;
- --color9: #5C5B6F;
- --color10: #9B506D;
- --color11: #C34266;
- --color12: #4E708D;
- --color13: #BF6790;
- --color14: #528899;
- --color15: #c7bac3;
- --fg: #0a1e2b;
- --bg: #ffffff;
- --altbg: #bf6790;
- --link: #bf6790;
- --linkalt: #4e708d;
-}
-
-
-html {
- background-color: var(--bg);
- font-family: monospace;
- font-size: 16px;
- color: var(--fg);
- padding-bottom: 100px;
- -webkit-text-size-adjust: 100%;
- -ms-text-size-adjust: 100%;
- -ms-overflow-style: scrollbar;
- -webkit-tap-highlight-color: transparent;
-}
-.header {
- text-align: center;
-}
-.header strong{
- color: var(--color5)
-}
-.header a{
- text-decoration: none;
- text-align: center;
- color: var(--fg);
- margin-left: 10px;
- margin-right: 10px;
-}
-.header a:hover{
- text-decoration: none;
- text-align: center;
- color: var(--linkalt);
- margin-left: 10px;
- margin-right: 10px;
-}
-.border {
- padding-top: 1%;
- border-bottom: solid 2px;
- color: var(--fg);
-}
-a {
- text-decoration: none;
- font-weight: bold;
- color: var(--link);
-}
-a:hover {
- text-decoration: underline;
- font-weight: bold;
- color: var(--linkalt);
-}
-.post-title {
- text-align: center;
-}
-ul li::before {
- color: var(--color4);
-}
+ --color-carbs-color-bg: #F3F6F8;
+ --color-carbs-color-fg: #0A1E2B;
+ --color-carbs-highlight: #E9ECEE;
+ --color-carbs-pink: #BF6790;
+ --color-carbs-purple: #8C45D4;
+ --color-carbs-blue: #3F74A6;
+ --color-carbs-blue-alt: #3F41A6;
+ --color-carbs-red: #D32C2C;
+ --color-carbs-grey: #738B8B;
+ --color-carbs-green: #027A59;
+ --color-carbs-orange: #B45123; }
+ @media (prefers-color-scheme: dark) {
+ :root {
+ --color-carbs-color-bg: #0A1E2B;
+ --color-carbs-color-fg: #F3F6F8;
+ --color-carbs-highlight: #0A2830;
+ --color-carbs-pink: #BF6790;
+ --color-carbs-purple: #A6A6D2;
+ --color-carbs-blue: #6790BF;
+ --color-carbs-blue-alt: #67BCBF;
+ --color-carbs-red: #C34266;
+ --color-carbs-grey: #686868;
+ --color-carbs-green: #67BF96;
+ --color-carbs-orange: #F47A00; } }
body {
- width: 80%;
- max-width: 1050px;
- margin-left: auto;
- margin-right: auto;
- margin-top: 20px;
- overflow: none;
- overflow-y: scroll;
- padding-right: 10px;
- padding-left: 10px;
- color: var(--fg);
-}
+ margin: 0;
+ background-color: var(--color-carbs-color-bg);
+ font-family: "Noto Sans", "Open Sans", sans-serif;
+ font-size: 16px;
+ color: var(--color-carbs-color-fg);
+ -webkit-text-size-adjust: 100%;
+ -ms-text-size-adjust: 100%;
+ -ms-overflow-style: scrollbar;
+ -webkit-tap-highlight-color: transparent; }
+
+/* Reasonable line-height for better readability. */
+p, pre, li, dt, dd, table, code, address {
+ line-height: 1.5em; }
+
+p {
+ margin-top: 1em;
+ margin-bottom: 1em; }
+
+#content {
+ width: 95%;
+ margin: 0 auto;
+ margin-left: auto;
+ margin-right: auto;
+ text-align: left;
+ max-width: 50em; }
+
+.subtitle {
+ color: var(--color-carbs-color-fg);
+ font-weight: normal;
+ font-size: 16px;
+ font-style: italic; }
+
+code, pre.src {
+ padding: .2em .4em;
+ margin: 0;
+ font-size: 85%; }
+
code {
- color: var(--fg);
- content: "> ";
-}
-p,tr,td,table { color: var(--fg); }
+ background-color: var(--color-carbs-highlight);
+ border-radius: 3px; }
+
+h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
+ color: inherit; }
+ h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
+ text-decoration: none; }
+
h1 {
- color: var(--color7);
- font-weight: bolder;
-}
+ color: var(--color-carbs-pink);
+ font-weight: 800; }
+ h1 a:hover {
+ color: #bf6a67; }
+ @media (prefers-color-scheme: dark) {
+ h1 a:hover {
+ color: #bf6a67; } }
h2 {
- color: var(--color4);
- font-weight: bold;
-}
+ color: var(--color-carbs-blue);
+ font-weight: 700; }
+ h2 a:hover {
+ color: var(--color-carbs-purple); }
+
h3 {
- color: var(--fg);
- font-weight: bold;
-}
-.footer {
- text-align: center;
-}
-
-pre { margin-left: 2em; }
+ color: var(--color-carbs-color-fg);
+ font-weight: 600; }
+ h3 a:hover {
+ color: var(--color-carbs-blue); }
+
+pre {
+ font: monospace;
+ border-radius: 3px;
+ border: 1px solid var(--color-carbs-highlight);
+ background-color: var(--color-carbs-highlight);
+ padding: 0.5em;
+ margin: 1em; }
+ pre code, pre.src {
+ display: block;
+ overflow: auto; }
+ pre code {
+ background: transparent; }
+
+a {
+ text-decoration: none;
+ font-weight: bold;
+ color: var(--color-carbs-pink); }
+
+a:hover {
+ text-decoration: underline;
+ color: var(--color-carbs-blue-alt); }
+
blockquote {
- border-left: 1px solid var(--color6);
- font-style: italic;
-}
+ border-left: 1px solid var(--color-carbs-highlight);
+ font-style: italic; }
+
+#preamble {
+ margin-bottom: 2em; }
+
+#navbar {
+ background: #0A1E2B none repeat scroll 0 0 !important;
+ border-bottom: 5px solid #BF6790 !important;
+ min-height: 40px;
+ padding: 10px 15px !important; }
+ #navbar label, #navbar #hamburger {
+ display: none; }
+ #navbar a.navbartitle {
+ margin: 0 !important;
+ padding: 0 !important;
+ color: #BF6790 !important;
+ float: left !important;
+ font-weight: bolder !important;
+ font-size: 200% !important; }
+ #navbar a.navbartitle:hover {
+ text-decoration: none;
+ color: #BF6790; }
+ #navbar #navbarlist li a {
+ color: #F3F6F8;
+ font-weight: bold;
+ text-decoration: none; }
+ #navbar ul {
+ display: block;
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ text-align: right;
+ font-size: 0;
+ letter-spacing: 0; }
+ #navbar ul li {
+ display: inline-block;
+ font-size: 14px;
+ font-family: "Noto Sans", "Open Sans", sans-serif !important;
+ line-height: 1.4;
+ letter-spacing: 0;
+ padding-top: 14px;
+ padding-right: 15px;
+ padding-left: 15px;
+ margin: 0; }
+ #navbar ul li a:hover {
+ color: #A6A6D2 !important;
+ text-decoration: none !important; }
+
+@media screen and (max-width: 768px) {
+ #navbar label {
+ display: inline-block;
+ box-sizing: border-box;
+ color: #F3F6F8;
+ background: #BF6790;
+ border-radius: 0.2em;
+ font-style: normal;
+ text-align: center;
+ margin-right: auto;
+ margin-left: auto;
+ font-size: 1em;
+ padding: 0.5em 0;
+ font-size: 1em;
+ width: 2.2em;
+ height: 100%;
+ float: right; }
+ #navbar ul {
+ margin-left: 0;
+ margin-right: 0;
+ text-align: left; }
+ #navbar #navbarlist {
+ margin-top: 50px;
+ display: none; }
+ #navbar #navbarlist li {
+ box-sizing: border-box;
+ border-top: 1px solid var(--color-carbs-purple);
+ display: block;
+ width: 100%;
+ padding: 0.5em; }
+ #navbar input:checked ~ #navbarlist {
+ display: block; } }
+
+footer {
+ clear: both;
+ margin-top: 2em;
+ background: #0A1E2B none repeat scroll 0 0 !important;
+ border-top: 5px solid #BF6790 !important;
+ padding: 10px 15px !important;
+ bottom: 0; }
+ footer p {
+ text-align: center;
+ color: #F3F6F8; }
+
+/* Syntax highlighting for org-mode source block exports */
+.org-comment, .org-comment-delimiter {
+ color: var(--color-carbs-grey);
+ font-style: italic; }
+
+.org-builtin {
+ color: var(--color-carbs-blue); }
+
+.org-constant {
+ color: var(--color-carbs-pink); }
+
+.org-doc {
+ color: var(--color-carbs-grey); }
+
+.org-function-name {
+ color: var(--color-carbs-blue); }
+
+.org-variable-name {
+ color: var(--color-carbs-purple); }
+
+.org-keyword {
+ color: var(--color-carbs-blue-alt); }
+
+.org-string {
+ color: var(--color-carbs-green); }
+
+.org-type {
+ color: var(--color-carbs-orange); }
+
+.org-warning {
+ color: var(--color-carbs-red); }