-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
modularize skills, etc. section into component
- Loading branch information
Showing
10 changed files
with
188 additions
and
85 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| /* title case all headers */ | ||
| h1, h2, h3, h4, h5, h6 { | ||
| text-transform: capitalize; | ||
| /* small caps */ | ||
| font-variant: small-caps; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,39 +1,99 @@ | ||
| <template> | ||
| <teleport to="body" :disabled="teleport" ref="teleportRef"> | ||
| <footer v-bind="$attrs" class="footer has-text-centered has-background-inherit"> | ||
| <footer v-bind="$attrs" | ||
| class="footer flex is-flex-direction-column justify-content-center has-text-centered has-background-inherit"> | ||
| <img src="https://raw.githubusercontent.com/catppuccin/catppuccin/18acd8f58d49b551eb8cc0ff035a006d605c9905/assets/footers/ext_black_monochromatic.svg" | ||
| alt="logo" :width="width" decoding="auto" loading="lazy" /> | ||
| <small class="font-italic">insert obligatory mort quote here</small> | ||
| alt="logo" :width="width" decoding="auto" loading="lazy" /> | ||
| <small class="font-italic" title="get it cuz... heh heh, it's the footer😆 .. oh nvm">insert obligatory | ||
| mort quote here</small> | ||
|
|
||
| <section class="section"> | ||
| <h2 class="subtitle is-7">Acknowledgements</h2> | ||
| <ul> | ||
| <li>Icons from <a href="https://feathericons.com/">feathericons.com</a></li> | ||
| <li><a href="https://bulma.io">Bulma</a></li> | ||
| <li><a href="https://vuejs.org">Vue</a></li> | ||
| <li><a href="https://catppuccin.com">Catppuccin</a></li> | ||
| <h2 class="subtitle is-7">Acknowledgements, Thx, Credits</h2> | ||
| <ul class="is-flex is-flex-direction-row is-gap-3 is-justify-content-space-around"> | ||
| <li title="bulma"><a href="https://bulma.io"><img | ||
| :src="`https://bulma.io/assets/brand/Bulma%20Logo${colour && '%20'.concat(colour)}.svg`" | ||
| alt="bulma logo" loading="lazy"> | ||
| </a> | ||
| </li> | ||
| <li title="vue"><a href="https://vuejs.org"> | ||
| <img srcset="https://github.com/vuejs/art/blob/master/vue-badge-outlined.svg?raw=true, https://vuejs.org/images/logo.png" width="100" alt="vue logo" loading="lazy" /> | ||
| </a></li> | ||
| <li title="catppuccin"><a href="https://catppuccin.com"> | ||
| <img srcset="https://github.com/catppuccin/catppuccin/blob/main/assets/logos/exports/1544x1544_circle.png?raw=true" width="100" alt="catppuccin logo" loading="lazy" /> | ||
| </a></li> | ||
| </ul> | ||
| </section> | ||
|
|
||
| <!-- <figure class="image is-16by9"> | ||
| <img class="is-rounded" :src="mort" alt="mort" loading="eager" /> | ||
| </figure> --> | ||
|
|
||
| </footer> | ||
| </teleport> | ||
| </template> | ||
|
|
||
| <style scoped> | ||
| /*place footer at the bottom always*/ | ||
| footer { | ||
| margin-top: auto; | ||
| } | ||
| /*place footer at the bottom always*/ | ||
| /* footer::before { | ||
| content: ""; | ||
| display: flex; | ||
| position: absolute; | ||
| width: 100%; | ||
| min-height: 55%; | ||
| max-height: max-content; | ||
| align-self: auto; | ||
| height: 100%; | ||
| flex-grow: 1; | ||
| left: 0; | ||
| opacity: 0.25; | ||
| background-image: v-bind("mort"); | ||
| background-repeat: no-repeat; | ||
| background-size: cover; | ||
| background-position: center; | ||
| background-clip: border-box; | ||
| } */ | ||
| figure { | ||
| width: 12em | ||
| } | ||
| </style> | ||
|
|
||
| <script setup lang="ts"> | ||
| import { PuccinTheme } from "@/types/helper"; | ||
| import { useColorMode } from "@vueuse/core"; | ||
| import consola from "consola"; | ||
| import {ref, type Teleport, type TeleportProps, watch} from "vue"; | ||
| import { computed, ref, type Teleport, type TeleportProps, watch } from "vue"; | ||
| // const teleportRef = ref<InstanceType<typeof Teleport> | null>(null); | ||
| const teleport = ref(true); | ||
| watch([], () => { | ||
| // teleport.value = true | ||
| }); | ||
| const colour = computed(() => { | ||
| const theme = useColorMode({ modes: PuccinTheme }).value | ||
| switch (theme) { | ||
| case PuccinTheme.latte: | ||
| case 'light': | ||
| return 'Black'; | ||
| case PuccinTheme.mocha: | ||
| case 'dark': | ||
| return 'White'; | ||
| default: | ||
| return null; | ||
| } | ||
| }); | ||
| const width = ref(window.innerWidth) | ||
| const mort = computed(() => 'url(' + | ||
| [ | ||
| // 'https://static.wikia.nocookie.net/penguinsofmadagascar/images/f/f8/Ahkjmort.png/revision/latest?cb=20190727144938', | ||
| 'https://64.media.tumblr.com/dbcf458d4e48c956fa405194144a40b8/tumblr_omtcvafd8g1qmzwx0o1_640.gif', | ||
| 'https://media.giphy.com/media/l2RnsEqcQ0Cveecfu/giphy.gif' | ||
| ].sort(() => Math.random() - 0.5).pop() + ')' | ||
| ); | ||
| </script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| import type { DeviconProps } from "./devIcon" | ||
|
|
||
| export type IconListSectionProps = { | ||
| icons: string[] | ||
| iconStyle: Omit<DeviconProps, "icon"> | ||
| title: string | ||
| blurb?: string | undefined | ||
| description?: string | undefined | ||
| } |
Oops, something went wrong.