From fafac3fe27a665a1f81235e728e073dc58c7300e Mon Sep 17 00:00:00 2001 From: Max Date: Sun, 2 Jul 2023 11:24:14 -0700 Subject: [PATCH] Fixed up project so it didn't look like boilerplate vomit Cleaned up bingo board view for printable pages --- src/App.vue | 67 +-------------- src/assets/base.css | 56 +----------- src/assets/logo.svg | 1 - src/assets/main.css | 4 - .../{TheWelcome.vue => BingoBoard.vue} | 26 +++--- src/components/HelloWorld.vue | 42 --------- src/components/WelcomeItem.vue | 86 ------------------- src/components/icons/IconCommunity.vue | 7 -- src/components/icons/IconDocumentation.vue | 7 -- src/components/icons/IconEcosystem.vue | 7 -- src/components/icons/IconSupport.vue | 7 -- src/components/icons/IconTooling.vue | 19 ---- src/router/index.js | 4 +- src/views/AboutView.vue | 12 +-- src/views/BingoView.vue | 9 ++ src/views/HomeView.vue | 9 -- 16 files changed, 29 insertions(+), 334 deletions(-) delete mode 100644 src/assets/logo.svg rename src/components/{TheWelcome.vue => BingoBoard.vue} (96%) delete mode 100644 src/components/HelloWorld.vue delete mode 100644 src/components/WelcomeItem.vue delete mode 100644 src/components/icons/IconCommunity.vue delete mode 100644 src/components/icons/IconDocumentation.vue delete mode 100644 src/components/icons/IconEcosystem.vue delete mode 100644 src/components/icons/IconSupport.vue delete mode 100644 src/components/icons/IconTooling.vue create mode 100644 src/views/BingoView.vue delete mode 100644 src/views/HomeView.vue diff --git a/src/App.vue b/src/App.vue index e953209..b72bdb4 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,72 +1,7 @@ - - + \ No newline at end of file diff --git a/src/assets/base.css b/src/assets/base.css index b603fff..3a47c93 100644 --- a/src/assets/base.css +++ b/src/assets/base.css @@ -1,55 +1,3 @@ -/* color palette from */ -:root { - --vt-c-white: #ffffff; - --vt-c-white-soft: #f8f8f8; - --vt-c-white-mute: #f2f2f2; - - --vt-c-black: #181818; - --vt-c-black-soft: #222222; - --vt-c-black-mute: #282828; - - --vt-c-indigo: #2c3e50; - - --vt-c-divider-light-1: rgba(60, 60, 60, 0.29); - --vt-c-divider-light-2: rgba(60, 60, 60, 0.12); - --vt-c-divider-dark-1: rgba(84, 84, 84, 0.65); - --vt-c-divider-dark-2: rgba(84, 84, 84, 0.48); - - --vt-c-text-light-1: var(--vt-c-indigo); - --vt-c-text-light-2: rgba(60, 60, 60, 0.66); - --vt-c-text-dark-1: var(--vt-c-white); - --vt-c-text-dark-2: rgba(235, 235, 235, 0.64); -} - -/* semantic color variables for this project */ -:root { - --color-background: var(--vt-c-white); - --color-background-soft: var(--vt-c-white-soft); - --color-background-mute: var(--vt-c-white-mute); - - --color-border: var(--vt-c-divider-light-2); - --color-border-hover: var(--vt-c-divider-light-1); - - --color-heading: var(--vt-c-text-light-1); - --color-text: var(--vt-c-text-light-1); - - --section-gap: 160px; -} - -@media (prefers-color-scheme: dark) { - :root { - --color-background: var(--vt-c-black); - --color-background-soft: var(--vt-c-black-soft); - --color-background-mute: var(--vt-c-black-mute); - - --color-border: var(--vt-c-divider-dark-2); - --color-border-hover: var(--vt-c-divider-dark-1); - - --color-heading: var(--vt-c-text-dark-1); - --color-text: var(--vt-c-text-dark-2); - } -} - *, *::before, *::after { @@ -60,8 +8,8 @@ body { min-height: 100vh; - color: var(--color-text); - background: var(--color-background); + color: black; + background: white; line-height: 1.6; font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; diff --git a/src/assets/logo.svg b/src/assets/logo.svg deleted file mode 100644 index 7565660..0000000 --- a/src/assets/logo.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/src/assets/main.css b/src/assets/main.css index f3d83ee..7de5127 100644 --- a/src/assets/main.css +++ b/src/assets/main.css @@ -1,9 +1,5 @@ @import './base.css'; #app { - max-width: 1280px; - margin: 0 auto; - padding: 2rem; - font-weight: normal; } \ No newline at end of file diff --git a/src/components/TheWelcome.vue b/src/components/BingoBoard.vue similarity index 96% rename from src/components/TheWelcome.vue rename to src/components/BingoBoard.vue index 229a3ec..6cdb92d 100644 --- a/src/components/TheWelcome.vue +++ b/src/components/BingoBoard.vue @@ -207,7 +207,7 @@ onBeforeMount(() => { console.log('Inner Tasks ' + innerTasks.length) console.log('Outer Tasks ' + outerTasks.length) - const totalBoards = 200 + const totalBoards = 3 for (var i = totalBoards - 1; i >= 0; i--) { boards.push(getBoardArray(i)) @@ -220,10 +220,8 @@ onBeforeMount(() => {

- Mingle - & - {{ getTitle() }} - - #{{ boardNumber+1 }} + Mingle {{ getTitle() }} + #{{ boardNumber+1 }}

{{ task }} @@ -245,15 +243,14 @@ onBeforeMount(() => { } .tile { width: 20%; - height: 100px; - border: 1px solid aqua; + height: 110px; + outline: 1px dashed grey; display: inline-block; text-align: center; overflow: hidden; - font-size: 15px; - padding: 10px 10px; + font-size: 14px; word-break: break-word; - + position: relative; } .tile > span { display: inline-block; @@ -265,8 +262,13 @@ onBeforeMount(() => { overflow-wrap: break-word; word-break: break-word; hyphens: auto; - width: 100%; border-bottom: 1px solid black; + position: absolute; + top: 5px; + left: 0; + right: 0; + bottom: 15px; + margin: 0 10px; } .board-title { width: 100%; @@ -277,4 +279,4 @@ onBeforeMount(() => { .page-break { page-break-after:always; } - \ No newline at end of file + \ No newline at end of file diff --git a/src/components/HelloWorld.vue b/src/components/HelloWorld.vue deleted file mode 100644 index 1cad09a..0000000 --- a/src/components/HelloWorld.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - - - diff --git a/src/components/WelcomeItem.vue b/src/components/WelcomeItem.vue deleted file mode 100644 index ac366d0..0000000 --- a/src/components/WelcomeItem.vue +++ /dev/null @@ -1,86 +0,0 @@ - - - diff --git a/src/components/icons/IconCommunity.vue b/src/components/icons/IconCommunity.vue deleted file mode 100644 index 2dc8b05..0000000 --- a/src/components/icons/IconCommunity.vue +++ /dev/null @@ -1,7 +0,0 @@ - diff --git a/src/components/icons/IconDocumentation.vue b/src/components/icons/IconDocumentation.vue deleted file mode 100644 index 6d4791c..0000000 --- a/src/components/icons/IconDocumentation.vue +++ /dev/null @@ -1,7 +0,0 @@ - diff --git a/src/components/icons/IconEcosystem.vue b/src/components/icons/IconEcosystem.vue deleted file mode 100644 index c3a4f07..0000000 --- a/src/components/icons/IconEcosystem.vue +++ /dev/null @@ -1,7 +0,0 @@ - diff --git a/src/components/icons/IconSupport.vue b/src/components/icons/IconSupport.vue deleted file mode 100644 index 7452834..0000000 --- a/src/components/icons/IconSupport.vue +++ /dev/null @@ -1,7 +0,0 @@ - diff --git a/src/components/icons/IconTooling.vue b/src/components/icons/IconTooling.vue deleted file mode 100644 index 660598d..0000000 --- a/src/components/icons/IconTooling.vue +++ /dev/null @@ -1,19 +0,0 @@ - - diff --git a/src/router/index.js b/src/router/index.js index a49ae50..dcd79e6 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -1,5 +1,5 @@ import { createRouter, createWebHistory } from 'vue-router' -import HomeView from '../views/HomeView.vue' +import BingoView from '../views/BingoView.vue' const router = createRouter({ history: createWebHistory(import.meta.env.BASE_URL), @@ -7,7 +7,7 @@ const router = createRouter({ { path: '/', name: 'home', - component: HomeView + component: BingoView }, { path: '/about', diff --git a/src/views/AboutView.vue b/src/views/AboutView.vue index 756ad2a..2c89c8f 100644 --- a/src/views/AboutView.vue +++ b/src/views/AboutView.vue @@ -1,15 +1,5 @@ - - diff --git a/src/views/BingoView.vue b/src/views/BingoView.vue new file mode 100644 index 0000000..5413eca --- /dev/null +++ b/src/views/BingoView.vue @@ -0,0 +1,9 @@ + + + diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue deleted file mode 100644 index 6bb706f..0000000 --- a/src/views/HomeView.vue +++ /dev/null @@ -1,9 +0,0 @@ - - -