diff options
| author | Alex Pooley (@zuedev) <zuedev@gmail.com> | 2026-03-03 10:42:03 +0000 |
|---|---|---|
| committer | Alex Pooley (@zuedev) <zuedev@gmail.com> | 2026-03-03 10:42:03 +0000 |
| commit | e0d7abe0346a6e4f22741f1a54a0c766cd20075a (patch) | |
| tree | 7a5ab9dd0732cf4c67e9b8e8f1e8dd75acd77394 /public/bbg | |
| parent | 9e1286ea46c31b87a18332927876f7159bfcfb37 (diff) | |
| download | zue.dev-e0d7abe0346a6e4f22741f1a54a0c766cd20075a.tar zue.dev-e0d7abe0346a6e4f22741f1a54a0c766cd20075a.tar.gz zue.dev-e0d7abe0346a6e4f22741f1a54a0c766cd20075a.tar.bz2 zue.dev-e0d7abe0346a6e4f22741f1a54a0c766cd20075a.tar.xz zue.dev-e0d7abe0346a6e4f22741f1a54a0c766cd20075a.zip | |
better org
Diffstat (limited to 'public/bbg')
| -rw-r--r-- | public/bbg/index.html | 76 |
1 files changed, 62 insertions, 14 deletions
diff --git a/public/bbg/index.html b/public/bbg/index.html index 0f1851a..4f13faa 100644 --- a/public/bbg/index.html +++ b/public/bbg/index.html @@ -10,42 +10,68 @@ content="Blue Bean Games is a newly-formed game studio that believes in the power of open-source software. All of our work is completely dedicated to the public domain from company literature to video games." /> <style> + /* import Itim font */ @import url("https://fonts.googleapis.com/css2?family=Itim&display=swap"); + /* import Inter font */ + @import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"); + + /* set page background and text color */ html { background-color: #006eff; color: white; } + /* hide scrollbar */ html::-webkit-scrollbar { display: none; } + /* apply Itim font */ .itim-regular { font-family: "Itim", cursive; font-weight: 400; font-style: normal; } + /* apply Inter font */ + .inter-regular { + font-family: "Inter", sans-serif; + font-weight: 400; + font-style: normal; + } + + /* remove margin and padding from body */ body { margin: 0; padding: 0; + } + + /* set body fallback font */ + body { + font-family: monospace; + } + /* center content of body using flexbox */ + body { display: flex; justify-content: center; flex-direction: column; - height: 100vh; + } - font-family: monospace; + /* make body full height */ + body { + height: 100vh; + } + /* constrain body width and center horizontally */ + body { max-width: 720px; width: 100%; margin: auto; - - opacity: 0; - animation: fadeIn 1s ease-in-out forwards; } + /* fade in animation */ @keyframes fadeIn { 0% { opacity: 0; @@ -55,18 +81,27 @@ } } + /* fade in body content */ + body { + opacity: 0; + animation: fadeIn 1s ease-in-out forwards; + } + + /* style main paragraph */ p { font-size: 2rem; text-align: justify; padding: 1rem; } + /* style footer text */ span { text-align: right; padding: 1rem; opacity: 0.5; } + /* link styles */ a { color: white; text-decoration: dotted underline; @@ -79,14 +114,27 @@ </style> </head> <body class="itim-regular"> - <p> - Blue Bean Games is a newly-formed game studio that believes in the power - of open-source software. All of our work is completely dedicated to the - public domain from company literature to video games. - </p> - <span> - "Blue Bean Games" is made with ❤️ by - <a href="https://zue.dev" target="_blank">zue.dev</a> - </span> + <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script> + <script type="text/babel" data-type="module"> + import React from "https://esm.sh/react@18"; + import ReactDOM from "https://esm.sh/react-dom@18/client"; + + ReactDOM.createRoot(document.body).render( + <> + <p> + Blue Bean Games is a newly-formed game studio that believes in the + power of open-source software. All of our work is completely + dedicated to the public domain from company literature to video + games. + </p> + <span className="inter-regular"> + "Blue Bean Games" is made with ❤️ by{" "} + <a href="https://zue.dev" target="_blank"> + zue.dev + </a> + </span> + </>, + ); + </script> </body> </html> |