Statistics styling

This commit is contained in:
baldo 2022-05-23 13:23:37 +02:00
parent 6c47c5b178
commit 3ce2ba5013
6 changed files with 198 additions and 19 deletions
frontend/src/components/page

View file

@ -0,0 +1,56 @@
<script setup lang="ts">
import {useConfigStore} from "@/stores/config";
import {useVersionStore} from "@/stores/version";
const config = useConfigStore();
const version = useVersionStore();
function refresh(): void {
config.refresh();
version.refresh();
}
refresh();
</script>
<template>
<footer v-if="config.getConfig">
ffffng ({{ version.getVersion }})
<a href="https://github.com/freifunkhamburg/ffffng" target="_blank">
<i class="fa fa-code" aria-hidden="true" /> Source Code
</a>
<a href="https://github.com/freifunkhamburg/ffffng/issues" target="_blank">
<i class="fa fa-bug" aria-hidden="true" /> Fehler melden
</a>
<a
v-if="config.getConfig.legal.privacyUrl"
:href="config.getConfig.legal.privacyUrl"
target="_blank">Datenschutz</a>
<a
v-if="config.getConfig.legal.imprintUrl"
:href="config.getConfig.legal.imprintUrl"
target="_blank">Impressum</a>
</footer>
</template>
<style lang="scss" scoped>
@use "sass:math";
@import "../../scss/variables";
footer {
position: absolute;
bottom: 0;
left: 0;
right: 0;
text-align: center;
background-color: $nav-bar-background-color;
padding: $nav-footer-padding;
a {
color: $nav-link-color;
padding: 0 math.div($nav-link-spacing, 2);
}
}
</style>

View file

@ -0,0 +1,76 @@
<script setup lang="ts">
import { useConfigStore } from "@/stores/config";
const config = useConfigStore();
function refresh(): void {
config.refresh();
}
refresh();
</script>
<template>
<header v-if="config.getConfig">
<nav>
<RouterLink class="logo" to="/">
<!--suppress HtmlUnknownTarget -->
<img
src="icon.svg"
alt="Symbol: Gelbes Zahnrad in zwei konzentrischen Kreisen (hellgrau und magenta)"
aria-hidden="true"
/>
</RouterLink>
<h1>
<RouterLink to="/">
{{ config.getConfig.community.name }} Knotenverwaltung
</RouterLink>
</h1>
<RouterLink class="admin-link" to="/admin">
<i class="fa fa-wrench" aria-hidden="true" /> Admin-Panel
</RouterLink>
</nav>
</header>
</template>
<style lang="scss" scoped>
@import "../../scss/variables";
header {
background-color: $nav-bar-background-color;
padding: $nav-header-padding;
* {
vertical-align: middle;
}
.logo {
padding: 0;
img {
width: $nav-header-logo-size;
height: $nav-header-logo-size;
margin: $nav-header-logo-margin;
}
}
h1 {
display: inline;
margin: 0;
}
a {
color: $nav-link-color;
padding: 0 $nav-link-spacing 0 0;
}
a.admin-link {
display: inline-block;
padding: 0;
line-height: 2em;
}
}
</style>