Sfoglia il codice sorgente

Header-Stil mit Drop-Shadow angepasst

gc-server3 2 settimane fa
parent
commit
f3f72e73a7
1 ha cambiato i file con 22 aggiunte e 1 eliminazioni
  1. 22 1
      static/assets/css/app.css

+ 22 - 1
static/assets/css/app.css

@@ -23,7 +23,28 @@ body {
   margin: 0;
   background: var(--gc-brand-header);
   border-bottom: 1px solid var(--gc-brand-border);
-  box-shadow: 0 2px 8px #1826300a;
+  filter: drop-shadow(0 2px 4px #1826300a);
+}
+/* Extend only the background, keeping navigation aligned with the content. */
+.gc-app-header.header::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: -1;
+  background: var(--gc-brand-header);
+  box-shadow: 0 0 0 100vmax var(--gc-brand-header);
+  clip-path: inset(0 -100vmax);
+  pointer-events: none;
+}
+.gc-app-header.header::after {
+  content: "";
+  position: absolute;
+  inset: auto 0 -1px;
+  height: 1px;
+  background: var(--gc-brand-border);
+  box-shadow: 0 0 0 100vmax var(--gc-brand-border);
+  clip-path: inset(0 -100vmax);
+  pointer-events: none;
 }
 .gc-app-header .gc-header-inner {
   display: flex;