diff --git a/frontends/etiquette_flask/static/css/common.css b/frontends/etiquette_flask/static/css/common.css
index 90cb2fd..9cbbb07 100644
--- a/frontends/etiquette_flask/static/css/common.css
+++ b/frontends/etiquette_flask/static/css/common.css
@@ -120,6 +120,9 @@ pre
grid-auto-rows: min-content;
grid-gap: 8px;
+ /*
+ 8px all around except the top, where the header already has a margin.
+ */
margin: 8px;
margin-top: 0;
}
diff --git a/frontends/etiquette_flask/templates/clipboard.html b/frontends/etiquette_flask/templates/clipboard.html
index 9b3cdcd..8dc806a 100644
--- a/frontends/etiquette_flask/templates/clipboard.html
+++ b/frontends/etiquette_flask/templates/clipboard.html
@@ -19,18 +19,10 @@
diff --git a/frontends/etiquette_flask/templates/search.html b/frontends/etiquette_flask/templates/search.html
index 92014df..76e29da 100644
--- a/frontends/etiquette_flask/templates/search.html
+++ b/frontends/etiquette_flask/templates/search.html
@@ -28,14 +28,6 @@
justify-content: center;
}
-#content_body
-{
- grid-template:
- "left error_message_area" auto
- "left happy_message_area" auto
- "left right" 1fr
- / 310px 1fr;
-}
#error_message_area
{
grid-area: error_message_area;
@@ -85,21 +77,32 @@
/* Keep the prev-next buttons from scraping the floor */
padding-bottom: 30px;
}
-@media screen and (max-width: 800px) {
+
+@media screen and (min-width: 800px)
+{
#content_body
{
grid-template:
- "error_message_area"
- "happy_message_area"
- "right"
- "left";
- }
- #left
- {
- max-width: none;
- width: initial;
+ "left error_message_area" auto
+ "left happy_message_area" auto
+ "left right" 1fr
+ / 310px 1fr;
}
}
+
+@media screen and (max-width: 800px)
+{
+ #content_body
+ {
+ grid-template:
+ "error_message_area" auto
+ "happy_message_area" auto
+ "right" auto
+ "left" auto
+ / auto;
+ }
+}
+
.prev_next_holder
{
display: flex;
diff --git a/frontends/etiquette_flask/templates/tags.html b/frontends/etiquette_flask/templates/tags.html
index 9130870..c1678bd 100644
--- a/frontends/etiquette_flask/templates/tags.html
+++ b/frontends/etiquette_flask/templates/tags.html
@@ -53,9 +53,6 @@ h2, h3
#right
{
display: grid;
- grid-template:
- "editor_area" 1fr
- "message_area" 1fr;
padding: 8px;
background-color: var(--color_transparency);
}
@@ -68,6 +65,17 @@ h2, h3
{
grid-area: message_area;
}
+
+@media screen and (min-width: 800px)
+{
+ #right
+ {
+ grid-template:
+ "editor_area" 1fr
+ "message_area" 1fr;
+ }
+}
+
@media screen and (max-width: 800px)
{
#right