0
0
mirror of https://github.com/neon-mmd/websurfx.git synced 2024-11-25 23:48:21 -05:00

chore: remove invalid css property

This commit is contained in:
cybrejon 2024-02-22 00:08:37 +08:00
parent 0e1714b5d0
commit a1a615b79e

View File

@ -1,8 +1,38 @@
/* @import url('./catppuccin-mocha.css'); */ /* @import url('./catppuccin-mocha.css'); */
@font-face { @font-face {
font-family: Rubik; font-family: 'Rubik';
src: url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700;800&display=swap'); font-style: normal;
fallback: sans-serif; font-weight: 200;
font-display: swap;
src: url(https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nBrXw.woff2) format('woff2');
}
@font-face {
font-family: 'Rubik';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url(https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nBrXw.woff2) format('woff2');
}
@font-face {
font-family: 'Rubik';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nBrXw.woff2) format('woff2');
}
@font-face {
font-family: 'Rubik';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nBrXw.woff2) format('woff2');
}
@font-face {
font-family: 'Rubik';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(https://fonts.gstatic.com/s/rubik/v28/iJWKBXyIfDnIV7nBrXw.woff2) format('woff2');
} }
* { * {
@ -20,8 +50,8 @@ body {
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
height: 100vh; min-height: 100vh;
font-family: Rubik, sans-serif; font-family: 'Rubik', sans-serif;
background-color: var(--background-color); background-color: var(--background-color);
} }
@ -459,39 +489,121 @@ footer div {
font-size: 1.5rem; font-size: 1.5rem;
color: var(--foreground-color); color: var(--foreground-color);
padding-bottom: 10px; padding-bottom: 10px;
max-width: 1100px;
margin: 14rem auto;
display: flex;
flex-direction: column;
row-gap: 100px;
} }
.about-container article h1 { .about-container article h1 {
color: var(--color-two); color: var(--color-two);
font-size: 2.8rem; font-size: 4.5rem;
} }
.about-container article div { .about-container article .logo-container {
padding-bottom: 15px; display: flex;
align-items: center;
justify-content: center;
}
.about-container article .logo-container svg {
width: clamp(200px, 530px, 815px);
}
.about-container article .text-block {
box-shadow: 0 0 0 100vmax var(--foreground-color);
background-color: var(--foreground-color);
clip-path: inset(0 -100vmax);
padding: 90px 0;
display: flex;
gap: 40px;
align-items: center;
justify-content: center;
flex-direction: column;
text-align: center;
color: var(--background-color);
}
.about-container article .text-block .text-block-title {
font-size: 64px;
font-weight: 500;
}
.hero-text-container {
width: 860px;
}
.hero-text {
font-size: 45px;
font-weight: 200;
} }
.about-container a { .about-container a {
color: var(--color-three); color: var(--color-three);
} }
.about-container article h2 {
color: var(--color-three);
font-size: 1.8rem;
padding-bottom: 10px;
}
.about-container p {
color: var(--foreground-color);
font-size: 1.6rem;
padding-bottom: 10px;
}
.about-container h3 {
font-size: 1.5rem;
}
.about-container { .about-container {
width: 80%; width: 80%;
margin-bottom: 140px;
}
.feature-list {
padding: 35px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
row-gap: 60px;
}
.feature-list-title {
text-align: center;
font-size: 64px;
font-weight: 500;
}
.features {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 40px;
}
.feature-card {
background-color: var(--foreground-color);
color: var(--background-color);
text-align: center;
display: flex;
padding: 30px;
border-radius: 24px;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 15px;
}
.feature-card-header {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
row-gap: 15px;
}
.feature-card-header h4 {
font-size: 33px;
font-weight: 500;
}
.feature-card-body p {
font-size: 20px;
font-weight: 200;
}
.about-footnote {
font-size: 24px;
text-align: center;
color: var(--foreground-color);
} }
/* Styles for the settings page */ /* Styles for the settings page */
@ -730,3 +842,38 @@ input:checked + .slider::before {
.slider.round::before { .slider.round::before {
border-radius: 50%; border-radius: 50%;
} }
@media only screen and (max-width: 1135px) {
.hero-text-container {
width: unset;
}
.features {
grid-template-columns: repeat(2, 1fr);
}
}
@media only screen and (max-width: 705px) {
.about-container article .logo-container svg {
width: clamp(200px, 290px, 815px);
}
.about-container article .text-block .text-block-title {
font-size: 33px;
}
.hero-text {
font-size: 22px;
}
.about-container {
width: unset;
}
.feature-list-title {
font-size: 33px;
}
.features {
grid-template-columns: 1fr;
}
.feature-list {
padding: 35px 0;
}
.feature-card {
border-radius: 0;
}
}