Added add ogranization page and project page

2026-02-25 11:39:22 +08:00
parent 03bb2c22aa
commit 1c0532efa7
10 changed files with 450 additions and 59 deletions
--- a/frontend/src/app/organization/add/styles.module.css
+++ b/frontend/src/app/organization/add/styles.module.css
@@ -0,0 +1,191 @@
+.contentContainer {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 48px;
+  flex: 1 0 0;
+  align-self: stretch;
+}
+.upperToolTips {
+  display: flex;
+  padding: 10px;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+  align-self: stretch;
+  background: #959aff;
+}
+.upperToolTips > div {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+.upperToolTips > div > p {
+  color: #191a24;
+  text-align: center;
+  font-family: Inter;
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+}
+.createProjectForm {
+  display: flex;
+  padding: 24px;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 32px;
+}
+.organizationBadgeContainer {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  align-self: stretch;
+}
+.organizationBadge {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  flex: 1 0 0;
+}
+.organizationBadgeDetails {
+  display: flex;
+  padding: 4px;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+}
+.relativeContainer {
+  display: flex;
+  padding: 4px;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+  position: relative;
+}
+.imageContainer {
+  display: flex;
+  width: 70px;
+  height: 70px;
+  padding: 11px;
+  justify-content: center;
+  align-items: center;
+  aspect-ratio: 1/1;
+  border-radius: 100px;
+  border: 1px solid #616583;
+  background: #4b4f6d;
+}
+.addIconContainer {
+  display: flex;
+  width: 27.813px;
+  height: 27.813px;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  right: 4.188px;
+  bottom: 4.187px;
+  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.25);
+  border-radius: 100px;
+  background: #696b95;
+}
+.labels {
+  display: flex;
+  align-items: flex-start;
+  gap: 2px;
+  flex: 1 0 0;
+}
+.labels > p {
+  color: #d2d3e1;
+  color: color(display-p3 0.8235 0.8275 0.8784);
+  font-family: Inter;
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+}
+.labels > p span {
+  color: #85869b;
+  font-family: Inter;
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 300;
+  line-height: normal;
+}
+.inputGroup {
+  display: flex;
+  width: 500px;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 12px;
+}
+.inputLabel {
+  display: flex;
+  align-items: flex-start;
+  gap: 2px;
+  align-self: stretch;
+}
+.inputLabel > p {
+  color: #d2d3e1;
+  font-family: Inter;
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+}
+
+.inputLabel > p span {
+  color: #cfb000;
+
+  font-weight: 600;
+}
+.inputField {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 8px;
+  align-self: stretch;
+}
+.inputField > input {
+  display: flex;
+  height: 44px;
+  padding: 12px 16px;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  gap: 10px;
+  align-self: stretch;
+  border-radius: 6px;
+  border: 1px solid #616583;
+  background-color: transparent;
+  color: #85869b;
+  font-family: Inter;
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+}
+.inputField > input::placeholder {
+  color: #85869b;
+  font-family: Inter;
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+}
+.prompts {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  align-self: stretch;
+}
+.prompts > p {
+  color: #d49e3d;
+  font-family: Inter;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+  letter-spacing: -0.07px;
+}