acid-info
/
nimbus-site
mirror of https://github.com/acid-info/nimbus-site.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

chore: update hero image

This commit is contained in:
jinhojang6 2024-03-13 22:05:55 +09:00
parent 5f53d3f30a
commit df9bbc1f72
No known key found for this signature in database
GPG Key ID: 1762F21FE8B543F8
1 changed files with 75 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

138
src/css/custom.scss
View File

@ -40,6 +40,10 @@ html[data-theme='light'] {
} }
} }
.navbar {
background: transparent !important;
}
.hero-image { .hero-image {
position: absolute; position: absolute;
right: 0; right: 0;
@ -55,51 +59,13 @@ html[data-theme='light'] {
z-index: 10; z-index: 10;
} }
@include utils.responsive('xl', 'up') { // @include utils.responsive('xl', 'up') {
.hero-image { // .hero-image {
position: absolute; // position: absolute;
right: 0; // right: 0;
top: 0; // top: 0;
margin-right: calc(-1 * ((100vw - var(--container-max-width)) / 2 + 300px)); // }
} // }
}
@media screen and (max-width: 1200px) {
.hero-image {
margin-right: calc(-1 * ((100vw - var(--container-max-width)) / 2 + 400px));
}
}
@media screen and (max-width: 1000px) {
.hero-image {
margin-right: calc(-1 * ((100vw - var(--container-max-width)) / 2 + 450px));
}
}
@media screen and (max-width: 900px) {
.hero-image {
margin-right: -32px;
margin-left: 0;
scale: 1;
margin-top: -30%;
}
}
@media screen and (max-width: 768px) {
.hero-image {
margin-right: 22px;
scale: 1.15;
margin-top: -27%;
}
}
@media screen and (max-width: 450px) {
.hero-image {
margin-right: 32px;
scale: 1.36;
margin-top: -20%;
}
}
.buttons-row { .buttons-row {
display: flex; display: flex;
@ -139,26 +105,32 @@ h2 {
} }
} }
@media (max-width: 768px) { @media screen and (max-width: 1200px) {
#open-source-and-support { .hero-image {
.mdx-grid__content { margin-right: -280px;
flex-direction: column;
gap: 40px;
}
}
h3 {
margin-top: 16px !important;
}
.mdx-grid__content > div:first-child {
a {
margin-top: 16px !important;
}
} }
} }
@media screen and (max-width: 1000px) { @media screen and (min-width: 1024px) {
.hero-image {
position: absolute;
right: 0;
top: 0;
transform: rotate(150deg);
margin-right: -300px;
margin-top: -78%;
scale: 0.95;
}
}
@media screen and (max-width: 1024px) {
.hero-image {
margin-right: -32px;
margin-left: 0;
scale: 1;
margin-top: -36%;
}
.mdx-hero { .mdx-hero {
margin-bottom: 200px; margin-bottom: 200px;
} }
@ -187,10 +159,50 @@ h2 {
line-height: 40px !important; line-height: 40px !important;
} }
} }
#open-source-and-support {
.mdx-grid__content {
flex-direction: column;
gap: 40px;
}
}
h3 {
margin-top: 16px !important;
}
.mdx-grid__content > div:first-child {
a {
margin-top: 16px !important;
}
}
.hero-image {
margin-right: 22px;
scale: 1.15;
margin-top: -27%;
}
}
@media screen and (max-width: 650px) {
.hero-image {
margin-top: -24%;
scale: 1;
}
.mdx-hero {
margin-bottom: 180px;
}
} }
@media screen and (max-width: 450px) { @media screen and (max-width: 450px) {
.mdx-hero { .mdx-hero {
margin-bottom: 60px; margin-bottom: 120px;
}
.hero-image {
margin-right: 32px;
scale: 1.36;
margin-top: -18%;
} }
} }