QA changes

This commit is contained in:
Fede Álvarez 2022-06-30 10:59:01 +02:00
parent 538e03cf94
commit 6e809daa52
7 changed files with 49 additions and 37 deletions

View File

@ -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;

View File

@ -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);
}

View File

@ -225,9 +225,11 @@ export const Header = () => {
</NavigationMenu.Content>
</>
) : (
<Link href={item.href} variant="nav">
{item.title}
</Link>
<>
<Link className={s.no_content} href={item.href} variant="nav">
{item.title}
</Link>
</>
)}
</NavigationMenu.Item>
))}

View File

@ -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);

View File

@ -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;

View File

@ -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;
}

View File

@ -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);
}