feat: enhance styling and layout with new global styles, scrollbar customization, and updated content
- Added Google Sans Code font to globals.css for improved typography. - Introduced new CSS variables for theming in globals.css, enhancing dark mode support. - Updated layout.tsx to include custom scrollbar styles from scrollbar.css. - Modified page.tsx to improve the "About" section with more engaging content. - Refactored NeoFetch component for better styling and layout consistency. - Commented out scroll behavior in Top component for smoother navigation. - Added new art.html file for visual representation in the NeoFetch component.
This commit is contained in:
parent
24e5a3c397
commit
10bf4378b6
7 changed files with 220 additions and 33 deletions
122
public/art.html
Normal file
122
public/art.html
Normal file
|
|
@ -0,0 +1,122 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
|
||||||
|
<meta name="theme-color" content="#0C0C0C">
|
||||||
|
<meta name="date" content="2025-10-21T13:11:07.098Z">
|
||||||
|
<link href="https://fonts.cdnfonts.com/css/cascadia-code" rel="stylesheet">
|
||||||
|
<title>imnyang</title>
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--color-primary-light: #FFD7D7;
|
||||||
|
--color-secondary-light: #EEEEEE;
|
||||||
|
--color-tertiary-light: #FFFFFF;
|
||||||
|
--color-quaternary-light: #E4E4E4;
|
||||||
|
--color-quinary-light: #DADADA;
|
||||||
|
--color-senary-light: #D7D7D7;
|
||||||
|
--color-septenary-light: #D0D0D0;
|
||||||
|
--color-text: #fcf8f9;
|
||||||
|
--background: #191017;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: light) {
|
||||||
|
:root {
|
||||||
|
--color-primary-light: #FFD7D7;
|
||||||
|
--color-secondary-light: #EEEEEE;
|
||||||
|
--color-tertiary-light: #FFFFFF;
|
||||||
|
--color-quaternary-light: #E4E4E4;
|
||||||
|
--color-quinary-light: #DADADA;
|
||||||
|
--color-senary-light: #D7D7D7;
|
||||||
|
--color-septenary-light: #D0D0D0;
|
||||||
|
--color-text: #fcf8f9;
|
||||||
|
--background: #191017;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
font-variant-ligatures: none;
|
||||||
|
font-feature-settings: 'liga' 0, 'clig' 0;
|
||||||
|
}
|
||||||
|
html, body {
|
||||||
|
background: var(--background);
|
||||||
|
color: var(--color-text);
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
pre {
|
||||||
|
font-family: 'Cascadia Code', sans-serif;
|
||||||
|
font-size: 4pt;
|
||||||
|
line-height: 1.2;
|
||||||
|
margin: 0px 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body><pre><span style="color: var(--color-primary-light);"> w _gggggggggggggg ,ggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggg
|
||||||
|
,g@@@@@@@@@@@@@@@@@ ,@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@@',@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@? @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@P @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@ !@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@ P""%@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@ ,@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@| @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@P ' @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@@PQ@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@{ /@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@| @@@@ [@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@g .@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@; @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@ [@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@ .@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ .@@@ {@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ |@@1 @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@ |@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ [@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@; @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@ [@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@@ '@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@N @ ! @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@@</span><span style="color: var(--color-secondary-light);">: </span><span style="color: var(--color-primary-light);">9@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@| @j |@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@W @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ |@F @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@ </span><span style="color: var(--color-tertiary-light);">/@ </span><span style="color: var(--color-primary-light);">Q@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@ _ @B@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@'</span><span style="color: var(--color-tertiary-light);">,@@@ </span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@| @F @@, '@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@W </span><span style="color: var(--color-tertiary-light);">@@@@@ </span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @ /@@@L @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@ </span><span style="color: var(--color-tertiary-light);">{@@@@@p </span><span style="color: var(--color-primary-light);">`@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ # @@@@@L @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@ </span><span style="color: var(--color-tertiary-light);">/@@@@@@@a </span><span style="color: var(--color-primary-light);">`@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@' T +</span><span style="color: var(--color-tertiary-light);">a</span><span style="color: var(--color-primary-light);">T@@@@L t@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@'</span><span style="color: var(--color-tertiary-light);">,@@@@@@@@@\ .</span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ </span><span style="color: var(--color-secondary-light);">, ,</span><span style="color: var(--color-tertiary-light);">,@@_</span><span style="color: var(--color-primary-light);">Q@@@b '@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@'</span><span style="color: var(--color-tertiary-light);">,@@@@@@@@@@@, \</span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@F </span><span style="color: var(--color-secondary-light);">' F</span><span style="color: var(--color-tertiary-light);">@@@@@_</span><span style="color: var(--color-primary-light);">@@@@ %@@@@D" [@@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@ </span><span style="color: var(--color-tertiary-light);">,@@@@@@@@@@@@@, </span><span style="color: var(--color-primary-light);">Q@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ </span><span style="color: var(--color-secondary-light);">/</span><span style="color: var(--color-tertiary-light);">@@@@@@@@_</span><span style="color: var(--color-primary-light);">0@@</span><span style="color: var(--color-secondary-light);">. </span><span style="color: var(--color-primary-light);">__g@@@@D</span><span style="color: var(--color-tertiary-light);">,</span><span style="color: var(--color-primary-light);">[@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@ </span><span style="color: var(--color-tertiary-light);">_@@@@@@@@@@@@@@@, </span><span style="color: var(--color-primary-light);">[@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@? </span><span style="color: var(--color-tertiary-light);">_@@@@@@@@B>" ___ </span><span style="color: var(--color-primary-light);">'@@B></span><span style="color: var(--color-tertiary-light);">_g@@</span><span style="color: var(--color-primary-light);">!@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@F </span><span style="color: var(--color-tertiary-light);">_________ """=4B@, </span><span style="color: var(--color-primary-light);">\@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@"+@@@@@@@@@ </span><span style="color: var(--color-tertiary-light);">,@@B=" __g@@@@@@@a \@@@@@@L</span><span style="color: var(--color-primary-light);">T@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@D </span><span style="color: var(--color-tertiary-light);">/@@@@@@@@@@@@@@@@gg__ </span><span style="color: var(--color-primary-light);">""=B@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g____ </span><span style="color: var(--color-tertiary-light);">__~gW@@@@@@@@@@@@@@@_ "@@@@@@</span><span style="color: var(--color-primary-light);">'@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@F </span><span style="color: var(--color-tertiary-light);">g@@@@@@@@@@@@@@@@@@@@@a a </span><span style="color: var(--color-primary-light);">-ggp___ "<4@@@@@@@@_g "@@@@@@@@@@@@@@@@@@@@@@@@@@@W </span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@@@@@@@@@@@@@g_ "4@@@L</span><span style="color: var(--color-primary-light);">t@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@ </span><span style="color: var(--color-tertiary-light);">_@@@@@@@@@@@@@@@@@@@@@@@@@ t,</span><span style="color: var(--color-primary-light);">'@@@@@@@@g~____/@@@@@_ _, @@@@@@@@@@@@@@@@@@@@@@@ ;@</span><span style="color: var(--color-tertiary-light);">g@@@@@@@@@@@@@@@@@@@@@@@@@g_ -___ </span><span style="color: var(--color-primary-light);">""[@@@@@@@@@g
|
||||||
|
[BP* </span><span style="color: var(--color-tertiary-light);">"" `"""=BB@@@,'a </span><span style="color: var(--color-primary-light);">T@@@@@@@@@@@@@@@@@@@ [@_@@@@@@@@@@@@@@@@@@@@@@ @</span><span style="color: var(--color-tertiary-light);">,@@@@@@@@@@@@@@@@@@@BD=""" ''<B@@_</span><span style="color: var(--color-primary-light);">%@@@@@@@@@@@@g
|
||||||
|
</span><span style="color: var(--color-tertiary-light);">""" _gg@@@@@@@@mmgg~______ <. </span><span style="color: var(--color-primary-light);">Q@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@D @/</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@@@@D>" _ ___g@@@@@@@@@@@@_</span><span style="color: var(--color-primary-light);">+@@@@@@@@@@g
|
||||||
|
</span><span style="color: var(--color-tertiary-light);">_ </span><span style="color: var(--color-secondary-light);">_ </span><span style="color: var(--color-tertiary-light);">-~---_______ """=. , </span><span style="color: var(--color-primary-light);">'<8@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@" @F</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@D" __+" __+@@D>"" ____.--- `g@@g_</span><span style="color: var(--color-primary-light);">"8@@@@@@g
|
||||||
|
</span><span style="color: var(--color-tertiary-light);">,____~_~~~gggg~______ -.._ ""<0B@gg, </span><span style="color: var(--color-secondary-light);">_ </span><span style="color: var(--color-primary-light);">'8@@@@@@@@@@@@PQ@@@@@@@@@@@@@@@@P </span><span style="color: var(--color-tertiary-light);">/ </span><span style="color: var(--color-primary-light);">@F</span><span style="color: var(--color-tertiary-light);">@@@@@@@" ,*' _o@B>" __wr>" __..-===0@@@@@@@@@@g__</span><span style="color: var(--color-secondary-light);">-</span><span style="color: var(--color-primary-light);">"""
|
||||||
|
</span><span style="color: var(--color-tertiary-light);">'>""" " </span><span style="color: var(--color-primary-light);">>, <@@@@@@@@@@ [@@@@@@@@@@@@@@P </span><span style="color: var(--color-secondary-light);">" </span><span style="color: var(--color-primary-light);">@'</span><span style="color: var(--color-tertiary-light);">@@@@@P '__@@D" .-' ... </span><span style="color: var(--color-secondary-light);">__</span><span style="color: var(--color-tertiary-light);">4@@@@@@@@@@@@@@g
|
||||||
|
;g@@@@@@g </span><span style="color: var(--color-secondary-light);">!</span><span style="color: var(--color-quinary-light);">/</span><span style="color: var(--color-senary-light);">ggggg~_____</span><span style="color: var(--color-quinary-light);">---"-</span><span style="color: var(--color-senary-light);">_</span><span style="color: var(--color-quinary-light);">". </span><span style="color: var(--color-tertiary-light);">ggg_____ ,</span><span style="color: var(--color-primary-light);">`Q@@@@@@@ [@@@@@@@D @@@@@@ ,@</span><span style="color: var(--color-tertiary-light);">_@@@@F _g@@BP' ..</span><span style="color: var(--color-secondary-light);">_</span><span style="color: var(--color-tertiary-light);">~'</span><span style="color: var(--color-secondary-light);">-~~"</span><span style="color: var(--color-primary-light);">_ggg@B@W@@p</span><span style="color: var(--color-tertiary-light);">'@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@ ; </span><span style="color: var(--color-quinary-light);">'</span><span style="color: var(--color-senary-light);">@@@@@@@@@@@@@@@@@@1</span><span style="color: var(--color-quaternary-light);">! </span><span style="color: var(--color-tertiary-light);">@@@@@@@ </span><span style="color: var(--color-senary-light);">'p_</span><span style="color: var(--color-quinary-light);">. </span><span style="color: var(--color-tertiary-light);">-_ </span><span style="color: var(--color-primary-light);">P=B@@) @@@@@@P @@@@@P _P</span><span style="color: var(--color-tertiary-light);">o@@@@" o@D" ___g@@ </span><span style="color: var(--color-primary-light);">_g@@@=</span><span style="color: var(--color-secondary-light);">_~gg_~</span><span style="color: var(--color-primary-light);">_@@@@@@@@p</span><span style="color: var(--color-tertiary-light);">'@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@ ' </span><span style="color: var(--color-quaternary-light);">'</span><span style="color: var(--color-senary-light);">'@@@@@@@@@@@@@@@@@@</span><span style="color: var(--color-quinary-light);">! </span><span style="color: var(--color-tertiary-light);">!@@@@@g </span><span style="color: var(--color-septenary-light);">.</span><span style="color: var(--color-senary-light);">, </span><span style="color: var(--color-tertiary-light);">@@@@@gg___ </span><span style="color: var(--color-primary-light);">.@@@@P ,@@@@B _@@gggg </span><span style="color: var(--color-tertiary-light);">__g@@@@@@@@</span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@@ </span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@ </span><span style="color: var(--color-secondary-light);">'</span><span style="color: var(--color-quinary-light);">'</span><span style="color: var(--color-senary-light);">@@@@@@@@@@@@@@@@@@,</span><span style="color: var(--color-quaternary-light);">, </span><span style="color: var(--color-tertiary-light);">@@@@@@ </span><span style="color: var(--color-senary-light);">';</span><span style="color: var(--color-septenary-light);">_g</span><span style="color: var(--color-senary-light);">.</span><span style="color: var(--color-quaternary-light);">: </span><span style="color: var(--color-tertiary-light);">@@@@@@@@@F </span><span style="color: var(--color-primary-light);">@@@F _@',@@@P _@@@@@@@9 , p</span><span style="color: var(--color-tertiary-light);">"@@@@@@@@@@@@</span><span style="color: var(--color-primary-light);">9@@@@@@@@@@@@@@@@@@@@@/</span><span style="color: var(--color-tertiary-light);">g@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@, </span><span style="color: var(--color-quaternary-light);">'</span><span style="color: var(--color-senary-light);">\@@@@@@@@@@@@@@@@@@</span><span style="color: var(--color-quinary-light);">, </span><span style="color: var(--color-tertiary-light);">{@@@@@ </span><span style="color: var(--color-quinary-light);">{</span><span style="color: var(--color-senary-light);">B </span><span style="color: var(--color-septenary-light);">0,</span><span style="color: var(--color-quinary-light);">; </span><span style="color: var(--color-tertiary-light);">@@@@@@@F</span><span style="color: var(--color-secondary-light);">j </span><span style="color: var(--color-primary-light);">*D o@@ .@B" _@@@@@@@@@@@@g__@</span><span style="color: var(--color-tertiary-light);">'@@@@@@@@@@@L</span><span style="color: var(--color-primary-light);">Q@@@@@@@@@@@@@@@@@@F</span><span style="color: var(--color-tertiary-light);">_@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@ </span><span style="color: var(--color-quinary-light);">'</span><span style="color: var(--color-senary-light);">@@@@@@@@@@@@@@@@@@, </span><span style="color: var(--color-tertiary-light);">@@@@@ </span><span style="color: var(--color-quinary-light);">[</span><span style="color: var(--color-senary-light);">g</span><span style="color: var(--color-septenary-light);">-T]</span><span style="color: var(--color-quinary-light);">! </span><span style="color: var(--color-tertiary-light);">[@@@@@</span><span style="color: var(--color-primary-light);">/' _@@@@ _ __@@@@@@@@@@@@@@@@@@@g</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@@@@_</span><span style="color: var(--color-primary-light);"><@@@@@@@@@@B=>"</span><span style="color: var(--color-secondary-light);">~@g@@_</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@g </span><span style="color: var(--color-senary-light);">'@@@@@@@@@@@@@@@@@@</span><span style="color: var(--color-quinary-light);">\ </span><span style="color: var(--color-tertiary-light);">{@@@@ </span><span style="color: var(--color-quinary-light);">'</span><span style="color: var(--color-senary-light);">@@1</span><span style="color: var(--color-septenary-light);">+</span><span style="color: var(--color-senary-light);">, </span><span style="color: var(--color-tertiary-light);">'@@@F</span><span style="color: var(--color-primary-light);">@@gg@@@@@P _@@@@@@@@@@@@@@@@@@@@@@@'</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@@@@@@@@@@@@@@@@F</span><span style="color: var(--color-secondary-light);">$@@@@@@@@g</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@l </span><span style="color: var(--color-quaternary-light);">\</span><span style="color: var(--color-senary-light);">V@@@@@@@@@@@@@@@@@!</span><span style="color: var(--color-tertiary-light);">! @@@@ </span><span style="color: var(--color-quaternary-light);">'</span><span style="color: var(--color-senary-light);">[@@@'</span><span style="color: var(--color-secondary-light);">. </span><span style="color: var(--color-tertiary-light);">@@P</span><span style="color: var(--color-primary-light);">@@@@@@@@@@y@@@@@@@@@@@@@@@@@@@@@@@@D</span><span style="color: var(--color-tertiary-light);">g@@@@@@@@@@@@@@@@@@@@@@@@g</span><span style="color: var(--color-secondary-light);">j@@@@@@@@@@ </span><span style="color: var(--color-tertiary-light);">@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@, </span><span style="color: var(--color-quinary-light);">'</span><span style="color: var(--color-senary-light);">@@@@@@@@@BD=<f>"</span><span style="color: var(--color-tertiary-light);">g@@L @@8 ggggg@g @@ </span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@F</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@@@@@@@@@@@@@@@@H </span><span style="color: var(--color-secondary-light);">]@@@@@@@@@@@</span><span style="color: var(--color-tertiary-light);">[@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@ </span><span style="color: var(--color-quaternary-light);">'</span><span style="color: var(--color-senary-light);">'@B"</span><span style="color: var(--color-tertiary-light);">__~g@@@@@@@@@@@@b " {@@@@@@@ @@,</span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@P</span><span style="color: var(--color-tertiary-light);">_@@@@@@@@@@@@@@@@@@@@@@@@@W3</span><span style="color: var(--color-secondary-light);">:W@@@@@@@@@@@@,</span><span style="color: var(--color-tertiary-light);">@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@ 0@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @@@</span><span style="color: var(--color-primary-light);">'@@@@@@@@@@@@@@@@@@@@@@@B="</span><span style="color: var(--color-tertiary-light);">_g@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g@</span><span style="color: var(--color-secondary-light);">[@@@@@@@@@@@@@</span><span style="color: var(--color-tertiary-light);">@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g@@@@b</span><span style="color: var(--color-primary-light);">+@@@@@@@@@@@@@@"</span><span style="color: var(--color-tertiary-light);">~g@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@</span><span style="color: var(--color-secondary-light);">'@@@@@@@@@@@@@</span><span style="color: var(--color-tertiary-light);">|@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g</span><span style="color: var(--color-primary-light);">"<4B@@@BP"</span><span style="color: var(--color-tertiary-light);">o@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@</span><span style="color: var(--color-secondary-light);">\@@@@@@@@@@@P</span><span style="color: var(--color-tertiary-light);">j@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@@ '@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g</span><span style="color: var(--color-secondary-light);">T@@@@@@@@@@</span><span style="color: var(--color-tertiary-light);">g@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@@@@@@@@ '@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@,</span><span style="color: var(--color-secondary-light);">@@@@@@@@@g</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@g
|
||||||
|
[@@@@@@D>""""9Q@@@@@ `@@@@@@@@@@B=*"" ___@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@BBBBBB@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@B</span><span style="color: var(--color-secondary-light);">'@@@@@@@@@</span><span style="color: var(--color-tertiary-light);">]@@@@@@@@g
|
||||||
|
[@@@@'</span><span style="color: var(--color-primary-light);">@R@@@@g</span><span style="color: var(--color-secondary-light);">\ </span><span style="color: var(--color-tertiary-light);">""""" -~-`"" _____og@@@@@@@@@@@@@B>""" </span><span style="color: var(--color-primary-light);">______~ggggggggg@@gg </span><span style="color: var(--color-tertiary-light);">T@@@@@@@@@@@@@@@@@@@@@@@@@@@@@g_</span><span style="color: var(--color-secondary-light);">*B@@@P</span><span style="color: var(--color-tertiary-light);">_@@@@@@@@B"
|
||||||
|
[@@D</span><span style="color: var(--color-secondary-light);">~ </span><span style="color: var(--color-primary-light);">_@@@@@@@_</span><span style="color: var(--color-secondary-light);"><=====mnmmmmm==r~-=_</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@@@@@@@@@@@@@@ </span><span style="color: var(--color-primary-light);">_g@@@@@@@@@@@@@@@@@@@@@@@@@F</span><span style="color: var(--color-tertiary-light);">_@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@B" </span><span style="color: var(--color-primary-light);">_og
|
||||||
|
</span><span style="color: var(--color-tertiary-light);">'@P</span><span style="color: var(--color-primary-light);">_@W@@@@@@@@@@@@@PB+</span><span style="color: var(--color-secondary-light);">~gM@@@@@g_.+^g</span><span style="color: var(--color-tertiary-light);">t@@@@@@@@@@@@@@@@@@@@@ </span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@B====>" </span><span style="color: var(--color-tertiary-light);">_~@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@B" ,oF</span><span style="color: var(--color-primary-light);">g@@g
|
||||||
|
</span><span style="color: var(--color-tertiary-light);">P</span><span style="color: var(--color-primary-light);">/@@@@@@@@@@@@@g </span><span style="color: var(--color-secondary-light);">-@@@@@M""" ._~</span><span style="color: var(--color-primary-light);">"</span><span style="color: var(--color-secondary-light);">A8</span><span style="color: var(--color-primary-light);">_g</span><span style="color: var(--color-tertiary-light);">9@@@@@@@@@@@@@@@@@@@@ </span><span style="color: var(--color-primary-light);">9@@@@@@@@@@@@B> </span><span style="color: var(--color-tertiary-light);">_o@@@W@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@P' _gB"</span><span style="color: var(--color-primary-light);">_@@@@g
|
||||||
|
</span><span style="color: var(--color-secondary-light);">' </span><span style="color: var(--color-primary-light);"><@@@@@@@@@@@@@</span><span style="color: var(--color-secondary-light);">'<</span><span style="color: var(--color-primary-light);">__ggW@@@@@@@@@@@@@</span><span style="color: var(--color-tertiary-light);">|@@@@@@@@@@@@@@@@@@@@,</span><span style="color: var(--color-secondary-light);">'</span><span style="color: var(--color-primary-light);">"8BBB=="" </span><span style="color: var(--color-tertiary-light);">__g@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@D" _@@P</span><span style="color: var(--color-primary-light);">o@@@@@@@g
|
||||||
|
, </span><span style="color: var(--color-secondary-light);">"</span><span style="color: var(--color-primary-light);">`t@@@@@@@@@@@@@@@@@@@@@@@@@@@@F</span><span style="color: var(--color-tertiary-light);">g@@@@@@@@@@@@@@@@@@@@@@ggggg@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@P" </span><span style="color: var(--color-primary-light);">__g@@@@@@@@@@@@@g
|
||||||
|
!@@_</span><span style="color: var(--color-secondary-light);">.__ ;</span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@@@@@"</span><span style="color: var(--color-tertiary-light);">g@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@+ _,</span><span style="color: var(--color-primary-light);">_o@@@@@@@@@@@@@@@@@@g
|
||||||
|
'@@[</span><span style="color: var(--color-tertiary-light);">_</span><span style="color: var(--color-primary-light);"><B@@@@@@@@@@@</span><span style="color: var(--color-secondary-light);">, </span><span style="color: var(--color-primary-light);">[@@@@@@B="</span><span style="color: var(--color-secondary-light);">s</span><span style="color: var(--color-tertiary-light);">_g@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@BBB==>""""""""=0@@" __@@F</span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[g "@_</span><span style="color: var(--color-tertiary-light);">@@@@gp~</span><span style="color: var(--color-secondary-light);">"</span><span style="color: var(--color-tertiary-light);">___</span><span style="color: var(--color-primary-light);">"</span><span style="color: var(--color-secondary-light);">-</span><span style="color: var(--color-tertiary-light);">/ q___~ggg@@@B@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@B*"" _____go~+grqggggggggg~___ "*F</span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@_ </span><span style="color: var(--color-secondary-light);">'</span><span style="color: var(--color-tertiary-light);"><@@@@@@@@@@@@,'@@@@@@@@@" @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@B=" __~g@@@@@@@@@@@@@@| @@@@@@@@@@@@@@@@@g, </span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@g_</span><span style="color: var(--color-tertiary-light);">.@@@@@@@@@@@L`8@@@@@@P @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@B=" __g@@@@@@@@@@@@@@@@BP>"</span><span style="color: var(--color-secondary-light);">_</span><span style="color: var(--color-tertiary-light);">\ .</span><span style="color: var(--color-secondary-light);">:@@@@@@@@g_</span><span style="color: var(--color-tertiary-light);">4@@@@@@ </span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@_</span><span style="color: var(--color-tertiary-light);">@@@@@@@@@@@@_ `"" __@@@@@@@@@@@@@@@@@@@@@@@@@@@@B> g@@@@@@@@@@@@@B>"</span><span style="color: var(--color-secondary-light);">~g@@@@@@@@ </span><span style="color: var(--color-tertiary-light);">|</span><span style="color: var(--color-secondary-light);">[@@@@@@@@@@@L</span><span style="color: var(--color-tertiary-light);">@@@@@</span><span style="color: var(--color-primary-light);">.g@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
[@@@@@@@@@@@__ </span><span style="color: var(--color-tertiary-light);">"<B@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@D" _g@@@ / @@@@@@B>"</span><span style="color: var(--color-secondary-light);">og@@@@@@@@@@@@@@@, </span><span style="color: var(--color-tertiary-light);">[</span><span style="color: var(--color-secondary-light);">@@@@@@@@@@@@@,</span><span style="color: var(--color-tertiary-light);">@@@@1</span><span style="color: var(--color-primary-light);">@@@@@@@@@@@@@@@@@@@@@@g
|
||||||
|
!BBBBBBBBBBBBBBB.</span><span style="color: var(--color-secondary-light);">.</span><span style="color: var(--color-tertiary-light);">. """""==4BBBBBBBBBBP>"D==4BBBBP .mBBBBBB" BBBB"</span><span style="color: var(--color-secondary-light);">oBBBBBBBBBBBBBBBBBBBBB </span><span style="color: var(--color-tertiary-light);">"</span><span style="color: var(--color-secondary-light);">BBBBBBBBBBBBBh</span><span style="color: var(--color-tertiary-light);">BBBBBa</span><span style="color: var(--color-primary-light);">BBBBBBBBBBBBBBBBBBBBBN
|
||||||
|
</span></pre></body>
|
||||||
|
</html>
|
||||||
|
|
@ -1,4 +1,5 @@
|
||||||
@import url("https://cdn.jsdelivr.net/gh/wanteddev/wanted-sans@v1.0.3/packages/wanted-sans/fonts/webfonts/variable/split/WantedSansVariable.min.css");
|
@import url("https://cdn.jsdelivr.net/gh/wanteddev/wanted-sans@v1.0.3/packages/wanted-sans/fonts/webfonts/variable/split/WantedSansVariable.min.css");
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Google+Sans+Code:ital,wght@0,300..800;1,300..800&display=swap');
|
||||||
@import "tailwindcss";
|
@import "tailwindcss";
|
||||||
@import "tw-animate-css";
|
@import "tw-animate-css";
|
||||||
|
|
||||||
|
|
@ -14,6 +15,42 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
|
--background: hsl(340 40% 98%);
|
||||||
|
--foreground: hsl(315 21% 8%);
|
||||||
|
--card: hsl(340 40% 98%);
|
||||||
|
--card-foreground: hsl(315 21% 8%);
|
||||||
|
--popover: hsl(340 40% 98%);
|
||||||
|
--popover-foreground: hsl(315 21% 8%);
|
||||||
|
--primary: hsl(340 25% 15%);
|
||||||
|
--primary-foreground: hsl(0 0% 98%);
|
||||||
|
--secondary: hsl(340 25% 95%);
|
||||||
|
--secondary-foreground: hsl(240 5.9% 10%);
|
||||||
|
--muted: hsl(340 20% 95%);
|
||||||
|
--muted-foreground: hsl(340 10% 60%);
|
||||||
|
--accent: hsl(340 25% 94%);
|
||||||
|
--accent-foreground: hsl(240 5.9% 10%);
|
||||||
|
--destructive: hsl(0 84.2% 60.2%);
|
||||||
|
--destructive-foreground: hsl(0 0% 98%);
|
||||||
|
--border: hsl(340 25% 90%);
|
||||||
|
--input: hsl(340 25% 90%);
|
||||||
|
--ring: hsl(315 21% 8%);
|
||||||
|
--chart-1: hsl(12 76% 61%);
|
||||||
|
--chart-2: hsl(173 58% 39%);
|
||||||
|
--chart-3: hsl(197 37% 24%);
|
||||||
|
--chart-4: hsl(43 74% 66%);
|
||||||
|
--chart-5: hsl(27 87% 67%);
|
||||||
|
--radius: 0.6rem;
|
||||||
|
--sidebar-background: hsl(340 25% 98%);
|
||||||
|
--sidebar-foreground: hsl(240 5.3% 26.1%);
|
||||||
|
--sidebar-primary: hsl(240 5.9% 10%);
|
||||||
|
--sidebar-primary-foreground: hsl(0 0% 98%);
|
||||||
|
--sidebar-accent: hsl(340 20% 95%);
|
||||||
|
--sidebar-accent-foreground: hsl(240 5.9% 10%);
|
||||||
|
--sidebar-border: hsl(340 20% 90%);
|
||||||
|
--sidebar-ring: hsl(217.2 91.2% 59.8%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark {
|
||||||
--background: hsl(315 21% 8%);
|
--background: hsl(315 21% 8%);
|
||||||
--foreground: hsl(0 0% 98%);
|
--foreground: hsl(0 0% 98%);
|
||||||
--card: hsl(315 21% 8%);
|
--card: hsl(315 21% 8%);
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
import type { Metadata } from "next";
|
import type { Metadata } from "next";
|
||||||
import "./globals.css";
|
import "./globals.css";
|
||||||
|
import "./scrollbar.css";
|
||||||
|
|
||||||
export const metadata: Metadata = {
|
export const metadata: Metadata = {
|
||||||
title: "남현석 | :two_hearts: imnya.ng",
|
title: "남현석 | :two_hearts: imnya.ng",
|
||||||
|
|
|
||||||
|
|
@ -8,11 +8,12 @@ export default function Home() {
|
||||||
<Top />
|
<Top />
|
||||||
<section id="terminal" className="h-screen">
|
<section id="terminal" className="h-screen">
|
||||||
<NeoFetch />
|
<NeoFetch />
|
||||||
<div className="px-12">
|
<div className="px-12 mt-8">
|
||||||
<h1 className="text-2xl font-bold mb-4 w-full">💕 About</h1>
|
<h1 className="text-2xl font-bold mb-4 w-full">💕 About</h1>
|
||||||
<p>초등학교 시절 운영체제에 흥미를 느껴 컴퓨터를 시작했고, 이후 프로그래밍에 관심을 갖게 되었습니다.</p>
|
<p>오직 <strong>호기심과 실행력</strong>으로만 성장해 온 <strong>개발자, 정보보안전문가</strong> 남현석입니다.</p>
|
||||||
<p>초등학교 4학년 때 Python으로 프로그래밍을 시작했으며, 현재는 TypeScript를 주로 사용합니다.</p>
|
<p><strong>초등학교 시절 운영체제</strong>에 흥미를 느껴 컴퓨터를 시작했고, 이후 프로그래밍에 관심을 갖게 되었습니다.</p>
|
||||||
<p>최근에는 정보보안 분야 중 웹 해킹에 관심이 많습니다.</p>
|
<p><strong>초등학교 4학년 때 Python</strong>으로 프로그래밍을 시작했으며, 현재는 <strong>TypeScript</strong>를 주로 사용합니다.</p>
|
||||||
|
<p>최근에는 정보보안 분야 중 <strong>웹 해킹</strong>에 관심이 많습니다.</p>
|
||||||
<br />
|
<br />
|
||||||
<p>대표적인 프로젝트들은 아래와 같습니다.</p>
|
<p>대표적인 프로젝트들은 아래와 같습니다.</p>
|
||||||
<a href="https://www.youtube.com/playlist?list=PLZeYZotn5_IOJDek6e35NKzUtJm09yxZD">Effect Playing Contest 2025 Broadcast Develop</a><br />
|
<a href="https://www.youtube.com/playlist?list=PLZeYZotn5_IOJDek6e35NKzUtJm09yxZD">Effect Playing Contest 2025 Broadcast Develop</a><br />
|
||||||
|
|
|
||||||
26
src/app/scrollbar.css
Normal file
26
src/app/scrollbar.css
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
/* from reset */
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background: 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background: var(--muted-foreground);
|
||||||
|
border: 5px solid var(--background);
|
||||||
|
border-radius: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-thumb:hover {
|
||||||
|
background: var(--foreground);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ::-webkit-scrollbar:not(.highlighttable, .highlight table, .gist .highlight) {
|
||||||
|
background: var(--theme);
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
/* reset */
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 19px;
|
||||||
|
height: 11px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* from PaperMod https://github.com/adityatelange/hugo-PaperMod/blob/c98a924842fc7ee0c14212c316c69ede3ad76ca3/assets/css/includes/scroll-bar.css */
|
||||||
|
|
@ -8,19 +8,19 @@ export default function NeoFetch() {
|
||||||
const wakaTimeData = useWakaTimeData();
|
const wakaTimeData = useWakaTimeData();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div className="w-full bg-[#191017] text-[#fcf8f9] font-[Google Sans Code]">
|
||||||
<div className="flex flex-col md:flex-row">
|
<div className="flex flex-col md:flex-row">
|
||||||
<iframe
|
<iframe
|
||||||
src="https://f.imnya.ng/.art.html"
|
src="/art.html"
|
||||||
className="border-0 min-w-[430px] min-h-[430px] scale-75"
|
className="border-0 min-w-[430px] min-h-[430px] scale-75"
|
||||||
></iframe>
|
></iframe>
|
||||||
<div className="px-12 md:py-12 text-lg font-mono">
|
<div className="px-12 md:py-12 text-lg">
|
||||||
<a href="mailto:contact@imnya.ng" className="text-[#FFD7D7]">
|
<a href="mailto:contact@imnya.ng" className="text-[#FFD7D7]">
|
||||||
imnyang<span className="text-foreground">@</span>adofai.gg
|
imnyang<span className="text-[#fcf8f9]">@</span><a href="https://adofai.gg">adofai.gg</a>
|
||||||
</a>
|
</a>
|
||||||
<p>----------</p>
|
<p>----------</p>
|
||||||
|
|
||||||
<p className="text-foreground">
|
<p>
|
||||||
<span className="text-[#FFD7D7]">Uptime</span>:{" "}
|
<span className="text-[#FFD7D7]">Uptime</span>:{" "}
|
||||||
{(() => {
|
{(() => {
|
||||||
const startDate = new Date("2010-11-08T00:00:00+09:00");
|
const startDate = new Date("2010-11-08T00:00:00+09:00");
|
||||||
|
|
@ -39,12 +39,12 @@ export default function NeoFetch() {
|
||||||
})()}
|
})()}
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p className="text-foreground">
|
<p>
|
||||||
<span className="text-[#FFD7D7]">Experience</span>:{" "}
|
<span className="text-[#FFD7D7]">Experience</span>:{" "}
|
||||||
{Object.values(events).flat().length}
|
{Object.values(events).flat().length}
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p className="text-foreground">
|
<p>
|
||||||
<span className="text-[#FFD7D7]">WakaTime</span>:{" "}
|
<span className="text-[#FFD7D7]">WakaTime</span>:{" "}
|
||||||
{wakaTimeData?.data?.total_seconds_including_other_language
|
{wakaTimeData?.data?.total_seconds_including_other_language
|
||||||
? (() => {
|
? (() => {
|
||||||
|
|
@ -59,7 +59,7 @@ export default function NeoFetch() {
|
||||||
: "N/A"}
|
: "N/A"}
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p className="text-foreground">
|
<p>
|
||||||
<span className="text-[#FFD7D7]">Most used Language</span>:{" "}
|
<span className="text-[#FFD7D7]">Most used Language</span>:{" "}
|
||||||
{wakaTimeData?.data?.languages[0]?.name || "N/A"}{" "}
|
{wakaTimeData?.data?.languages[0]?.name || "N/A"}{" "}
|
||||||
{wakaTimeData?.data?.languages[0]?.total_seconds
|
{wakaTimeData?.data?.languages[0]?.total_seconds
|
||||||
|
|
@ -79,29 +79,29 @@ export default function NeoFetch() {
|
||||||
<span className="text-[#FFD7D7]">Terminal</span>: {ipData}
|
<span className="text-[#FFD7D7]">Terminal</span>: {ipData}
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p className="text-foreground">
|
<p>
|
||||||
<span className="text-[#FFD7D7]">Locale</span>: ko_KR.UTF-8
|
<span className="text-[#FFD7D7]">Locale</span>: ko_KR.UTF-8
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<br />
|
<br />
|
||||||
<div id="color" className="grid grid-cols-8 w-fit">
|
<div id="color" className="grid grid-cols-8 w-fit">
|
||||||
<p className="bg-background w-8">⠀⠀</p>
|
<div className="bg-[#191017] min-w-8"> </div>
|
||||||
<p className="bg-[#f38ba8] w-8">⠀⠀</p>
|
<div className="bg-[#f38ba8] min-w-8"></div>
|
||||||
<p className="bg-[#a6e3a1] w-8">⠀⠀</p>
|
<div className="bg-[#a6e3a1] min-w-8"></div>
|
||||||
<p className="bg-[#f9e2af] w-8">⠀⠀</p>
|
<div className="bg-[#f9e2af] min-w-8"></div>
|
||||||
<p className="bg-[#89b4fa] w-8">⠀⠀</p>
|
<div className="bg-[#89b4fa] min-w-8"></div>
|
||||||
<p className="bg-[#f5c2e7] w-8">⠀⠀</p>
|
<div className="bg-[#f5c2e7] min-w-8"></div>
|
||||||
<p className="bg-[#94e2d5] w-8">⠀⠀</p>
|
<div className="bg-[#94e2d5] min-w-8"></div>
|
||||||
<p className="bg-muted-foreground w-8">⠀⠀</p>
|
<div className="bg-muted-foreground min-w-8"></div>
|
||||||
|
|
||||||
<p className="bg-[#45475a] w-8">⠀⠀</p>
|
<div className="bg-[#45475a] min-w-8"> </div>
|
||||||
<p className="bg-[#f0c0cd] w-8">⠀⠀</p>
|
<div className="bg-[#f0c0cd] min-w-8"></div>
|
||||||
<p className="bg-[#c3e9bf] w-8">⠀⠀</p>
|
<div className="bg-[#c3e9bf] min-w-8"></div>
|
||||||
<p className="bg-[#f0e0bf] w-8">⠀⠀</p>
|
<div className="bg-[#f0e0bf] min-w-8"></div>
|
||||||
<p className="bg-[#c3d9fd] w-8">⠀⠀</p>
|
<div className="bg-[#c3d9fd] min-w-8"></div>
|
||||||
<p className="bg-[#f8d2ee] w-8">⠀⠀</p>
|
<div className="bg-[#f8d2ee] min-w-8"></div>
|
||||||
<p className="bg-[#b1faee] w-8">⠀⠀</p>
|
<div className="bg-[#b1faee] min-w-8"></div>
|
||||||
<p className="bg-foreground w-8">⠀⠀</p>
|
<div className="bg-[#fcf8f9] min-w-8"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -62,10 +62,10 @@ export default function Top() {
|
||||||
<section
|
<section
|
||||||
id="top"
|
id="top"
|
||||||
className="snap-start h-screen w-full relative"
|
className="snap-start h-screen w-full relative"
|
||||||
onWheel={(e) => {
|
// onWheel={(e) => {
|
||||||
e.preventDefault();
|
// e.preventDefault();
|
||||||
window.scrollBy(0, window.innerHeight * (e.deltaY > 0 ? 1 : -1));
|
// window.scrollBy(0, window.innerHeight * (e.deltaY > 0 ? 1 : -1));
|
||||||
}}
|
// }}
|
||||||
>
|
>
|
||||||
<Sidebar />
|
<Sidebar />
|
||||||
<div
|
<div
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue