style.css hinzugefügt

style.css

@@ -0,0 +1,139 @@
+:root {
+    --width: 850px;
+    --font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
+    --font-secondary: Verdana, sans-serif;
+    --font-scale: 1.1em;
+    --background-color: #f9f9f9;
+    --heading-color: #4a4a4a;
+    --text-color: #4a4a4a;
+    --link-color: #1d7484;
+    --visited-color: #144f5a;
+    --code-background-color: #f1f1f1;
+    --code-color: #4a4a4a;
+    --blockquote-color: #4a4a4a;
+}
+
+body {
+    font-family: var(--font-secondary);
+    font-size: var(--font-scale);
+    margin: auto;
+    padding: 20px;
+    max-width: var(--width);
+    text-align: left;
+    background-color: var(--background-color);
+    word-wrap: break-word;
+    overflow-wrap: break-word;
+    line-height: 1.5;
+    color: var(--text-color);
+}
+
+h1, h2, h3, h4, h5, h6 {
+    font-family: var(--font-main);
+    color: var(--heading-color);
+}
+
+a {
+    color: var(--link-color);
+    cursor: pointer;
+    text-decoration: none;
+    font-weight: bold;
+}
+
+a:hover {
+	#color: #982c61;
+  	border-bottom: 2px solid #4a4a4a;
+  	margin-bottom: -2px;
+    font-weight: bold;
+}
+
+nav a {
+    margin-right: 8px;
+}
+
+strong, b {
+    color: var(--heading-color);
+}
+
+button {
+    margin: 0;
+    cursor: pointer;
+}
+
+main {
+    line-height: 1.6;
+}
+
+table {
+    width: 100%;
+}
+
+hr {
+    border: 0;
+    border-top: 1px solid var(--link-color);
+}
+
+img {
+    max-width: 100%;
+}
+
+code {
+    font-family: monospace;
+    padding: 2px;
+    background-color: var(--code-background-color);
+    color: var(--code-color);
+}
+
+blockquote {
+    border-left: 5px solid var(--link-color);
+  	padding: 0 15px;
+  	margin: 15px 0;
+  	line-height: 50px;
+  	font-size: 16px;
+  	background-color: var(--code-background-color);
+    color: var(--code-color);
+}
+
+footer {
+    padding: 25px 0;
+    text-align: center;
+}
+
+.title h1 {
+ 	color: var(--link-color); 
+}
+
+.title h1:hover {
+  	#color: #982c61;
+}
+
+.inline {
+    width: auto !important;
+}
+
+.highlight, .code {
+    padding: 1px 15px;
+    background-color: var(--code-background-color);
+    color: var(--code-color);
+    border-radius: 3px;
+    margin-block-start: 1em;
+    margin-block-end: 1em;
+    overflow-x: auto;
+}
+
+/* blog post list */
+ul.blog-posts {
+    list-style-type: none;
+    padding: unset;
+}
+
+ul.blog-posts li {
+    display: flex;
+}
+
+ul.blog-posts li span {
+    flex: 0 0 130px;
+}
+
+ul.blog-posts li a:visited {
+    #color: var(--visited-color);
+}