Separate css & js into text variants

Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>
2024-09-12 13:38:41 +03:00
parent 7f53d88f50
commit 13337dbb66
18 changed files with 60 additions and 65 deletions
--- a/assets/css/common/pagehead.css
+++ b/assets/css/common/pagehead.css
@@ -0,0 +1,43 @@
+.gh-pagehead {
+  position: sticky;
+  top: 4vmin;
+  grid-column: wide-start/main-start;
+  max-width: 200px;
+  height: max-content;
+  padding-top: 0.8rem;
+  font-size: 1.4rem;
+  line-height: 1;
+}
+
+.gh-pagehead-title {
+  font-size: 2.1rem;
+  font-weight: 600;
+  letter-spacing: -0.02em;
+}
+
+.gh-pagehead-description {
+  margin-top: 0.8rem;
+  line-height: 1.45;
+  color: var(--color-secondary-text);
+}
+
+@media (max-width: 767px) {
+  .gh-pagehead {
+    margin-bottom: 4.8rem;
+  }
+}
+
+@media (min-width: 768px) and (max-width: 1321px) {
+  .gh-pagehead {
+    margin-bottom: 8rem;
+  }
+}
+
+@media (max-width: 1321px) {
+  .gh-pagehead {
+    position: static;
+    grid-column: main-start / main-end;
+    max-width: 480px;
+    padding-top: 0;
+  }
+}