Merge pull request #23 from ViossaDiskordServer/niko-monorepo-rearrange-
feat: bulmify, add Viossa locale
This commit is contained in:
GitHub
commit
1049d26a3d
16 changed files with 21855 additions and 139 deletions
|
|
@ -11,7 +11,7 @@
|
||||||
"trailingComma": "all",
|
"trailingComma": "all",
|
||||||
"bracketSpacing": true,
|
"bracketSpacing": true,
|
||||||
"objectWrap": "collapse",
|
"objectWrap": "collapse",
|
||||||
"bracketSameLine": false,
|
"bracketSameLine": true,
|
||||||
"arrowParens": "always",
|
"arrowParens": "always",
|
||||||
"endOfLine": "lf"
|
"endOfLine": "lf"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,14 @@
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="en">
|
<html lang="en" class="has-background-black has-navbar-fixed-top">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/viossa_circle.svg"/>
|
<link rel="icon" type="image/svg+xml" href="/viossa_circle.svg"/>
|
||||||
|
<link href='https://cdn.boxicons.com/fonts/basic/boxicons.min.css' rel='stylesheet'>
|
||||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap" />
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>Viossa.net</title>
|
<title>Viossa.net</title>
|
||||||
</head>
|
</head>
|
||||||
<body class="has-background-primary-dark">
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<script type="module" src="/src/main.ts"></script>
|
<script type="module" src="/src/main.ts"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
|
||||||
26
src/App.vue
26
src/App.vue
|
|
@ -1,15 +1,28 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="min-h-screen flex flex-col "><!-- Main application wrapper -->
|
<div class="min-h-screen flex flex-col "><!-- Main application wrapper -->
|
||||||
<nav class="navbar" role="navigation" aria-label="main navigation">
|
<nav class="navbar is-fixed-top" role="navigation" aria-label="main navigation">
|
||||||
|
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<RouterLink class="navbar-item has-text-weight-bold" to="/">Viossa.net</RouterLink>
|
<RouterLink class="navbar-item has-text-weight-bold" to="/"><img src="@/assets/ViossaFlagRect.svg" alt=""/></RouterLink>
|
||||||
|
|
||||||
|
<div class="navbar-item">
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
@click="toggleBurger()"
|
||||||
|
:class="`button is-link is-hoverable is-hidden-desktop ${burgerOpen ? 'is-active' : ''}`" aria-label="menu"
|
||||||
|
:aria-expanded="`${burgerOpen ? 'true' : 'false'}`">
|
||||||
|
<span class="bx bx-burger"></span>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="navbar-menu">
|
</div>
|
||||||
|
|
||||||
|
<div :class="`navbar-menu ${burgerOpen ? 'is-active' : ''}`">
|
||||||
<div class="navbar-start">
|
<div class="navbar-start">
|
||||||
<RouterLink class="navbar-item" to="/">What is Viossa?</RouterLink>
|
<RouterLink class="navbar-item" to="/">What is Viossa?</RouterLink>
|
||||||
<RouterLink class="navbar-item" to="/resources">Resources</RouterLink>
|
<RouterLink class="navbar-item" to="/resources">Resources</RouterLink>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</nav>
|
</nav>
|
||||||
<RouterView />
|
<RouterView />
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -17,4 +30,11 @@
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import './assets/style.scss'
|
import './assets/style.scss'
|
||||||
|
import { ref, type Ref } from 'vue'
|
||||||
|
|
||||||
|
const burgerOpen: Ref<Boolean> = ref<Boolean>(false);
|
||||||
|
|
||||||
|
function toggleBurger(): void {
|
||||||
|
burgerOpen.value = !burgerOpen.value;
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
75
src/assets/ViossaFlagCirc3_2ratio.svg
Normal file
75
src/assets/ViossaFlagCirc3_2ratio.svg
Normal file
|
|
@ -0,0 +1,75 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||||
|
|
||||||
|
<svg
|
||||||
|
width="360mm"
|
||||||
|
height="360mm"
|
||||||
|
viewBox="0 0 360 360"
|
||||||
|
version="1.1"
|
||||||
|
id="svg5"
|
||||||
|
xml:space="preserve"
|
||||||
|
inkscape:version="1.2.2 (732a01da63, 2022-12-09)"
|
||||||
|
sodipodi:docname="viossaFlag.svg"
|
||||||
|
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||||
|
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
|
||||||
|
id="namedview7"
|
||||||
|
pagecolor="#ffffff"
|
||||||
|
bordercolor="#000000"
|
||||||
|
borderopacity="0.25"
|
||||||
|
inkscape:showpageshadow="2"
|
||||||
|
inkscape:pageopacity="0.0"
|
||||||
|
inkscape:pagecheckerboard="0"
|
||||||
|
inkscape:deskcolor="#d1d1d1"
|
||||||
|
inkscape:document-units="mm"
|
||||||
|
showgrid="false"
|
||||||
|
inkscape:zoom="5.7299663"
|
||||||
|
inkscape:cx="86.126161"
|
||||||
|
inkscape:cy="613.87795"
|
||||||
|
inkscape:window-width="2400"
|
||||||
|
inkscape:window-height="1411"
|
||||||
|
inkscape:window-x="2391"
|
||||||
|
inkscape:window-y="-9"
|
||||||
|
inkscape:window-maximized="1"
|
||||||
|
inkscape:current-layer="layer2"><inkscape:grid
|
||||||
|
type="xygrid"
|
||||||
|
id="grid302" /></sodipodi:namedview><defs
|
||||||
|
id="defs2" /><g
|
||||||
|
inkscape:groupmode="layer"
|
||||||
|
id="layer2"
|
||||||
|
inkscape:label="Layer 2"
|
||||||
|
transform="translate(134.0933,87.179113)"><path
|
||||||
|
style="fill:#00bbff;fill-opacity:1;stroke:none;stroke-width:0.0289973;stroke-miterlimit:22.2;stroke-dasharray:none;stroke-opacity:1"
|
||||||
|
id="path6216"
|
||||||
|
sodipodi:type="arc"
|
||||||
|
sodipodi:cx="45.906708"
|
||||||
|
sodipodi:cy="92.820892"
|
||||||
|
sodipodi:rx="180"
|
||||||
|
sodipodi:ry="180"
|
||||||
|
sodipodi:start="4.6934522"
|
||||||
|
sodipodi:end="4.6302294"
|
||||||
|
sodipodi:open="true"
|
||||||
|
sodipodi:arc-type="arc"
|
||||||
|
d="M 42.498291,-87.146834 A 180,180 0 0 1 225.79809,86.568504 180,180 0 0 1 55.001506,272.59098 180,180 0 0 1 -133.69718,104.75583 180,180 0 0 1 31.134615,-86.571932"
|
||||||
|
inkscape:export-filename="..\Finished\ViossaFlagCirc3_2ratio.svg"
|
||||||
|
inkscape:export-xdpi="96"
|
||||||
|
inkscape:export-ydpi="96" /><g
|
||||||
|
id="g5819"
|
||||||
|
transform="matrix(0.93405356,0,0,0.93405356,-53.016663,-34.779538)"><path
|
||||||
|
style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.399354;stroke-miterlimit:22.2"
|
||||||
|
id="path385"
|
||||||
|
sodipodi:type="arc"
|
||||||
|
sodipodi:cx="105.9076"
|
||||||
|
sodipodi:cy="136.60933"
|
||||||
|
sodipodi:rx="128.47229"
|
||||||
|
sodipodi:ry="128.47374"
|
||||||
|
sodipodi:start="4.6934522"
|
||||||
|
sodipodi:end="4.6302294"
|
||||||
|
sodipodi:open="true"
|
||||||
|
sodipodi:arc-type="arc"
|
||||||
|
d="M 103.47489,8.1586244 A 128.47229,128.47374 0 0 1 234.30236,132.14673 128.47229,128.47374 0 0 1 112.39888,264.91897 128.47229,128.47374 0 0 1 -22.281972,145.12781 128.47229,128.47374 0 0 1 95.364242,8.5689572" /><path
|
||||||
|
style="fill:#00bbff;fill-opacity:1;stroke:none;stroke-width:0.029;stroke-miterlimit:22.2;stroke-dasharray:none"
|
||||||
|
d="m 117.05457,164.17654 c 8.03452,-0.0462 8.49627,-1.08512 8.49627,-1.08512 9.82856,-19.81483 22.21219,-26.80177 41.97341,-36.29385 8.34356,-3.68297 19.0164,-10.96258 27.61288,-17.13106 6.26354,-4.49445 12.05177,-10.297107 20.17864,-13.621734 8.53145,-3.490137 -10.80504,12.328824 -10.80504,12.328824 -9.0042,8.12686 -14.95674,11.81852 -22.02565,15.97668 -10.7129,6.30168 -14.31359,8.34425 -19.30131,12.14412 -5.80492,4.42245 -9.88634,7.92764 -13.66791,10.29711 -7.29571,4.57136 -9.28125,7.66511 -10.11241,8.77332 -0.83116,1.10821 -3.97108,5.95663 -3.97108,5.95663 1.66231,-0.50793 4.94076,-1.01586 4.94076,-1.01586 0.0462,2.40112 -5.49486,6.7416 -5.49486,6.7416 -2.77053,1.89319 -5.77193,4.47901 -5.77193,4.47901 1.20056,11.49767 -5.58722,18.0084 -5.58722,18.0084 -9.28124,10.20475 -18.3427,0.76386 -20.22481,-4.20196 -3.17843,-8.38609 -13.802587,-15.78912 -23.687967,-17.82369 -11.028807,-2.26991 -14.129558,-1.84483 -21.05597,-3.46315 -19.763059,-4.61754 -25.561421,-6.75206 -38.510261,-9.37361 -7.526586,-1.52379 -13.8064366,-4.20196 -13.8064366,-4.20196 0,0 -10.8973881,-4.84841 -13.5293844,-8.35774 -2.6319962,-3.50933 7.20335825,-0.3694 7.20335825,-0.3694 0,0 5.60046125,2.09797 8.49626865,2.81669 19.1627801,4.75607 27.5461821,6.95957 33.8465491,7.24953 6.300367,0.29001 17.394868,0.27841 17.394868,0.27841 17.211282,0.25025 32.426083,4.51346 41.247855,12.11969 1.92916,1.66334 3.41698,1.73157 4.42129,1.92782 3.28987,0.10945 8.16149,-1.974 11.74009,-2.1587 z"
|
||||||
|
id="path455"
|
||||||
|
sodipodi:nodetypes="cczccscccsscccccsssscssccscc" /></g></g></svg>
|
||||||
|
After Width: | Height: | Size: 4.5 KiB |
70
src/assets/ViossaFlagRect.svg
Normal file
70
src/assets/ViossaFlagRect.svg
Normal file
|
|
@ -0,0 +1,70 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||||
|
|
||||||
|
<svg
|
||||||
|
width="508mm"
|
||||||
|
height="341.04791mm"
|
||||||
|
viewBox="0 0 508 341.04791"
|
||||||
|
version="1.1"
|
||||||
|
id="svg5"
|
||||||
|
xml:space="preserve"
|
||||||
|
inkscape:version="1.2.2 (732a01da63, 2022-12-09)"
|
||||||
|
sodipodi:docname="viossaFlag.svg"
|
||||||
|
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||||
|
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
|
||||||
|
id="namedview7"
|
||||||
|
pagecolor="#ffffff"
|
||||||
|
bordercolor="#000000"
|
||||||
|
borderopacity="0.25"
|
||||||
|
inkscape:showpageshadow="2"
|
||||||
|
inkscape:pageopacity="0.0"
|
||||||
|
inkscape:pagecheckerboard="0"
|
||||||
|
inkscape:deskcolor="#d1d1d1"
|
||||||
|
inkscape:document-units="mm"
|
||||||
|
showgrid="false"
|
||||||
|
inkscape:zoom="5.7299663"
|
||||||
|
inkscape:cx="86.126161"
|
||||||
|
inkscape:cy="613.87795"
|
||||||
|
inkscape:window-width="2400"
|
||||||
|
inkscape:window-height="1411"
|
||||||
|
inkscape:window-x="2391"
|
||||||
|
inkscape:window-y="-9"
|
||||||
|
inkscape:window-maximized="1"
|
||||||
|
inkscape:current-layer="layer2"><inkscape:grid
|
||||||
|
type="xygrid"
|
||||||
|
id="grid302" /></sodipodi:namedview><defs
|
||||||
|
id="defs2" /><g
|
||||||
|
inkscape:groupmode="layer"
|
||||||
|
id="layer2"
|
||||||
|
inkscape:label="Layer 2"
|
||||||
|
transform="translate(150.306,34.583659)"><g
|
||||||
|
id="g5950"
|
||||||
|
inkscape:export-filename="..\Finished\ViossaFlagFullSize.svg"
|
||||||
|
inkscape:export-xdpi="96"
|
||||||
|
inkscape:export-ydpi="96"><rect
|
||||||
|
style="fill:#00bbff;fill-opacity:1;stroke:none;stroke-width:0.0615961;stroke-miterlimit:22.2;stroke-dasharray:none;stroke-opacity:1"
|
||||||
|
id="rect5873"
|
||||||
|
width="508"
|
||||||
|
height="341.04791"
|
||||||
|
x="-150.306"
|
||||||
|
y="-34.58366" /><g
|
||||||
|
id="g5819"
|
||||||
|
transform="translate(-2.2136002,-0.66903305)"><path
|
||||||
|
style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.399354;stroke-miterlimit:22.2"
|
||||||
|
id="path385"
|
||||||
|
sodipodi:type="arc"
|
||||||
|
sodipodi:cx="105.9076"
|
||||||
|
sodipodi:cy="136.60933"
|
||||||
|
sodipodi:rx="128.47229"
|
||||||
|
sodipodi:ry="128.47374"
|
||||||
|
sodipodi:start="4.6934522"
|
||||||
|
sodipodi:end="4.6302294"
|
||||||
|
sodipodi:open="true"
|
||||||
|
sodipodi:arc-type="arc"
|
||||||
|
d="M 103.47489,8.1586244 A 128.47229,128.47374 0 0 1 234.30236,132.14673 128.47229,128.47374 0 0 1 112.39888,264.91897 128.47229,128.47374 0 0 1 -22.281972,145.12781 128.47229,128.47374 0 0 1 95.364242,8.5689572" /><path
|
||||||
|
style="fill:#00bbff;fill-opacity:1;stroke:none;stroke-width:0.029;stroke-miterlimit:22.2;stroke-dasharray:none"
|
||||||
|
d="m 117.05457,164.17654 c 8.03452,-0.0462 8.49627,-1.08512 8.49627,-1.08512 9.82856,-19.81483 22.21219,-26.80177 41.97341,-36.29385 8.34356,-3.68297 19.0164,-10.96258 27.61288,-17.13106 6.26354,-4.49445 12.05177,-10.297107 20.17864,-13.621734 8.53145,-3.490137 -10.80504,12.328824 -10.80504,12.328824 -9.0042,8.12686 -14.95674,11.81852 -22.02565,15.97668 -10.7129,6.30168 -14.31359,8.34425 -19.30131,12.14412 -5.80492,4.42245 -9.88634,7.92764 -13.66791,10.29711 -7.29571,4.57136 -9.28125,7.66511 -10.11241,8.77332 -0.83116,1.10821 -3.97108,5.95663 -3.97108,5.95663 1.66231,-0.50793 4.94076,-1.01586 4.94076,-1.01586 0.0462,2.40112 -5.49486,6.7416 -5.49486,6.7416 -2.77053,1.89319 -5.77193,4.47901 -5.77193,4.47901 1.20056,11.49767 -5.58722,18.0084 -5.58722,18.0084 -9.28124,10.20475 -18.3427,0.76386 -20.22481,-4.20196 -3.17843,-8.38609 -13.802587,-15.78912 -23.687967,-17.82369 -11.028807,-2.26991 -14.129558,-1.84483 -21.05597,-3.46315 -19.763059,-4.61754 -25.561421,-6.75206 -38.510261,-9.37361 -7.526586,-1.52379 -13.8064366,-4.20196 -13.8064366,-4.20196 0,0 -10.8973881,-4.84841 -13.5293844,-8.35774 -2.6319962,-3.50933 7.20335825,-0.3694 7.20335825,-0.3694 0,0 5.60046125,2.09797 8.49626865,2.81669 19.1627801,4.75607 27.5461821,6.95957 33.8465491,7.24953 6.300367,0.29001 17.394868,0.27841 17.394868,0.27841 17.211282,0.25025 32.426083,4.51346 41.247855,12.11969 1.92916,1.66334 3.41698,1.73157 4.42129,1.92782 3.28987,0.10945 8.16149,-1.974 11.74009,-2.1587 z"
|
||||||
|
id="path455"
|
||||||
|
sodipodi:nodetypes="cczccscccsscccccsssscssccscc" /></g></g></g></svg>
|
||||||
|
After Width: | Height: | Size: 4.2 KiB |
21564
src/assets/bulma.css
vendored
Normal file
21564
src/assets/bulma.css
vendored
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -1,26 +1,26 @@
|
||||||
@use "bulma";
|
@use "./bulma.css";
|
||||||
|
|
||||||
|
* {
|
||||||
|
--bulma-primary-h: 196deg;
|
||||||
|
--bulma-primary-l: 50%;
|
||||||
|
--bulma-primary-s: 100%;
|
||||||
|
|
||||||
|
--bulma-link-h: 293deg;
|
||||||
|
--bulma-link-l: 50%;
|
||||||
|
--bulma-link-s: 45%;
|
||||||
|
|
||||||
|
--bulma-warning-h: 31deg;
|
||||||
|
--bulma-warning-l: 75%;
|
||||||
|
--bulma-warning-s: 100%;
|
||||||
|
|
||||||
|
--bulma-info-h: 90deg;
|
||||||
|
--bulma-info-l: 50%;
|
||||||
|
--bulma-info-s: 45%;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
:root {
|
|
||||||
--bulma-primary-h: 195deg;
|
|
||||||
--bulma-primary-l: 65%;
|
|
||||||
--bulma-scheme-h: 195;
|
|
||||||
--bulma-family-primary: Nunito,Inter,SF Pro,Segoe UI,Roboto,Oxygen,Ubuntu,Helvetica Neue,Helvetica,Arial,sans-serif;
|
--bulma-family-primary: Nunito,Inter,SF Pro,Segoe UI,Roboto,Oxygen,Ubuntu,Helvetica Neue,Helvetica,Arial,sans-serif;
|
||||||
--bulma-family-secondary: Nunito,Inter,SF Pro,Segoe UI,Roboto,Oxygen,Ubuntu,Helvetica Neue,Helvetica,Arial,sans-serif;
|
--bulma-family-secondary: Nunito,Inter,SF Pro,Segoe UI,Roboto,Oxygen,Ubuntu,Helvetica Neue,Helvetica,Arial,sans-serif;
|
||||||
--bulma-burger-h: 195deg;
|
|
||||||
--bulma-body-family: Nunito,Inter,SF Pro,Segoe UI,Roboto,Oxygen,Ubuntu,Helvetica Neue,Helvetica,Arial,sans-serif;
|
--bulma-body-family: Nunito,Inter,SF Pro,Segoe UI,Roboto,Oxygen,Ubuntu,Helvetica Neue,Helvetica,Arial,sans-serif;
|
||||||
};
|
};
|
||||||
|
|
||||||
//$viossa-blue: #65b7f9;
|
|
||||||
|
|
||||||
// body {
|
|
||||||
// background-color: $viossa-blue;
|
|
||||||
// font:
|
|
||||||
// normal Verdana,
|
|
||||||
// Arial,
|
|
||||||
// sans-serif;
|
|
||||||
// color: black;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// h1 {
|
|
||||||
// font-size: 48px;
|
|
||||||
// }
|
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="column is-one-quarter" v-if="image">
|
<div class="column is-one-quarter" v-if="image">
|
||||||
<figure class="image">
|
<figure class="image">
|
||||||
<img :src="image" :alt="alt" />
|
<img :src="image" :alt="alt" :title="alt" />
|
||||||
</figure>
|
</figure>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -16,7 +16,7 @@
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<div class="column is-one-quarter" v-if="image">
|
<div class="column is-one-quarter" v-if="image">
|
||||||
<figure class="image">
|
<figure class="image">
|
||||||
<img :src="image" :alt="alt" />
|
<img :src="image" :alt="alt" :title="alt" />
|
||||||
</figure>
|
</figure>
|
||||||
</div>
|
</div>
|
||||||
<div class="column">
|
<div class="column">
|
||||||
|
|
|
||||||
|
|
@ -1,21 +1,39 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="box m-3 p-3 columns is-vcentered">
|
<div class="box columns is-vcentered is-gap-4">
|
||||||
<div class="column is-one-quarter" v-if="image">
|
<div class="column is-one-quarter" v-if="image">
|
||||||
<figure class="image is-128x128">
|
<figure class="image">
|
||||||
<img :src="image" :alt="alt" />
|
<img :src="image" :alt="alt" :title="alt" />
|
||||||
</figure>
|
</figure>
|
||||||
</div>
|
</div>
|
||||||
<div class="column">
|
<div class="column">
|
||||||
<h4 class="title">{{ title }}</h4>
|
<h4 class="title">{{ title }}</h4>
|
||||||
<p class="has-text-white is-size-5 mb-3">{{ desc }}</p>
|
<p class="subtitle">{{ subtitle }}</p>
|
||||||
<a
|
<p class="content">{{ desc }}</p>
|
||||||
:href="link"
|
|
||||||
|
<div class="level">
|
||||||
|
<a :href="link"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer nofollow"
|
rel="noopener noreferrer nofollow"
|
||||||
class="button is-link is-medium has-text-white"
|
class="button is-primary is-medium"
|
||||||
>
|
:text="joinText">
|
||||||
{{ link }}
|
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
|
<a :href="``"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer nofollow"
|
||||||
|
class="button is-info is-outlined is-medium"
|
||||||
|
:text="rulesText">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a :href="rulesLink"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer nofollow"
|
||||||
|
class="button is-warning is-outlined is-medium"
|
||||||
|
:text="rulesText">
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -23,8 +41,12 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
defineProps({
|
defineProps({
|
||||||
title: String,
|
title: String,
|
||||||
|
subtitle: String,
|
||||||
desc: String,
|
desc: String,
|
||||||
link: String,
|
link: String,
|
||||||
|
rulesLink: String,
|
||||||
|
joinText: String,
|
||||||
|
rulesText: String,
|
||||||
image: { type: String, required: false },
|
image: { type: String, required: false },
|
||||||
alt: { type: String, required: false },
|
alt: { type: String, required: false },
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -1,11 +1,13 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="min-h-screen flex flex-col">
|
<div>
|
||||||
<!-- Main application wrapper -->
|
<section class="hero is-primary">
|
||||||
<section class="section">
|
<div class="hero-body">
|
||||||
<h1 class="title has-text-black p-3">BRÅTULA VIOSSA.NET MÅDE</h1>
|
<div class="title">BRÅTULA VIOSSA.NET MÅDE</div>
|
||||||
|
<div class="subtitle">Hadjiplas per lera para Viossa – glossa fu vi</div>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="section">
|
<section class="section container">
|
||||||
<HomeSectionWrapper
|
<HomeSectionWrapper
|
||||||
v-for="(section, index) in sectionsWithImages"
|
v-for="(section, index) in sectionsWithImages"
|
||||||
:key="index"
|
:key="index"
|
||||||
|
|
|
||||||
|
|
@ -1,19 +1,22 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="min-h-screen flex flex-col" style="gap: 4rem">
|
<div>
|
||||||
<!-- Main application wrapper -->
|
|
||||||
<section class="section">
|
<section class="section">
|
||||||
<h1 class="title has-text-black p-3">Learning Resources</h1>
|
<h1 class="title">Learning Resources</h1>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="section">
|
<section class="section container">
|
||||||
<LearningResourceWrapper class="is-one-quarter"
|
<LearningResourceWrapper
|
||||||
v-for="(resource, index) in resourcesWithImages"
|
v-for="(resource, index) in resourcesWithImages"
|
||||||
:key="index"
|
:key="index"
|
||||||
:title="resource.title"
|
:title="resource.title"
|
||||||
|
:subtitle="resource.subtitle"
|
||||||
:desc="resource.desc"
|
:desc="resource.desc"
|
||||||
:link="resource.link"
|
:link="resource.link"
|
||||||
|
:rulesLink="resource.rulesLink"
|
||||||
:image="resource.image"
|
:image="resource.image"
|
||||||
:alt="resource.alt"
|
:alt="resource.alt"
|
||||||
|
:joinText="resource.joinText"
|
||||||
|
:rulesText="resource.rulesText"
|
||||||
/>
|
/>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,15 @@
|
||||||
import { createI18n } from 'vue-i18n'
|
import { createI18n } from 'vue-i18n'
|
||||||
import en_US from '../locales/en_US'
|
import en_US from '../locales/en_US'
|
||||||
|
import vp_VL from '../locales/vp_VL'
|
||||||
import type { MessageSchema } from './types'
|
import type { MessageSchema } from './types'
|
||||||
|
|
||||||
const i18n = createI18n<[MessageSchema], 'en_US'>({
|
const i18n = createI18n<[MessageSchema], 'en_US' | 'vp_VL'>({
|
||||||
legacy: false,
|
legacy: false,
|
||||||
locale: 'en_US',
|
locale: 'vp_VL',
|
||||||
fallbackLocale: 'en_US',
|
fallbackLocale: 'en_US',
|
||||||
messages: {
|
messages: {
|
||||||
en_US: en_US
|
en_US,
|
||||||
|
vp_VL
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -20,10 +20,14 @@ export default {
|
||||||
"resources": [
|
"resources": [
|
||||||
{
|
{
|
||||||
"title": "Discord Server",
|
"title": "Discord Server",
|
||||||
"desc": "This is where most of the action happens! Hop on in!",
|
"subtitle": "This is where most of the action happens! Hop on in!",
|
||||||
|
"desc": "Originally started in 2015 something something read the rules here, then click the link below to join!",
|
||||||
"link": "https://discord.gg/g3mG2gYjZD",
|
"link": "https://discord.gg/g3mG2gYjZD",
|
||||||
|
"rulesLink": "https://viossadiskordserver.github.io/rules",
|
||||||
"image": "discord.png",
|
"image": "discord.png",
|
||||||
"alt": "Discord logo"
|
"alt": "Discord logo",
|
||||||
|
"joinText": "Join",
|
||||||
|
"rulesText": "Rules"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
33
src/locales/vp_VL.ts
Normal file
33
src/locales/vp_VL.ts
Normal file
|
|
@ -0,0 +1,33 @@
|
||||||
|
export default {
|
||||||
|
"sections": [
|
||||||
|
{
|
||||||
|
"title": "Kafaen afto Viossa",
|
||||||
|
"text": "Viossa tte glossa mahena grun vi nai vil fshtojena na bakadjin, grun vi svinnur ja! De aldjin zovti lera ne",
|
||||||
|
"image": "flakka.png",
|
||||||
|
"alt": "Flag of the Viossa Language"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "History of Viossa",
|
||||||
|
"text": "Viossa began as a Skype group in 2014, created by members of the r/conlangs community on Reddit, as an experiment to simulate the formation of a pidgin language. Pidgins are simplified languages resulting from contact between populations with no shared common language. Unlike most pidgins, which usually have two to three contributor languages, Viossa comes from many diverse languages. This is because people from all around the world helped to contribute to Viossa's vocabulary.",
|
||||||
|
"image": "flakka.png",
|
||||||
|
"alt": "Flag of the Viossa Language"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"title": "Community",
|
||||||
|
"text": "The Viossa community is rich and colourful, drawing from many global traditions due to its worldwide online membership. Since the teaching culture puts an emphasis on linguistic immersion, and discourages prescriptivism, the culture of Viossa is as diverse and varied as the language and the people who speak it. For many, their personal dialect is a key form of identity and expression. The fluid nature of Viossa and lack of defined meanings makes Viossa popular for creative purposes, such as poetry and songwriting.",
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"resources": [
|
||||||
|
{
|
||||||
|
"title": "Discord Server",
|
||||||
|
"subtitle": "This is where most of the action happens! Hop on in!",
|
||||||
|
"desc": "Originally started in 2015 something something read the rules here, then click the link below to join!",
|
||||||
|
"link": "https://discord.gg/g3mG2gYjZD",
|
||||||
|
"rulesLink": "https://viossadiskordserver.github.io/rules",
|
||||||
|
"image": "discord.png",
|
||||||
|
"alt": "Discord logo",
|
||||||
|
"joinText": "Join",
|
||||||
|
"rulesText": "Rules"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
@ -1,5 +1,4 @@
|
||||||
import { createApp } from "vue";
|
import { createApp } from "vue";
|
||||||
import "./style.css";
|
|
||||||
import App from "./App.vue";
|
import App from "./App.vue";
|
||||||
import router from "./routes"
|
import router from "./routes"
|
||||||
import i18n from './i18n'
|
import i18n from './i18n'
|
||||||
|
|
|
||||||
|
|
@ -1,79 +0,0 @@
|
||||||
:root {
|
|
||||||
font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
|
|
||||||
line-height: 1.5;
|
|
||||||
font-weight: 400;
|
|
||||||
|
|
||||||
color-scheme: light dark;
|
|
||||||
color: rgba(255, 255, 255, 0.87);
|
|
||||||
background-color: #242424;
|
|
||||||
|
|
||||||
font-synthesis: none;
|
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
font-weight: 500;
|
|
||||||
color: #646cff;
|
|
||||||
text-decoration: inherit;
|
|
||||||
}
|
|
||||||
a:hover {
|
|
||||||
color: #535bf2;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
display: flex;
|
|
||||||
place-items: center;
|
|
||||||
min-width: 320px;
|
|
||||||
min-height: 100vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-size: 3.2em;
|
|
||||||
line-height: 1.1;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
border-radius: 8px;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
padding: 0.6em 1.2em;
|
|
||||||
font-size: 1em;
|
|
||||||
font-weight: 500;
|
|
||||||
font-family: inherit;
|
|
||||||
background-color: #1a1a1a;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: border-color 0.25s;
|
|
||||||
}
|
|
||||||
button:hover {
|
|
||||||
border-color: #646cff;
|
|
||||||
}
|
|
||||||
button:focus,
|
|
||||||
button:focus-visible {
|
|
||||||
outline: 4px auto -webkit-focus-ring-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
|
||||||
padding: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#app {
|
|
||||||
max-width: 1280px;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 2rem;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: light) {
|
|
||||||
:root {
|
|
||||||
color: #213547;
|
|
||||||
background-color: #ffffff;
|
|
||||||
}
|
|
||||||
a:hover {
|
|
||||||
color: #747bff;
|
|
||||||
}
|
|
||||||
button {
|
|
||||||
background-color: #f9f9f9;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue