From a86180f92a29bdf4579d102bfa4f51e3701dc11e Mon Sep 17 00:00:00 2001 From: Tressley Cahill Date: Sat, 22 Oct 2022 09:28:58 -0400 Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit (ﾉ☉ヮ⚆)ﾉ ⌒*:･ﾟ✧ --- css/animations.css | 57 +++++++++++++ css/main.css | 10 +++ css/reset.css | 23 +++++ css/styles.css | 205 +++++++++++++++++++++++++++++++++++++++++++++ css/vars.css | 51 +++++++++++ favicon-16x16.png | Bin 0 -> 1304 bytes favicon-32x32.png | Bin 0 -> 2250 bytes favicon.ico | Bin 0 -> 15086 bytes index.html | 115 +++++++++++++++++++++++++ js/main.js | 11 +++ 10 files changed, 472 insertions(+) create mode 100644 css/animations.css create mode 100644 css/main.css create mode 100644 css/reset.css create mode 100644 css/styles.css create mode 100644 css/vars.css create mode 100644 favicon-16x16.png create mode 100644 favicon-32x32.png create mode 100644 favicon.ico create mode 100644 index.html create mode 100644 js/main.js diff --git a/css/animations.css b/css/animations.css new file mode 100644 index 0000000..5d31228 --- /dev/null +++ b/css/animations.css @@ -0,0 +1,57 @@ +@-webkit-keyframes fade { + from { opacity: 0; } + to { opacity: 1; } +} + + @keyframes fade { + from { opacity: 0; } + to { opacity: 1; } + } + +@-webkit-keyframes flicker { + 0% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(75%); filter: grayscale(75%); } + 10% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } + 20% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(75%); filter: grayscale(75%); } + 30% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(75%); filter: grayscale(75%); } + 40% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } + 50% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(75%); filter: grayscale(75%); } + 60% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(75%); filter: grayscale(75%); } + 70% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } + 80% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(75%); filter: grayscale(75%); } + 90% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } + 100% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } +} + + @keyframes flicker { + 0% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(25%); filter: grayscale(25%); } + 10% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } + 20% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(25%); filter: grayscale(25%); } + 30% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(25%); filter: grayscale(25%); } + 40% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } + 50% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(25%); filter: grayscale(25%); } + 60% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(25%); filter: grayscale(25%); } + 70% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } + 80% { -webkit-filter: contrast(175%); filter: contrast(175%); -webkit-filter: grayscale(25%); filter: grayscale(25%); } + 90% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } + 100% { -webkit-filter: contrast(100%); filter: contrast(100%); -webkit-filter: grayscale(0%); filter: grayscale(0%); } + } + +@-webkit-keyframes slime { + 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } + 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } + 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } + 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } + 65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } + 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } + 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } +} + + @keyframes slime { + 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } + 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } + 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } + 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } + 65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } + 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } + 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } + } diff --git a/css/main.css b/css/main.css new file mode 100644 index 0000000..8bae4e6 --- /dev/null +++ b/css/main.css @@ -0,0 +1,10 @@ +/* Josh Comeau's Custom CSS Reset - https://www.joshwcomeau.com/css/custom-css-reset/ */ +@import url('reset.css'); +/* Google Fonts */ +@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@400;700&display=swap'); +/* Variables */ +@import url('vars.css'); +/* Animations */ +@import url('animations.css'); +/* Main Styles */ +@import url('styles.css'); \ No newline at end of file diff --git a/css/reset.css b/css/reset.css new file mode 100644 index 0000000..680f32e --- /dev/null +++ b/css/reset.css @@ -0,0 +1,23 @@ +*, *::before, *::after { box-sizing: border-box; } + +* { margin: 0; } + +html, body { height: 100%; } + +body { + line-height: 1.5; + -webkit-font-smoothing: antialiased; +} + +img, picture, video, canvas, svg { + display: block; + max-width: 100%; +} + +input, button, textarea, select { font: inherit; } + +p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; } + +#root, #__next { isolation: isolate; } + +[hidden] { display: none; } \ No newline at end of file diff --git a/css/styles.css b/css/styles.css new file mode 100644 index 0000000..1751c72 --- /dev/null +++ b/css/styles.css @@ -0,0 +1,205 @@ +body { + background-color: var(--primary-background-color); + color: var(--primary-font-color); + font-family: var(--font-monospace); + font-size: var(--font-size-body); +} + +main { + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-animation: fade 0.75s ease-in; + animation: fade 0.75s ease-in; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-direction: normal; + -webkit-box-orient: vertical; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + min-height: 100vh; + padding: var(--space-l); + row-gap: var(--space-l); +} + +header { + -webkit-animation: flicker 2s linear infinite both; + animation: flicker 2s linear infinite both; +} + +header svg { width: 8rem; } + +#dock { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-direction: normal; + -webkit-box-orient: horizontal; + -ms-flex-direction: row; + flex-direction: row; + -ms-flex-pack: distribute; + justify-content: space-around; + list-style-type: none; + min-width: 40rem; + padding: 0; +} + +#dock li a { + display: block; + fill: var(--primary-link-color); + min-width: 1.5rem; + -webkit-transition: fill 0.25s ease-in-out, margin-top 0.125s cubic-bezier(0.455, 0.030, 0.515, 0.955); + -o-transition: fill 0.25s ease-in-out, margin-top 0.125s cubic-bezier(0.455, 0.030, 0.515, 0.955); + transition: fill 0.25s ease-in-out, margin-top 0.125s cubic-bezier(0.455, 0.030, 0.515, 0.955); +} + +#dock a:focus, +#dock a:hover { + -webkit-animation: slime 0.75s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; + animation: slime 0.75s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; + fill: var(--primary-link-hover-color); + margin-top: -0.25rem; + outline: none; +} + +#dock li:nth-child(1) a:focus, +#dock li:nth-child(1) a:hover { fill: hsl(5, 81%, 56%); } /* Gmail */ +#dock li:nth-child(2) a:focus, +#dock li:nth-child(2) a:hover { fill: hsl(217, 89%, 61%); } /* Google Calendar */ +#dock li:nth-child(3) a:focus, +#dock li:nth-child(3) a:hover { fill: hsl(44, 100%, 50%); } /* Google Keep */ +#dock li:nth-child(4) a:focus, +#dock li:nth-child(4) a:hover { fill: var(--primary-link-hover-color); } /* Notion */ +#dock li:nth-child(5) a:focus, +#dock li:nth-child(5) a:hover { fill: hsl(102, 53%, 52%); } /* Github */ +#dock li:nth-child(6) a:focus, +#dock li:nth-child(6) a:hover { fill: hsl(14, 89%, 53%); } /* Figma */ + +#search { + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-direction: normal; + -webkit-box-orient: vertical; + -ms-flex-direction: column; + flex-direction: column; +} + +#search input { + background-color: var(--primary-background-color); + background-position: right 1.25rem center; + background-repeat: no-repeat; + background-size: 1.5rem 1.5rem; + border-radius: 0.5rem; + color: var(--primary-font-color); + font-family: var(--font-sans-serif); + line-height: 1.5; + outline: 0.25rem solid transparent; + padding: var(--space-m); + width: 40rem; +} + +@media (prefers-color-scheme: dark) { + #search input { + background-image: var(--svg-search-gray); + border: 0.125rem solid hsl(var(--color-white-hsl) / 0.25); + } + + #search input:hover { border-color: hsl(var(--color-white-hsl) / 0.5); } + + #search input:focus { + background-color: hsl(var(--color-white-hsl) / 0.05); + background-image: var(--svg-search-light-gray); + outline-color: var(--color-orange); + } +} + +@media (prefers-color-scheme: light) { + #search input { + background-image: var(--svg-search-light-gray); + border: 0.125rem solid hsl(var(--color-black-hsl) / 0.25); + } + + #search input:hover { border-color: hsl(var(--color-black-hsl) / 0.5); } + + #search input:focus { + background-color: var(--color-white); + background-image: var(--svg-search-gray); + outline-color: var(--color-orange); + } +} + +#search input:active, +#search input:focus { border-color: transparent; } + +#search input::-webkit-input-placeholder { text-align: center; } +#search input::-moz-placeholder { text-align: center; } +#search input:-ms-input-placeholder { text-align: center; } +#search input::-ms-input-placeholder { text-align: center; } +#search input::placeholder { text-align: center; } + +#bookmarks { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-direction: normal; + -webkit-box-orient: horizontal; + -ms-flex-direction: row; + flex-direction: row; + -ms-flex-pack: distribute; + justify-content: space-around; + width: 40rem; +} + +#bookmarks ul { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + list-style: none; + margin: 0; + padding: 0; +} + +#bookmarks li { + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + line-height: 1; + margin-bottom: var(--space-m); +} + +#bookmarks li:last-child { margin-bottom: 0; } + +#bookmarks li .favicon { + width: 1rem; + margin-right: var(--space-s); +} + +#bookmarks a { + color: var(--primary-link-color); + text-decoration: none; + -webkit-transition: color 0.25s ease-in-out; + -o-transition: color 0.25s ease-in-out; + transition: color 0.25s ease-in-out; +} + +#bookmarks a:focus, +#bookmarks a:hover { color: var(--primary-link-hover-color); } diff --git a/css/vars.css b/css/vars.css new file mode 100644 index 0000000..616049f --- /dev/null +++ b/css/vars.css @@ -0,0 +1,51 @@ +:root { + /* HSL(a) for better control over colors + https://css-tricks.com/hsl-hsla-is-great-for-programmatic-color-control/ + https://css-tricks.com/color-alpha-anywhere/ + */ + --color-black-hsl: 0 0% 11%; /* #1C1C1C */ + --color-black: hsl(var(--color-black-hsl)); + --color-orange-hsl: 30 100% 50%; /* #FD7E00 */ + --color-orange: hsl(var(--color-orange-hsl)); + --color-white-hsl: 0 0% 95%; /* #F1F1F1 */ + --color-white: hsl(var(--color-white-hsl)); + + /* Font-families */ + --font-monospace: "Inconsolata", ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace; + --font-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; + + /* Font-sizing */ + --font-size-body: 1rem; /* 16px */ + + /* Spacing */ + --space-xs: 0.25rem; /* 4px */ + --space-s: 0.5rem; /* 8px */ + --space-m: 1rem; + --space-l: 2rem; /* 32px */ + --space-xl: 4rem; /* 64px */ + + /* SVGs */ + --svg-search-gray: url('data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzUyNTI1MiIgZD0iTTMyLDI5LjU4bC05LjQ3LTkuNDdjMS42LTIuMTEsMi41Ni00LjcyLDIuNTYtNy41NkMyNS4wOSw1LjYzLDE5LjQ2LDAsMTIuNTQsMFMwLDUuNjMsMCwxMi41NHM1LjYzLDEyLjU0LDEyLjU0LDEyLjU0YzIuODQsMCw1LjQ2LS45Niw3LjU2LTIuNTZsOS40Nyw5LjQ3LDIuNDItMi40MlpNMy40MiwxMi41NEMzLjQyLDcuNTEsNy41MSwzLjQyLDEyLjU0LDMuNDJzOS4xMiw0LjA4LDkuMTIsOS4xMi00LjA4LDkuMTItOS4xMiw5LjEyUzMuNDIsMTcuNTgsMy40MiwxMi41NFoiLz48L3N2Zz4='); + --svg-search-light-gray: url('data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzg3ODc4NyIgZD0iTTMyLDI5LjU4bC05LjQ3LTkuNDdjMS42LTIuMTEsMi41Ni00LjcyLDIuNTYtNy41NkMyNS4wOSw1LjYzLDE5LjQ2LDAsMTIuNTQsMFMwLDUuNjMsMCwxMi41NHM1LjYzLDEyLjU0LDEyLjU0LDEyLjU0YzIuODQsMCw1LjQ2LS45Niw3LjU2LTIuNTZsOS40Nyw5LjQ3LDIuNDItMi40MlpNMy40MiwxMi41NEMzLjQyLDcuNTEsNy41MSwzLjQyLDEyLjU0LDMuNDJzOS4xMiw0LjA4LDkuMTIsOS4xMi00LjA4LDkuMTItOS4xMiw5LjEyUzMuNDIsMTcuNTgsMy40MiwxMi41NFoiLz48L3N2Zz4='); + --svg-search-orange: url('data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iI0ZEN0UwMCIgZD0iTTMyLDI5LjU4bC05LjQ3LTkuNDdjMS42LTIuMTEsMi41Ni00LjcyLDIuNTYtNy41NkMyNS4wOSw1LjYzLDE5LjQ2LDAsMTIuNTQsMFMwLDUuNjMsMCwxMi41NHM1LjYzLDEyLjU0LDEyLjU0LDEyLjU0YzIuODQsMCw1LjQ2LS45Niw3LjU2LTIuNTZsOS40Nyw5LjQ3LDIuNDItMi40MlpNMy40MiwxMi41NEMzLjQyLDcuNTEsNy41MSwzLjQyLDEyLjU0LDMuNDJzOS4xMiw0LjA4LDkuMTIsOS4xMi00LjA4LDkuMTItOS4xMiw5LjEyUzMuNDIsMTcuNTgsMy40MiwxMi41NFoiLz48L3N2Zz4='); +} + +/* Dark Mode */ +@media (prefers-color-scheme: dark) { + :root { + --primary-background-color: var(--color-black); + --primary-font-color: var(--color-white); + --primary-link-color: hsl(var(--color-white-hsl) / 0.5); + --primary-link-hover-color: var(--color-white); + } +} + +/* Light Mode */ +@media (prefers-color-scheme: light) { + :root { + --primary-background-color: var(--color-white); + --primary-font-color: hsl(var(--color-black-hsl) / 0.75); + --primary-link-color: hsl(var(--color-black-hsl) / 0.75); + --primary-link-hover-color: var(--color-orange); + } +} diff --git a/favicon-16x16.png b/favicon-16x16.png new file mode 100644 index 0000000000000000000000000000000000000000..41d04f6c2c0658e7ca4d81b4d963b93f5c8f52c5 GIT binary patch literal 1304 zcmZ`%drZ?;6h6Pc=>w=OEu|noL7__pOA81U1Zrz3wLnV&D^8G7Y5~iuD5ans>ToU$ zrx=X_F3WJvL_~-ibE2YbA%b&@OD2I4C-be#bOaPocRR_l{jo2(=iGC0&i%e~azDsS zSF`8=bO2y!Qk4eeeLaUpL{=2xlZ70~nxabqINQRQ-%Lg^Zca7m0P4a3+`9p0QOf-Q zphg1lr~p8I1b|=Bc3z(VKoDoHGpbMl29W57aj9Tc0|5gXfN784n=uNUGL3A`B; zU{X+_2L?Hq6o3mLA?j^n!CJL&rWro2g7;Vh7`F}g>r2P6!9$v{M801-=| zYafV$AfAI2hY%1up9X9)L@$Cu39Jpo&>g{^1vMr(TmklVP$wc}2Vo2nMkiqmBIt$K z?p#>P2P%L#2v*>b5f8;mIHB|D)X+=937wf(TAb&Rq!7XvwV;gj+~2}3rN;6+I!aY! zDSIKA6GQ3Cx4=;mEq!S6>wn6tE=vappE+x96y@o!5(|Y!lGkC56pQ{h>%1#3qv^+vJaa=w47%IAjy&c!TNw{g*EKJ&4i_oSTv zu!Q|h8tK~cvawU!hf2g3vVHpV{V!%QejEF$bBErZ$ZdBe?M!4{@5p%b=8bK_RfNRt za~RS+U+*9IgkXe&ecCNFB856JJ$YY|@ZN=8Oje3E$;&a*K00$gTGli5hcn>H>sOQ0 zFU}c_!y{UHOl8yb>)F}YpWz+TdoTv7fiPgC)x3}!bSh0Ue zeSOIUCoKJFg5^}pnd3>f#@&}~H$T5|Bwn1V;}&LD3_XdjzJER6H{iPfZyx)@y&Lw>sYd$I3Y0j$FmgdC;U-^0C)1db82B;CD|?*BAwEibYa zJO967;P<^u)R0?eT<x|T6KqPc4T zVkjfh%;1D_vlToH2!QGiC3 KuIy42H2wueRehBJ literal 0 HcmV?d00001 diff --git a/favicon-32x32.png b/favicon-32x32.png new file mode 100644 index 0000000000000000000000000000000000000000..e579f6443c8afbdf10ef709a18867e8a31f4370e GIT binary patch literal 2250 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 WN2uSe4DTLR0FJgUHczbx@&5(J8~b7a literal 0 HcmV?d00001 diff --git a/favicon.ico b/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..64fa12794a29b97b983b6ef0828440bcea49bd3b GIT binary patch literal 15086 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 + + + + + + + + + + + _traichu + + +
+
+ _traichuMade with Pixels to Svg https://codepen.io/shshaw/pen/XbxvNj +
+ + + +
+ + diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..2e7ec64 --- /dev/null +++ b/js/main.js @@ -0,0 +1,11 @@ +function dateTime () { + const date = new Date() + let today = date.toDateString() + let time = date.toLocaleTimeString() + document.getElementsByName('q')[0].placeholder = today + ' ' + time + setTimeout(dateTime, 1000) +} + +function traichu () { + dateTime() +}