diff --git a/package-lock.json b/package-lock.json index 92dd4f7..c6670e0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,6 +12,8 @@ "@types/react": "18.2.17", "@types/react-dom": "18.2.7", "autoprefixer": "10.4.14", + "bootstrap": "^5.3.1", + "bootstrap-icons": "^1.10.5", "eslint": "8.46.0", "eslint-config-next": "13.4.12", "next": "13.4.12", @@ -381,6 +383,16 @@ "url": "https://opencollective.com/unts" } }, + "node_modules/@popperjs/core": { + "version": "2.11.8", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", + "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", + "peer": true, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, "node_modules/@rushstack/eslint-patch": { "version": "1.3.2", "resolved": "https://registry.npmjs.org/@rushstack/eslint-patch/-/eslint-patch-1.3.2.tgz", @@ -825,6 +837,39 @@ "node": ">=8" } }, + "node_modules/bootstrap": { + "version": "5.3.1", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.1.tgz", + "integrity": "sha512-jzwza3Yagduci2x0rr9MeFSORjcHpt0lRZukZPZQJT1Dth5qzV7XcgGqYzi39KGAVYR8QEDVoO0ubFKOxzMG+g==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/twbs" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/bootstrap" + } + ], + "peerDependencies": { + "@popperjs/core": "^2.11.8" + } + }, + "node_modules/bootstrap-icons": { + "version": "1.10.5", + "resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.10.5.tgz", + "integrity": "sha512-oSX26F37V7QV7NCE53PPEL45d7EGXmBgHG3pDpZvcRaKVzWMqIRL9wcqJUyEha1esFtM3NJzvmxFXDxjJYD0jQ==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/twbs" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/bootstrap" + } + ] + }, "node_modules/bplist-parser": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/bplist-parser/-/bplist-parser-0.2.0.tgz", diff --git a/package.json b/package.json index 0d4d07a..26128dc 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,8 @@ "@types/react": "18.2.17", "@types/react-dom": "18.2.7", "autoprefixer": "10.4.14", + "bootstrap": "^5.3.1", + "bootstrap-icons": "^1.10.5", "eslint": "8.46.0", "eslint-config-next": "13.4.12", "next": "13.4.12", diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 021681f..b41ee27 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -1,4 +1,5 @@ import '@/styles/globals.css' +import 'bootstrap-icons/font/bootstrap-icons.css' import type { AppProps } from 'next/app' export default function App({ Component, pageProps }: AppProps) { diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx index 54e8bf3..a0ee25e 100644 --- a/src/pages/_document.tsx +++ b/src/pages/_document.tsx @@ -4,7 +4,7 @@ export default function Document() { return ( - +
diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 57e2a8c..8f1d5f7 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,118 +1,34 @@ -import Image from 'next/image' -import { Inter } from 'next/font/google' - -const inter = Inter({ subsets: ['latin'] }) +import 'bootstrap/dist/css/bootstrap.css' export default function Home() { - return ( -
-
-

- Get started by editing  - src/pages/index.tsx -

-
- - By{' '} - Vercel Logo - -
-
+ return ( +
+
+

My stuff

+
+
+ +
+ +
+ +
+

Github

+
+

+ My main public git repositories with notable repos: +

    +
  • ansible - playbook for my homelab
    • +
  • Prusa-Firmware - slightly modified firmware for my 3d printer
    • +
  • dwm - my customized version of dwm
    • +
+

-
- Next.js Logo -
+
+
+
-
- -

- Docs{' '} - - -> - -

-

- Find in-depth information about Next.js features and API. -

- - - -

- Learn{' '} - - -> - -

-

- Learn about Next.js in an interactive course with quizzes! -

- - - -

- Templates{' '} - - -> - -

-

- Discover and deploy boilerplate example Next.js projects. -

- - - -

- Deploy{' '} - - -> - -

-

- Instantly deploy your Next.js site to a shareable URL with Vercel. -

- -
-
- ) +
+ ) } diff --git a/src/styles/globals.css b/src/styles/globals.css index fd81e88..507fc7a 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -2,26 +2,34 @@ @tailwind components; @tailwind utilities; -:root { - --foreground-rgb: 0, 0, 0; - --background-start-rgb: 214, 219, 220; - --background-end-rgb: 255, 255, 255; +.bi { + vertical-align: -.125em; + fill: currentColor; } -@media (prefers-color-scheme: dark) { - :root { - --foreground-rgb: 255, 255, 255; - --background-start-rgb: 0, 0, 0; - --background-end-rgb: 0, 0, 0; - } +.feature-icon { + width: 4rem; + height: 4rem; + border-radius: .75rem; } -body { - color: rgb(var(--foreground-rgb)); - background: linear-gradient( - to bottom, - transparent, - rgb(var(--background-end-rgb)) - ) - rgb(var(--background-start-rgb)); +.icon-square { + width: 3rem; + height: 3rem; + border-radius: .75rem; +} + +.text-shadow-1 { text-shadow: 0 .125rem .25rem rgba(0, 0, 0, .25); } +.text-shadow-2 { text-shadow: 0 .25rem .5rem rgba(0, 0, 0, .25); } +.text-shadow-3 { text-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .25); } + +.card-cover { + background-repeat: no-repeat; + background-position: center center; + background-size: cover; +} + +.feature-icon-small { + width: 3rem; + height: 3rem; }