Fix issues (#29)

This commit is contained in:
Fede Álvarez 2022-04-11 14:15:43 +02:00 committed by GitHub
parent bfeae81c8b
commit e8eff59f15
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 36 additions and 27 deletions

View File

@ -90,6 +90,10 @@
background: transparent;
appearance: none;
@include respond-to('mobile') {
width: 100%;
}
&::placeholder {
color: var(--color-grey-light);
}
@ -98,8 +102,8 @@
position: absolute;
top: 50%;
right: 0;
width: 11px;
height: 11px;
width: tovw(18px, 'default', 11px);
height: tovw(18px, 'default', 11px);
margin: 0;
padding: 0;
cursor: pointer;
@ -120,7 +124,7 @@
top: 0;
left: calc(50% - (tovw(3px, 'default', 2px) / 2));
width: tovw(3px, 'default', 2px);
height: tovw(276px, 'default', 270px);
height: tovw(276px, 'default', 140px);
margin: tovw(37px, 'default', 20px) auto tovw(23px, 'default', 20px) auto;
@include respond-to('mobile') {

View File

@ -40,6 +40,7 @@
.header {
@include respond-to('mobile') {
display: flex;
place-content: space-between;
}
h1 {
@ -47,6 +48,7 @@
text-shadow: 0 0 tovw(45px, 'default', 45px) rgb(255 255 255 / 0.4);
@include respond-to('mobile') {
width: 90%;
font-size: tovw(50px, 'mobile');
}
}

View File

@ -17,15 +17,15 @@ const Related = () => {
loop: true,
mode: 'free-snap',
breakpoints: {
'(max-width: 850px)': {
slides: { perView: 1.12, spacing: 12 }
},
'(min-width: 851px)': {
slides: { perView: 2, spacing: 22 }
},
'(min-width: 1200px)': {
'(min-width: 1141px)': {
slides: { perView: 3, spacing: 35 },
loop: false
},
'(max-width: 1140px)': {
slides: { perView: 2.9, spacing: 22 }
},
'(max-width: 850px)': {
slides: { perView: 1.12, spacing: 12 }
}
}
})

View File

@ -16,7 +16,7 @@
width: calc(100% - tovw(16px, 'mobile'));
}
@media screen and (min-width: 1600px) {
@media screen and (min-width: 1141px) {
margin: 0 auto;
}
}
@ -78,7 +78,7 @@
padding-left: 0;
}
@media screen and (min-width: 1600px) {
@media screen and (min-width: 1141px) {
width: 100%;
max-width: tovw(1296px, 'default', 320px);
margin: 0 auto;
@ -99,7 +99,7 @@
rgb(3 3 3 / 1) 65%
);
@media screen and (min-width: 1600px) {
@media screen and (min-width: 1141px) {
display: none;
}
@ -117,7 +117,7 @@
&::before {
z-index: 5;
right: initial;
left: tovw(-150px);
left: tovw(-180px);
transform: scaleX(-1);
@include respond-to('mobile') {
content: initial;

View File

@ -85,12 +85,13 @@
width: tovw(85px, 'default', 55px);
height: tovw(45px, 'default', 30px);
transform: rotate(-90deg) translateY(tovw(-5px, 'default', -5px))
scaleX(2.2) scaleY(1.6);
scaleX(2.6) scaleY(1.6);
@include respond-to('mobile') {
height: tovw(32px, 'default', 32px);
height: tovw(25px, 'default', 25px);
transform: rotate(-90deg) scaleX(2.2) scaleY(1.4)
translateY(tovw(-2px, 'mobile', -3px));
translateY(tovw(-2px, 'mobile', -3px))
translateX(tovw(-2px, 'mobile', -3px));
}
}
}

View File

@ -95,7 +95,7 @@ function Team({ members, teamName, teamNumber, teamDept }: Teams) {
<Heading as="h2" variant="sm">
{teamName}
</Heading>
{teamDept && <Line className={s['line']} />}
{teamDept && <Line className={s['line']} height={144} />}
<Heading as="h2" variant="sm">
{teamDept}
</Heading>

View File

@ -8,7 +8,9 @@
padding: tovw(220px, 'default', 72px) 0;
.container {
padding: 0 tovw(16px, 'tablet', 16px);
@include respond-to('mobile') {
padding: 0 tovw(16px, 'tablet', 16px);
}
}
}
@ -108,7 +110,7 @@
&::before {
z-index: 5;
right: initial;
left: tovw(-150px);
left: tovw(-180px);
transform: scaleX(-1);
@include respond-to('mobile') {
content: initial;

View File

@ -33,10 +33,10 @@ const Events = () => {
setLoaded(true)
},
breakpoints: {
'(max-width: 1024px)': {
'(max-width: 1140px)': {
slides: { perView: 2.915, spacing: 20 }
},
'(max-width: 800px)': {
'(max-width: 850px)': {
slides: { perView: 1.12, spacing: 12 }
}
}

View File

@ -24,7 +24,7 @@ const Hero = () => {
</video>
<Heading as="h1" variant="xl" centered>
The <br className="hide-on-desktop" />{' '}
<HighlightedText>Multi-chain</HighlightedText> <br /> Verifable Data
<HighlightedText>Multi-chain</HighlightedText> <br /> Verifiable Data
Marketplace
</Heading>
<Line className={s['line']} />

View File

@ -41,7 +41,7 @@ const LatestNews = () => {
</Heading>
</Container>
<div className={s['slider__container']}>
<div className={`${s.eventsContainer} keen-slider`} ref={sliderRef}>
<div className={`${s.events__container} keen-slider`} ref={sliderRef}>
{latestNews.map((item, i) => (
<Card key={i} data={item} className={`keen-slider__slide`} isNews />
))}

View File

@ -67,7 +67,7 @@
}
}
.eventsContainer {
.events__container {
padding-left: tovw(100px);
@include respond-to('mobile') {
padding-left: 0;
@ -101,7 +101,7 @@
&::before {
z-index: 5;
right: initial;
left: tovw(-150px);
left: tovw(-180px);
transform: scaleX(-1);
@include respond-to('mobile') {
content: initial;

View File

@ -113,7 +113,7 @@ p {
.hide-on-desktop {
display: initial !important;
@media screen and (min-width: 800px) {
@media screen and (min-width: 901px) {
display: none !important;
}
}