From a95fe094b7869198a476acd52c79d5feada90416 Mon Sep 17 00:00:00 2001 From: jinhojang6 Date: Thu, 12 Sep 2024 04:02:39 +0900 Subject: [PATCH] chore: update spacing --- .../Dashboard/OperatorGrid/OperatorGrid.tsx | 11 +++++------ .../Dashboard/OperatorPanel/OperatorPanel.tsx | 2 +- .../Dashboard/ProgressBar/ProgressBar.tsx | 6 +++++- src/components/Header/Header/Header.tsx | 3 ++- src/components/Header/Navbar/Navbar.tsx | 5 ++++- yarn.lock | 19 ------------------- 6 files changed, 17 insertions(+), 29 deletions(-) diff --git a/src/components/Dashboard/OperatorGrid/OperatorGrid.tsx b/src/components/Dashboard/OperatorGrid/OperatorGrid.tsx index 14e4584..ae25002 100644 --- a/src/components/Dashboard/OperatorGrid/OperatorGrid.tsx +++ b/src/components/Dashboard/OperatorGrid/OperatorGrid.tsx @@ -152,7 +152,7 @@ const Header = styled.div` const Title = styled.h2` font-weight: 400; font-size: 24px; - line-height: 1; + line-height: 32px; margin: 0; ` @@ -172,7 +172,6 @@ const FilterDropdown = styled.div` color: rgb(var(--lsd-text-primary)); font-weight: 400; font-size: 12px; - line-height: 1; padding-left: 12px; height: 28px; cursor: pointer; @@ -212,13 +211,13 @@ const Stat = styled.div` const Label = styled.div` font-weight: 400; font-size: 14px; - line-height: 1; + line-height: 20px; ` const Value = styled.div` font-weight: 400; font-size: 14px; - line-height: 1; + line-height: 20px; margin-top: 8px; ` @@ -246,7 +245,7 @@ const OperatorInfo = styled.div` const OperatorName = styled.div` font-weight: 400; font-size: 14px; - line-height: 1; + line-height: 20px; ` const PointsPerHour = styled.div` @@ -275,7 +274,7 @@ const ActionButton = styled.button<{ isStaked: boolean }>` font-weight: 400; font-size: 12px; - line-height: 1; + line-height: 16px; padding: 6px 12px; cursor: pointer; diff --git a/src/components/Dashboard/OperatorPanel/OperatorPanel.tsx b/src/components/Dashboard/OperatorPanel/OperatorPanel.tsx index b1d7f35..95b6672 100644 --- a/src/components/Dashboard/OperatorPanel/OperatorPanel.tsx +++ b/src/components/Dashboard/OperatorPanel/OperatorPanel.tsx @@ -79,7 +79,7 @@ const OperatorPanel: React.FC = () => { const StyledPanel = styled.section` font-weight: 400; font-size: 14px; - line-height: 1; + line-height: 20px; ` const OperatorImage = styled.img` diff --git a/src/components/Dashboard/ProgressBar/ProgressBar.tsx b/src/components/Dashboard/ProgressBar/ProgressBar.tsx index 3d99c20..13193b8 100644 --- a/src/components/Dashboard/ProgressBar/ProgressBar.tsx +++ b/src/components/Dashboard/ProgressBar/ProgressBar.tsx @@ -80,7 +80,7 @@ const ProgressBar: React.FC = ({ const StyledProgressBar = styled.section` font-weight: 400; font-size: 14px; - line-height: 1; + line-height: 20px; ` const ProgressHeader = styled.div` @@ -92,6 +92,8 @@ const EpochLabel = styled.span` background-color: rgb(var(--lsd-surface-secondary)); color: rgb(var(--lsd-text-secondary)); padding: 0 8px; + line-height: 20px; + font-size: 14px; ` const EpochInfo = styled.div` @@ -130,6 +132,8 @@ const ClaimPeriod = styled.span` padding: 0 8px; position: relative; top: -8px; + line-height: 20px; + font-size: 14px; ` const VerticalBar = styled.div` diff --git a/src/components/Header/Header/Header.tsx b/src/components/Header/Header/Header.tsx index 1f3effb..f910849 100644 --- a/src/components/Header/Header/Header.tsx +++ b/src/components/Header/Header/Header.tsx @@ -28,6 +28,7 @@ const Container = styled.header` width: 100%; align-items: center; justify-content: space-between; + position: relative; ` const Logo = styled.img` @@ -48,7 +49,7 @@ const Button = styled.button` height: 28px; font-weight: 400; font-size: 12px; - line-height: 1; + line-height: 16px; border: 1px solid rgb(var(--lsd-border-primary)); background: transparent; color: rgb(var(--lsd-text-primary)); diff --git a/src/components/Header/Navbar/Navbar.tsx b/src/components/Header/Navbar/Navbar.tsx index 30c4268..c96b01c 100644 --- a/src/components/Header/Navbar/Navbar.tsx +++ b/src/components/Header/Navbar/Navbar.tsx @@ -20,6 +20,9 @@ const Navbar: React.FC = () => { const Navigation = styled.ul` display: flex; align-items: center; + /* position: absolute; + left: 50%; + transform: translateX(-50%); */ gap: 37px; list-style-type: none; @@ -33,7 +36,7 @@ const Navigation = styled.ul` const NavItem = styled.li<{ active?: boolean }>` font-weight: 400; font-size: 14px; - line-height: 1; + line-height: 20px; cursor: pointer; padding: 4px 0; diff --git a/yarn.lock b/yarn.lock index d977e69..1a9003a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -559,11 +559,6 @@ dependencies: undici-types "~5.25.1" -"@types/nprogress@^0.2.0": - version "0.2.3" - resolved "https://registry.yarnpkg.com/@types/nprogress/-/nprogress-0.2.3.tgz#b2150b054a13622fabcba12cf6f0b54c48b14287" - integrity sha512-k7kRA033QNtC+gLc4VPlfnue58CM1iQLgn1IMAU8VPHGOj7oIHPp9UlhedEnD/Gl8evoCjwkZjlBORtZ3JByUA== - "@types/parse-json@^4.0.0": version "4.0.0" resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0" @@ -3683,15 +3678,6 @@ next@^14.2.3: "@next/swc-win32-ia32-msvc" "14.2.3" "@next/swc-win32-x64-msvc" "14.2.3" -nextjs-progressbar@^0.0.16: - version "0.0.16" - resolved "https://registry.yarnpkg.com/nextjs-progressbar/-/nextjs-progressbar-0.0.16.tgz#d2c1e54ffc2c6d52b64282c0d764a44241fbc36e" - integrity sha512-GV0fD38EMD3vSDCmkq+tObmoup6QA91a6a9MxGuhJZuRk/9TNsrHGnIQQQ/sggkMkXuT4fBgF6jRjFwScDT3zA== - dependencies: - "@types/nprogress" "^0.2.0" - nprogress "^0.2.0" - prop-types "^15.8.1" - npm-run-path@^5.1.0: version "5.1.0" resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-5.1.0.tgz#bc62f7f3f6952d9894bd08944ba011a6ee7b7e00" @@ -3699,11 +3685,6 @@ npm-run-path@^5.1.0: dependencies: path-key "^4.0.0" -nprogress@^0.2.0: - version "0.2.0" - resolved "https://registry.yarnpkg.com/nprogress/-/nprogress-0.2.0.tgz#cb8f34c53213d895723fcbab907e9422adbcafb1" - integrity sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA== - object-assign@^4.1.1: version "4.1.1" resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"