website

commit 09f62fd5e2492b1bd176cb2f961eeae19160221b
parent 529c21cd004892a5581b205d5d04e7dc6bfcf9b2
Author: Adriel Dumas--Jondeau <leirda@disroot.org>
Date:   Fri, 24 May 2024 14:26:34 +0200

Ajoute la feuille de style

Diffstat:
A
css/duper.css
 | 
134
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

1 file changed, 134 insertions(+), 0 deletions(-)
diff --git a/css/duper.css b/css/duper.css
@@ -0,0 +1,134 @@
+:root {
+    --bg-0: #fbf3db;
+    --bg-1: #ece3cc;
+    --bg-2: #d5cdb6;
+    --dim-0: #909995;
+    --fg-0: #53676d;
+    --fg-1: #3a4d53;
+
+    --red: #d2212d;
+    --green: #489100;
+    --yellow: #ad8900;
+    --blue: #0072d4;
+    --magenta: #ca4898;
+    --cyan: #009c8f;
+    --orange: #c25d1e;
+    --violet: #8762c6;
+
+    --br-red: #cc1729;
+    --br-green: #428b00;
+    --br-yellow: #a78300;
+    --br-blue: #006dce;
+    --br-magenta: #c44392;
+    --br-cyan: #00978a;
+    --br-orange: #bc5819;
+    --br-violet: #825dc0;
+
+    --article-width: 40rem;
+    --page-padding: 1rem;
+    --code-padding: 0.5rem;
+    --logo-height: 4rem;
+}
+
+
+
+/* Display theme colors for urls */
+
+
+a:link { color: var(--blue); }
+a:visited { color: var(--magenta); }
+a:focus { color: var(--br-magenta); }
+a:hover { color: var(--cyan); }
+a:active { color: var(--red); }
+
+header a { text-decoration: none; }
+header a:link { color: var(--fg-1); }
+header a:visited { color: var(--fg-1); }
+header a:focus { color: var(--fg-1); }
+header a:hover { color: var(--fg-1); }
+header a:active { color: var(--fg-1); }
+
+
+::selection { background-color: var(--bg-2); }
+
+/* Main layout */
+
+
+html {
+    color: var(--fg-0);
+    background-color: var(--bg-0);
+    font-family: Dejavu sans;
+    font-size: 1.0rem;
+    height: 100%;
+    margin: 0;
+    text-align: justify;
+}
+
+body {
+    display: flex;
+    flex-flow: column;
+    height: 100%;
+    margin: 0;
+}
+
+.logo {
+    height: var(--logo-height);
+}
+
+header nav {
+    display: flex;
+    flex-flow: row;
+    padding: var(--page-padding);
+    padding-bottom: 0;
+}
+
+nav ul {
+    flex: 1 1 auto;
+    list-style-type: none;
+    display: flex;
+    gap: normal var(--page-padding);
+    flex-flow: row wrap;
+    justify-content: space-between;
+    margin: 0;
+}
+
+nav li {
+    flex: 1 1 auto;
+    margin: auto 0;
+    text-align: center;
+}
+
+nav .selected a {
+    color: var(--dim-0);
+}
+
+article {
+    max-width: var(--article-width);
+    width: calc(100% - var(--page-padding));
+    margin: auto;
+    flex-grow: 1;
+    flex-shrink: 1;
+    flex-basis: auto;
+}
+
+pre {
+    display: inline-block;
+    width: inherit;
+    background-color: var(--bg-1);
+    padding: var(--code-padding);
+    margin: 0;
+    text-align: left;
+    overflow: scroll;
+}
+
+footer {
+    font-size: small;
+    text-align: center;
+    flex-grow: 0;
+    flex-shrink: 1;
+    flex-basis: auto;
+}
+
+img {
+    max-width: 100%;
+}