From ec92cdcece2ce11f2cec9bac1b4e746b75f29435 Mon Sep 17 00:00:00 2001
From: Folkert Kevelam <contact@pyllr.nl>
Date: Mon, 18 Aug 2025 23:04:13 +0200
Subject: [PATCH] Initial commit

---
 Server/static/style.css | 272 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 272 insertions(+)
 create mode 100644 Server/static/style.css

diff --git a/Server/static/style.css b/Server/static/style.css
new file mode 100644
index 0000000..0b09631
--- /dev/null
+++ b/Server/static/style.css
@@ -0,0 +1,272 @@
+@font-face {
+    font-family: "Latin Modern";
+    font-style: normal;
+    src:
+        url("fonts/lmroman8-regular.otf") format("opentype");
+}
+
+@font-face {
+    font-family: "Latin Modern";
+    font-style: italic;
+    src:
+        url("fonts/lmromanslant8-regular.otf") format("opentype");
+}
+
+:root {
+    --primary-color: #4285F4;
+    --secondary-color: #34A853;
+    --accent-color: #EA4335;
+    --background-color: white;
+    --text-color: #222222;
+    --light-gray: #ECF0F1;
+    --dark-gray: #303333;
+    --yellow: #FDBE49;
+    --green: #5DC080;
+    --blue: #3AB9CF;
+    --pink: #F96269;
+
+    --bittersweet: #F05D5E;
+    --caribbean-current: #0F7173;
+    --anti-flash-white: #E7ECEF;
+    --raisin-black: #272932;
+
+    --font-main: 'Georgia', serif;
+    --font-heading: 'Helvetica', sans-serif;
+    --font-size-base: 18px;
+    --line-heigh-base: 1.5;
+
+    --spacing-tiny: 0.25rem;
+    --spacing-small: 0.5rem;
+    --spacing-medium: 1rem;
+    --spacing-large: 2rem;
+
+    --border-radius: 4px;
+    --border-width: 2px;
+
+    --shadow-small: 0 1px 3px rgba(0, 0, 0, 0.12);
+    --shadow-medium: 0 2px 6px rgba(0,0,0,0.12);
+
+    --page-width: 21cm;
+    --page-margin: 2cm;
+}
+
+body {
+    font-family: var(--font-main);
+    font-size: var(--font-size-base);
+    line-height: var(--line-height-base);
+    color: var(--text-color);
+    background-color: var(--background-color);
+    display: flex;
+    justify-content: center;
+    margin: 0;
+    padding: 0;
+}
+
+.page-header {
+    margin-bottom: var(--spacing-large);
+    text-align: center;
+    border-bottom: var(--border-width) solid var(--dark-gray);
+}
+
+.page-title {
+    font-size: 2.5em;
+    font-weight: bold;
+    color: var(--text-color);
+    margin-bottom: var(--spacing-medium);
+}
+
+.page-subtitle {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    color: var(--dark-gray);
+    font-size: 1em;
+}
+
+.page-author
+.page-date {
+    flex: 1;
+}
+
+.page-author {
+    text-align: left;
+}
+
+.page-date {
+    text-align: right;
+}
+
+.page-container {
+    width: var(--page-width);
+    max-width: 100%;
+    min-height: 100vh;
+    padding: var(--page-margin);
+    background-color: white;
+}
+
+.panel {
+    border: var(--border-width) solid var(--dark-gray);
+    border-radius: var(--border-radius);
+    margin: var(--spacing-medium) 0;
+    overflow: hidden;
+}
+
+.panel-header {
+    background-color: var(--primary-color);
+    color: white;
+    padding: var(--spacing-tiny) var(--spacing-tiny);
+    display: flex;
+    align-items: center;
+}
+
+.panel-icon {
+    margin-right: var(--spacing-small);
+    font-size: 1.2em;
+}
+
+.panel-title {
+    margin: 0;
+    text-align: center;
+    font-size: 1.1em;
+}
+
+.panel-content {
+    padding: var(--spacing-medium);
+}
+
+.panel-info {
+    border-color: var(--blue);
+}
+
+.panel-info .panel-header {
+    background-color: var(--blue);
+}
+
+.panel-warning {
+    border-color: var(--pink);
+}
+
+.panel-warning .panel-header {
+    background-color: var(--pink);
+}
+
+.panel-success {
+    border-color: var(--green);
+}
+
+.panel-success .panel-header {
+    background-color: var(--green);
+}
+
+.theorem {
+    border: var(--border-width) solid var(--dark-gray);
+    border-radius: var(--border-radius);
+    margin: var(--spacing-tiny) 0;
+    overflow: hidden;
+}
+
+.theorem-content {
+    padding: var(--spacing-medium);
+    font-family: "Latin Modern";
+    font-size: 20px;
+}
+
+.theorem-title {
+    font-size: 20px;
+}
+
+.proof {
+    margin: var(--spacing-medium);
+    font-family: "Latin Modern";
+    font-size: 20px;
+}
+
+.proof-qed {
+    text-align: right;
+    font-size: 32px;
+}
+
+.highlight-yellow {
+    background-color: #FDBE49;
+    font-weight: bold;
+}
+
+.highlight-green {
+    background-color: #5DC080;
+    font-weight: bold;
+}
+
+.highlight-blue {
+    background-color: #3AB9CF;
+    font-weight: bold;
+}
+
+.highlight-pink {
+    background-color: #F96269;
+    font-weight: bold;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-family: var(--font-heading);
+}
+
+.layout {
+    display: flex;
+    gap: var(--spacing-medium);
+    margin: var(--spacing-medium) 0;
+    paddingL: var(--spacing-medium);
+}
+
+.layout>* {
+    flex: 1;
+}
+
+.layout-center {
+    align-items: center;
+    justify-content: center;
+    text-align: left;
+}
+
+.divider {
+    border: none;
+    border-top: 2px solid var(--dark-gray);
+    margin: var(--spacing-large) 0;
+}
+
+.page-content h1:not(.panel-title),
+.page-content h2:not(.panel-title),
+.page-content h3:not(.panel-title),
+.page-content h4:not(.panel-title),
+.page-content h5:not(.panel-title),
+.page-content h6:not(.panel-title) {
+    border-left: 4px solid var(--raisin-black);
+    padding-left: var(--spacing-tiny);
+    margin-top: var(--spacing-large);
+    margin-bottom: var(--spacing-medium);
+}
+
+.page-content h1:not(.panel-title) {
+    border-left-width: 6px;
+}
+
+.page-content h2:not(.panel-title) {
+    border-left-width: 5px;
+}
+
+.page-content h3:not(.panel-title) {
+    border-left-width: 4px;
+}
+
+.page-content h4:not(.panel-title) {
+    border-left-width: 3px;
+}
+
+.page-content h5:not(.panel-title),
+.page-content h6:not(.panel-title) {
+    border-left-width: 2px;
+}