added navbar

2026-02-23 21:22:53 +08:00
parent 0c634b8294
commit 9797432b7d
2 changed files with 115 additions and 6 deletions
--- a/frontend/src/app/components/header/styles.module.css
+++ b/frontend/src/app/components/header/styles.module.css
@@ -0,0 +1,79 @@
+.headerContainer {
+  background-color: #ff0000;
+  display: flex;
+  height: 84px;
+  padding: 12px 24px;
+  justify-content: space-between;
+  align-items: center;
+  align-self: stretch;
+  border-bottom: 1px solid #2c2d3d;
+  border-bottom: 1px solid color(display-p3 0.1725 0.1765 0.2353);
+}
+.logoContainer {
+  background-color: orange;
+  display: flex;
+  padding: 6px;
+  align-items: center;
+  gap: 16px;
+  border-radius: 4px;
+}
+.logo {
+  width: 38px;
+  height: 38px;
+  aspect-ratio: 1/1;
+  border-radius: 100px;
+  background:
+    url(/images/logo.png) lightgray 50% / cover no-repeat,
+    #232537;
+  background:
+    url(/images/logo.png) lightgray 50% / cover no-repeat,
+    color(display-p3 0.1392 0.1443 0.2106);
+}
+
+.orgName {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 4px;
+}
+.orgName p {
+  color: #eeeffd;
+  color: color(display-p3 0.9333 0.9373 0.9882);
+  font-family: Inter;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: normal;
+}
+
+.dropdown {
+  display: inline-flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.dropdown > p {
+  color: #85869b;
+  color: color(display-p3 0.5216 0.5255 0.6);
+  font-family: Inter;
+  font-size: 15px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: normal;
+}
+
+.dropdown > div {
+  display: flex;
+  padding: 8px;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+}
+
+.dropdown > div > button > svg {
+  width: 9.922px;
+  height: 4.961px;
+  stroke: #959aff;
+  stroke-width: 1px;
+  stroke: color(display-p3 0.5892 0.6031 0.9766);
+}