From 13f32204568471d105c4c79f996016a4dc5a812c Mon Sep 17 00:00:00 2001 From: Tykayn Date: Fri, 8 Aug 2025 16:23:20 +0200 Subject: [PATCH] stying main page --- .../src/styles/app/styles/pages/_main.scss | 53 +++++++++++++++++-- 1 file changed, 49 insertions(+), 4 deletions(-) diff --git a/sae-csc/src/styles/app/styles/pages/_main.scss b/sae-csc/src/styles/app/styles/pages/_main.scss index 45735de..d91b2d4 100644 --- a/sae-csc/src/styles/app/styles/pages/_main.scss +++ b/sae-csc/src/styles/app/styles/pages/_main.scss @@ -26,7 +26,7 @@ } } - .delete-button{ + .delete-button { border: 0; border-radius: 100%; background: #F2F2F2; @@ -37,11 +37,13 @@ left: 92%; top: 50px; width: 37px; - &:hover{ + + &:hover { background: #888; color: #222; } } + textarea { width: 648px; height: 236px; @@ -51,6 +53,7 @@ box-shadow: 0 19px 29px 0 rgba(30, 31, 34, 0.05); border-width: 0; padding: 11px 14px; + color: variables.$csc-textarea-color; } } @@ -63,7 +66,20 @@ .filter-group { - .search{ + .input-box{ + margin-left: -1rem; + i{ + position: relative; + left: 2rem; + + } + input{ + padding-left: 2rem; + padding-top: 6px; + padding-bottom: 6px; + } + } + .search { display: flex; min-height: 42px; max-height: 42px; @@ -72,6 +88,7 @@ gap: var(--Spacing-Spacing-20, 8px); align-self: stretch; } + .chips-listing { margin-top: 16px; border-radius: 4px; @@ -84,14 +101,39 @@ .chips { background: variables.$csc-chips-bg-color; color: white; - border-radius: 100px; padding: 12px 16px; border: solid 1px variables.$csc-chips-bg-color; width: 100%; + border-radius: 20px; + } } } +.bottom-navigation { + .nav-item { + + display: inline-flex; + padding: 12px 16px; + justify-content: center; + align-items: center; + gap: 10px; + + color: var(--color-text-title, #255B8E); + leading-trim: both; + text-edge: cap; + + /* Text/text-button */ + font-family: var(--Fonts-Font-text, Barlow); + font-size: var(--Font-Base, 14px); + font-style: normal; + font-weight: 600; + line-height: 100%; /* 14px */ + letter-spacing: 1.12px; + + } +} + .fixed-navigation { display: flex; position: fixed; @@ -102,6 +144,9 @@ align-items: center; background: white; + box-shadow: 0 -10px 20px 0 rgba(30, 31, 34, 0.05); + + .next-step { display: flex; padding: 12px;