mirror of
https://github.com/skidoodle/albert.lol.git
synced 2025-02-15 06:09:15 +01:00
🔥
This commit is contained in:
skidoodle
parent
2869c4e4ac
commit
4ef7a49d93
4 changed files with 31 additions and 77 deletions
|
|
@ -16,6 +16,7 @@
|
||||||
"next": "12.1.1",
|
"next": "12.1.1",
|
||||||
"react": "17.0.2",
|
"react": "17.0.2",
|
||||||
"react-dom": "17.0.2",
|
"react-dom": "17.0.2",
|
||||||
|
"react-fade-in": "^2.0.1",
|
||||||
"react-hot-toast": "^2.2.0",
|
"react-hot-toast": "^2.2.0",
|
||||||
"react-icons": "^4.3.1",
|
"react-icons": "^4.3.1",
|
||||||
"sass": "^1.49.9",
|
"sass": "^1.49.9",
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
import { GetServerSideProps } from 'next'
|
import { GetServerSideProps } from 'next'
|
||||||
import Head from 'next/head'
|
import Head from 'next/head'
|
||||||
|
import FadeIn from 'react-fade-in'
|
||||||
import Body from 'components/Body'
|
import Body from 'components/Body'
|
||||||
import Footer from 'components/Footer'
|
import Footer from 'components/Footer'
|
||||||
import Icon from 'components/Icon'
|
import Icon from 'components/Icon'
|
||||||
|
|
@ -19,17 +20,21 @@ const Home = ({data}: any) => {
|
||||||
<title>albert</title>
|
<title>albert</title>
|
||||||
</Head>
|
</Head>
|
||||||
<Body>
|
<Body>
|
||||||
<MainLayout />
|
<FadeIn>
|
||||||
<IconLayout>
|
<div><MainLayout /></div>
|
||||||
<Icon icon={<FaGithub />} reference={'https://github.com/skidoodle'} copy={false} />
|
<div>
|
||||||
<Icon icon={<FaSteam />} reference={'https://steamcommunity.com/id/_albert'} copy={false} />
|
<IconLayout>
|
||||||
<Icon icon={<FaEnvelope />} reference={'hello@albrt.hu'} copy={true} />
|
<Icon icon={<FaGithub />} reference={'https://github.com/skidoodle'} copy={false} />
|
||||||
<Icon icon={<RiInstagramFill />} reference={'https://instagram.com/albertadam_'} copy={false} />
|
<Icon icon={<FaSteam />} reference={'https://steamcommunity.com/id/_albert'} copy={false} />
|
||||||
<Icon icon={<SiDiscord />} reference={'albert#8838'} copy={true} />
|
<Icon icon={<FaEnvelope />} reference={'hello@albrt.hu'} copy={true} />
|
||||||
</IconLayout>
|
<Icon icon={<RiInstagramFill />} reference={'https://instagram.com/albertadam_'} copy={false} />
|
||||||
<Time />
|
<Icon icon={<SiDiscord />} reference={'albert#8838'} copy={true} />
|
||||||
<Weather data={data}/>
|
</IconLayout>
|
||||||
<Spotify />
|
</div>
|
||||||
|
<div><Time /></div>
|
||||||
|
<div><Weather data={data} /></div>
|
||||||
|
<div><Spotify /></div>
|
||||||
|
</FadeIn>
|
||||||
</Body>
|
</Body>
|
||||||
<Footer />
|
<Footer />
|
||||||
</>
|
</>
|
||||||
|
|
|
||||||
|
|
@ -4,8 +4,6 @@
|
||||||
margin-top: 8rem;
|
margin-top: 8rem;
|
||||||
margin-left: 10%;
|
margin-left: 10%;
|
||||||
margin-right: 10%;
|
margin-right: 10%;
|
||||||
animation: fadeIn .4s forwards;
|
|
||||||
transition: all .2s ease-in-out;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mainLayout {
|
.mainLayout {
|
||||||
|
|
@ -29,31 +27,18 @@
|
||||||
svg {
|
svg {
|
||||||
font-size: 1.4em;
|
font-size: 1.4em;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
margin-right: 7%;
|
margin-right: 6%;
|
||||||
margin-bottom: 1em;
|
margin-bottom: 1em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.time,
|
|
||||||
.weather,
|
|
||||||
.spotify {
|
|
||||||
animation: fadeIn .6s forwards;
|
|
||||||
opacity: 0;
|
|
||||||
font-size: 1em;
|
|
||||||
}
|
|
||||||
.time svg,
|
|
||||||
.weather svg {
|
|
||||||
font-size: .9rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.time {
|
.time {
|
||||||
animation-delay: 0.2s;
|
svg {
|
||||||
|
font-size: .9em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.weather {
|
.weather {
|
||||||
opacity: 0;
|
|
||||||
animation-delay: 0.5s;
|
|
||||||
|
|
||||||
img {
|
img {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
@ -70,17 +55,17 @@
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: #C7D2FE;
|
color: #C7D2FE;
|
||||||
}
|
}
|
||||||
|
svg {
|
||||||
|
font-size: .9em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.spotify {
|
.spotify {
|
||||||
font-size: .9em;
|
font-size: 1em;
|
||||||
margin-top: 5%;
|
margin-top: 5%;
|
||||||
opacity: 0;
|
|
||||||
animation-delay: .7s;
|
|
||||||
padding: 1rem 1rem 1.8rem 1rem;
|
padding: 1rem 1rem 1.8rem 1rem;
|
||||||
border: 1px solid $spotify-box-color;
|
border: 1px solid $spotify-box-color;
|
||||||
border-radius: .5rem;
|
border-radius: .5rem;
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
img {
|
img {
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
|
|
@ -140,13 +125,4 @@
|
||||||
.bodySection {
|
.bodySection {
|
||||||
margin-top: 15rem;
|
margin-top: 15rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes fadeIn {
|
|
||||||
from {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
38
yarn.lock
38
yarn.lock
|
|
@ -32,39 +32,6 @@
|
||||||
minimatch "^3.0.4"
|
minimatch "^3.0.4"
|
||||||
strip-json-comments "^3.1.1"
|
strip-json-comments "^3.1.1"
|
||||||
|
|
||||||
"@fortawesome/fontawesome-common-types@6.1.1":
|
|
||||||
version "6.1.1"
|
|
||||||
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.1.1.tgz#7dc996042d21fc1ae850e3173b5c67b0549f9105"
|
|
||||||
integrity sha512-wVn5WJPirFTnzN6tR95abCx+ocH+3IFLXAgyavnf9hUmN0CfWoDjPT/BAWsUVwSlYYVBeCLJxaqi7ZGe4uSjBA==
|
|
||||||
|
|
||||||
"@fortawesome/fontawesome-svg-core@^6.1.1":
|
|
||||||
version "6.1.1"
|
|
||||||
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.1.1.tgz#3424ec6182515951816be9b11665d67efdce5b5f"
|
|
||||||
integrity sha512-NCg0w2YIp81f4V6cMGD9iomfsIj7GWrqmsa0ZsPh59G7PKiGN1KymZNxmF00ssuAlo/VZmpK6xazsGOwzKYUMg==
|
|
||||||
dependencies:
|
|
||||||
"@fortawesome/fontawesome-common-types" "6.1.1"
|
|
||||||
|
|
||||||
"@fortawesome/free-brands-svg-icons@^6.1.1":
|
|
||||||
version "6.1.1"
|
|
||||||
resolved "https://registry.yarnpkg.com/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-6.1.1.tgz#3580961d4f42bd51dc171842402f23a18a5480b1"
|
|
||||||
integrity sha512-mFbI/czjBZ+paUtw5NPr2IXjun5KAC8eFqh1hnxowjA4mMZxWz4GCIksq6j9ZSa6Uxj9JhjjDVEd77p2LN2Blg==
|
|
||||||
dependencies:
|
|
||||||
"@fortawesome/fontawesome-common-types" "6.1.1"
|
|
||||||
|
|
||||||
"@fortawesome/free-solid-svg-icons@^6.1.1":
|
|
||||||
version "6.1.1"
|
|
||||||
resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.1.1.tgz#3369e673f8fe8be2fba30b1ec274d47490a830a6"
|
|
||||||
integrity sha512-0/5exxavOhI/D4Ovm2r3vxNojGZioPwmFrKg0ZUH69Q68uFhFPs6+dhAToh6VEQBntxPRYPuT5Cg1tpNa9JUPg==
|
|
||||||
dependencies:
|
|
||||||
"@fortawesome/fontawesome-common-types" "6.1.1"
|
|
||||||
|
|
||||||
"@fortawesome/react-fontawesome@^0.1.18":
|
|
||||||
version "0.1.18"
|
|
||||||
resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.18.tgz#dae37f718a24e14d7a99a5496c873d69af3fbd73"
|
|
||||||
integrity sha512-RwLIB4TZw0M9gvy5u+TusAA0afbwM4JQIimNH/j3ygd6aIvYPQLqXMhC9ErY26J23rDPyDZldIfPq/HpTTJ/tQ==
|
|
||||||
dependencies:
|
|
||||||
prop-types "^15.8.1"
|
|
||||||
|
|
||||||
"@humanwhocodes/config-array@^0.9.2":
|
"@humanwhocodes/config-array@^0.9.2":
|
||||||
version "0.9.5"
|
version "0.9.5"
|
||||||
resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.9.5.tgz#2cbaf9a89460da24b5ca6531b8bbfc23e1df50c7"
|
resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.9.5.tgz#2cbaf9a89460da24b5ca6531b8bbfc23e1df50c7"
|
||||||
|
|
@ -1566,6 +1533,11 @@ react-dom@17.0.2:
|
||||||
object-assign "^4.1.1"
|
object-assign "^4.1.1"
|
||||||
scheduler "^0.20.2"
|
scheduler "^0.20.2"
|
||||||
|
|
||||||
|
react-fade-in@^2.0.1:
|
||||||
|
version "2.0.1"
|
||||||
|
resolved "https://registry.yarnpkg.com/react-fade-in/-/react-fade-in-2.0.1.tgz#b4bcd7dac63d6857ebcd68facbff2f5f9616278f"
|
||||||
|
integrity sha512-oqS/WT4znaXEHmL+yo0IDUDY7uC9K4RP35j1SdRUEBspR09B2iIC0i8oJ28tPOr6Ez/L2aktF9p89j+DbsTVNw==
|
||||||
|
|
||||||
react-hot-toast@^2.2.0:
|
react-hot-toast@^2.2.0:
|
||||||
version "2.2.0"
|
version "2.2.0"
|
||||||
resolved "https://registry.yarnpkg.com/react-hot-toast/-/react-hot-toast-2.2.0.tgz#ab6f4caed4214b9534f94bb8cfaaf21b051e62b9"
|
resolved "https://registry.yarnpkg.com/react-hot-toast/-/react-hot-toast-2.2.0.tgz#ab6f4caed4214b9534f94bb8cfaaf21b051e62b9"
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue