M static/main.css => static/main.css +74 -30
@@ 14,39 14,83 @@
left: 0;
}
-body {
- margin:40px auto;
- max-width:66%;
- line-height:1.6;
- font-family:monospace;
+main {
+ font-family: monospace, monospace;
font-size:16px;
- color:#e5eafa;
- background:#093824;
- padding:0 10px
-}
-
-h1,h2,h3{
- line-height:1.2;
-}
+ max-width: 66%;
+ padding: 0 10px;
+ margin: 40px auto;
-h1 {
+ }
+
+ @media only screen and (max-device-width: 736px) {
+ main {
+ padding: 0rem;
+ }
+ }
+
+ ::selection {
+ background: #d3869b;
+ }
+
+ body {
+ background: #282828;
+ color: #ebdbb2;
+ }
+
+ pre {
+ background-color: #3c3836;
+ padding: 1em;
+ border: 0;
+ }
+
+ a, a:active, a:visited {
+ color: #b16286;
+ background-color: #1d2021;
+ }
+
+ h1, h2, h3, h4, h5 {
+ margin-bottom: .1rem;
+ }
+
+ blockquote {
+ border-left: 1px solid #bdae93;
+ margin: 0.5em 10px;
+ padding: 0.5em 10px;
+ }
+
+ footer {
text-align: center;
- margin-bottom: 1em;
-}
-
-a {
- color: #FCE94F;
- font-weight: 600;
- word-wrap: break-word;
- overflow-wrap: break-word;
-}
-
-
-.cm {
- border: 2px solid #FCE93C;
- border-radius: 25px;
- padding: auto;
-}
+ }
+
+@media (prefers-color-scheme: light) {
+ body {
+ background: #fbf1c7;
+ color: #3c3836;
+ }
+
+ pre {
+ background-color: #ebdbb2;
+ padding: 1em;
+ border: 0;
+ }
+
+ a, a:active, a:visited {
+ color: #b16286;
+ background-color: #f9f5d7;
+ }
+
+ h1, h2, h3, h4, h5 {
+ margin-bottom: .1rem;
+ }
+
+ blockquote {
+ border-left: 1px solid #655c54;
+ margin: 0.5em 10px;
+ padding: 0.5em 10px;
+ }
+ }
+
.pink-box {
border: 2px solid palevioletred;
M templates/base.html => templates/base.html +4 -3
@@ 2,16 2,16 @@
<html lang="en">
<head>
<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='main.css') }}">
+<meta name="viewport" content="width=device-width, initial-scale=1.0" />
{% if title %}
<title>{{ title }} - SoloGame</title>
{% else %}
<title> Welcome to SoloGame </title>
{% endif %}
</head>
-
-<body>
+<body id="top">
+<main>
<div class="sidebar">
<a href="/index"> ⭐ Home </a> <br/>
@@ 38,5 38,6 @@
{% endwith %}
</span>
<div class="app-content"> {% block content %}{% endblock %} </div>
+</main>
</body>
</html>
M templates/index.html => templates/index.html +2 -1
@@ 1,4 1,5 @@
{% extends "base.html" %}
{% block content %}
-<div class="fancy-pants"> <h1> Hi World </h1> </div>
+<div class="fancy-pants"><p> <h1> Hi World </h1> </p> </div>
+
{% endblock %}