diff --git a/src/components/common/card/card.module.scss b/src/components/common/card/card.module.scss index e67cb0e..edd0ddf 100644 --- a/src/components/common/card/card.module.scss +++ b/src/components/common/card/card.module.scss @@ -314,7 +314,8 @@ border-top: tovw(1px, 'default', 1px) solid var(--color-white); border-bottom: tovw(1px, 'default', 1px) solid var(--color-white); width: 100%; - height: tovw(232px, 'default', 200px); + + // height: tovw(232px, 'default', 200px); @supports (aspect-ratio: 16 / 9) { aspect-ratio: 16 / 9; diff --git a/src/components/common/header/header.module.scss b/src/components/common/header/header.module.scss index 89ea2a6..f489fbb 100644 --- a/src/components/common/header/header.module.scss +++ b/src/components/common/header/header.module.scss @@ -34,7 +34,7 @@ display: flex; padding: 0; list-style-type: none; - gap: tovw(32px, 'default', 16px); + gap: tovw(20px, 'default', 16px); .item { display: flex; @@ -45,6 +45,10 @@ font-weight: 600 !important; } + .no_content { + margin-right: tovw(21px, 'default', 20px); + } + .trigger { display: flex; align-items: center; @@ -67,6 +71,7 @@ height: tovw(6px, 'default', 6px); margin-left: tovw(8px, 'default', 8px); margin-top: tovw(5px, 'default', 5px); + filter: brightness(200%); } } } @@ -85,7 +90,7 @@ display: flex; flex-direction: column; gap: tovw(18px, 'default', 14px); - border: 1px solid var(--color-grey); + border: 1px solid var(--color-white); border-radius: tovw(8px, 'default', 8px); top: tovw(40px, 'default', 30px); padding: tovw(24px, 'default', 20px); @@ -272,6 +277,10 @@ backdrop-filter: unset; background-color: var(--color-black); + .content { + background-color: rgb(255 255 255 / 0.8); + } + ul li a { color: var(--color-white); } diff --git a/src/components/common/header/index.tsx b/src/components/common/header/index.tsx index a2658e5..54d85f0 100644 --- a/src/components/common/header/index.tsx +++ b/src/components/common/header/index.tsx @@ -225,9 +225,11 @@ export const Header = () => { ) : ( - - {item.title} - + <> + + {item.title} + + )} ))} diff --git a/src/components/sections/blog/posts-grid/posts-grid.module.scss b/src/components/sections/blog/posts-grid/posts-grid.module.scss index e51c337..97261ff 100644 --- a/src/components/sections/blog/posts-grid/posts-grid.module.scss +++ b/src/components/sections/blog/posts-grid/posts-grid.module.scss @@ -8,11 +8,11 @@ grid-template-columns: repeat(3, 1fr); row-gap: tovw(104px, 'default', 81px); - @media screen and (max-width: 1300px) { + @media screen and (max-width: 1660px) { grid-template-columns: repeat(2, 1fr); } - @media screen and (max-width: 800px) { + @media screen and (max-width: 1100px) { display: flex; flex-direction: column; gap: tovw(80px, 'default', 80px); diff --git a/src/components/sections/blog/search/search.module.scss b/src/components/sections/blog/search/search.module.scss index 2e2875c..6d9c8b8 100644 --- a/src/components/sections/blog/search/search.module.scss +++ b/src/components/sections/blog/search/search.module.scss @@ -53,7 +53,7 @@ .search { position: relative; padding-left: tovw(24px, 'default', 24px); - min-width: 34%; + min-width: tovw(350px, 'default', 200px); @media screen and (max-width: 800px) { margin-bottom: tovw(32px, 'default', 32px); @@ -74,14 +74,14 @@ > input { border: none; - border-bottom: 1px solid white; + border-bottom: 1px solid var(--color-white); border-radius: 0; background: none; padding-bottom: 12px; width: 100%; line-height: 1; letter-spacing: -0.02em; - color: white; + color: var(--color-white); font-family: var(--font-tt-hoves); font-size: tovw(24px, 'default', 18px); appearance: none; diff --git a/src/components/sections/community/events/events.module.scss b/src/components/sections/community/events/events.module.scss index 5eb5bec..bfe527b 100644 --- a/src/components/sections/community/events/events.module.scss +++ b/src/components/sections/community/events/events.module.scss @@ -60,12 +60,12 @@ right: 0; left: 0; opacity: 0.4; - z-index: -1; margin-left: 0; + z-index: 10; background: linear-gradient( 180deg, rgb(229 229 229 / 0) 0%, - rgb(241 241 241 / 0.4) 48.91%, + rgb(255 255 255 / 0.39) 51%, rgb(241 241 241 / 0) 89.23% ); width: 100%; @@ -85,6 +85,16 @@ &::after, &::before { + @media screen and (max-width: 1140px) { + background: linear-gradient( + 90deg, + rgb(3 3 3 / 0) 0%, + rgb(3 3 3 / 0.95) 35%, + rgb(3 3 3 / 1) 65% + ); + width: tovw(280px, 'default', 150px); + } + @include respond-to('mobile') { background: linear-gradient( 90deg, @@ -99,22 +109,26 @@ right: tovw(-20px, 'default', -20px); background: linear-gradient( 90deg, - rgb(3 3 3 / 0) 0%, - rgb(3 3 3 / 0.95) 35%, - rgb(3 3 3 / 1) 65% + rgb(3 3 3 / 0) 78%, + rgb(3 3 3 / 1) 80%, + rgb(3 3 3 / 1) 100% ); - width: tovw(280px, 'default', 150px); + width: tovw(1550px, 'default', 150px); height: 100%; content: ''; } &::before { + @media screen and (max-width: 1140px) { + left: tovw(-180px); + } + @include respond-to('mobile') { content: initial; } right: initial; - left: tovw(-180px); + left: tovw(-280px); transform: scaleX(-1); z-index: 5; } diff --git a/src/components/sections/community/hero/hero.module.scss b/src/components/sections/community/hero/hero.module.scss index 70bfe1c..95e45c5 100644 --- a/src/components/sections/community/hero/hero.module.scss +++ b/src/components/sections/community/hero/hero.module.scss @@ -19,7 +19,7 @@ grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); padding-top: max(90px, 3%); - padding-bottom: tovw(115px, 'default', 55px); + padding-bottom: tovw(215px, 'default', 55px); .hero__container { @include respond-to('mobile') { @@ -51,9 +51,9 @@ } position: absolute; - right: tovw(570px, 'default', 80px); + right: tovw(670px, 'default', 80px); z-index: -3; - padding-top: tovw(150px, 'default', 90px); + padding-top: tovw(210px, 'default', 90px); video { @include respond-to('mobile') { @@ -61,7 +61,7 @@ } z-index: -1; - width: tovw(1900px, 'default', 800px); + width: tovw(1800px, 'default', 800px); pointer-events: none; user-select: none; mask-image: radial-gradient( @@ -85,20 +85,6 @@ ); height: 100%; } - - // position: absolute; - // bottom: 0; - // left: 0; - // z-index: 1; - // background: radial-gradient( - // ellipse, - // rgb(3 3 3 / 0) 25%, - // rgb(3 3 3 / 0.9648) 60%, - // rgb(3 3 3 / 1) 95% - // ); - // width: 100%; - // height: 100%; - // content: ''; } } @@ -166,7 +152,7 @@ } display: flex; - margin-top: tovw(32px, 'default', 16px); + margin-top: tovw(18px, 'default', 16px); gap: tovw(24px, 'default', 20px); }