gpttemp

code/public/static/css/modules/head/head_80.css

@@ -0,0 +1,96 @@
+/* head_80.css */
+.__PFX__-h80-marquee {
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--border-color);
+  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .12) 0 10px, rgba(255, 255, 255, 0) 10px 20px), var(--bg-color);
+}
+
+.__PFX__-h80-bar {
+  display: flex;
+  align-items: center;
+  gap: 10px
+}
+
+.__PFX__-h80-brand {
+  font-weight: 900;
+  text-decoration: none;
+  color: var(--text-color);
+  white-space: nowrap
+}
+
+.__PFX__-h80-search {
+  flex: 1;
+  min-width: 0
+}
+
+.__PFX__-h80-search input {
+  width: 100%;
+  padding: 6px 10px;
+  border-radius: 999px;
+  border: 1px solid var(--border-color);
+  background: rgba(255, 255, 255, .18)
+}
+
+.__PFX__-h80-btn {
+  border: 1px solid var(--border-color);
+  background: rgba(255, 255, 255, .18);
+  border-radius: 999px;
+  padding: 6px 10px
+}
+
+.__PFX__-h80-nav {
+  display: none;
+  margin-top: 8px
+}
+
+body.__PFX__-h80-open .__PFX__-h80-nav {
+  display: block
+}
+
+.__PFX__-h80-home,
+.__PFX__-h80-cats {
+  list-style: none;
+  margin: 0;
+  padding: 0
+}
+
+.__PFX__-h80-home li,
+.__PFX__-h80-cats li {
+  display: inline-block;
+  margin: 0 8px 8px 0
+}
+
+.__PFX__-h80-home li a,
+.__PFX__-h80-cats li a {
+  display: inline-block;
+  padding: 6px 10px;
+  border-radius: 999px;
+  border: 1px solid var(--border-color);
+  background: rgba(255, 255, 255, .55);
+  text-decoration: none;
+  color: var(--text-color);
+  font-size: 12px
+}
+
+.__PFX__-h80-home li.active a {
+  background: var(--primary-color);
+  border-color: var(--primary-color);
+  color: #fff;
+  font-weight: 900
+}
+
+.__PFX__-h80-cats li.active a {
+  background: var(--accent-color);
+  border-color: var(--accent-color);
+  font-weight: 900
+}
+
+@media(min-width:861px) {
+  /* .__PFX__-h80-btn {
+    display: none
+  }
+
+  .__PFX__-h80-nav {
+    display: block
+  } */
+}