1
0
Fork 0

Use Kiste

This commit is contained in:
Moritz Ruth 2019-12-08 17:45:22 +01:00
parent 925ecec652
commit 19b9bae0ee
25 changed files with 479 additions and 1054 deletions

View file

@ -1,5 +1,6 @@
# moritz-ruth.de
> The official website of Moritz Ruth
## Build Setup

View file

@ -1,11 +0,0 @@
@mixin mobile() {
@media (max-width: 800px) {
@content;
}
}
@mixin notMobile() {
@media (min-width: 801px) {
@content;
}
}

View file

@ -1,9 +0,0 @@
$content-width: 1000px;
$content-padding: 20px;
$small-gutter: 10px;
$black-brighter: #0e0e0e;
$blue: #3695d8;
$on-blue: black;
$blue-darker: #3289c7;

View file

@ -1,4 +0,0 @@
@import "content";
@import "link";
@import "heading";
@import "paragraph";

View file

@ -1,11 +0,0 @@
@import "../variables";
.content {
width: $content-width;
margin: 0 auto;
@media (max-width: #{$content-width + $content-padding * 2}) {
width: 100%;
padding: 0 #{$content-padding};
}
}

View file

@ -1,28 +0,0 @@
.heading--1, .heading--2, .heading--3, .heading--4, .heading--5, .heading--6 {
margin-top: 1rem;
margin-bottom: 1rem;
}
.heading--1 {
font-size: 3.8rem;
}
.heading--2 {
font-size: 3rem;
}
.heading--3 {
font-size: 2.6rem;
}
.heading--4 {
font-size: 2.2rem;
}
.heading--5 {
font-size: 1.8rem;
}
.heading--6 {
font-size: 1.4rem;
}

View file

@ -1,13 +0,0 @@
@import "../variables";
.link {
color: $blue;
text-decoration: none;
transition: 100ms linear opacity;
opacity: 1;
&:hover {
opacity: 0.8;
}
}

View file

@ -1,7 +0,0 @@
.paragraph {
margin: 20px 0;
li {
margin-left: 20px;
}
}

View file

@ -1,32 +0,0 @@
@import "elements/_all";
@import "mobile";
:root {
--navbar-height: 100px;
@include mobile {
--navbar-height: 80px;
}
}
*, ::before, ::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: "Alata", sans-serif;
font-size: 16px;
}
html, body, #__nuxt, #__layout, .fill-screen {
max-width: 100vw;
min-height: 100vh;
overflow-x: auto;
}
::selection {
background-color: #dddddd;
}

3
assets/global.scss Normal file
View file

@ -0,0 +1,3 @@
body {
font-family: "Alata", sans-serif;
}

View file

@ -1,4 +0,0 @@
export const footer = Object.freeze([
{ label: "Legal Notice", to: "/legal-notice" },
{ label: "Privacy Policy", to: "/privacy-policy" }
]);

View file

@ -7,6 +7,8 @@
</template>
<style scoped lang="scss">
$logo-width: 270px;
.animated-logo {
animation: logo-width 800ms 1s ease, logo-height 600ms 1.9s ease;
animation-fill-mode: both;
@ -27,7 +29,7 @@
}
to {
width: 300px;
width: $logo-width;
}
}
@ -71,7 +73,7 @@
}
.animated-logo__logo {
width: 300px;
width: $logo-width;
flex-shrink: 0;
}
</style>

View file

@ -1,42 +0,0 @@
<template>
<a
class="external-link link"
rel="noopener"
target="_blank"
:href="href"
>{{ label || href }}<ExternalIcon class="external-link__icon"/></a>
</template>
<style scoped lang="scss">
.external-link {
padding-right: 5px;
overflow-wrap: break-word;
}
.external-link__icon {
margin-left: 5px;
width: 15px;
position: relative;
top: 2px;
}
</style>
<script>
import ExternalIcon from "@/assets/icons/external.svg";
export default {
name: "ExternalLink",
components: { ExternalIcon },
props: {
href: {
type: String,
required: true
},
label: {
type: String,
default: null
}
}
};
</script>

View file

@ -1,117 +0,0 @@
<style scoped lang="scss">
@import "~@/assets/css/variables";
.button {
display: inline-flex;
justify-content: center;
align-items: center;
padding: 8px 15px;
border-radius: 4px;
height: 42px;
text-decoration: none;
color: $blue;
transition: 140ms ease background-color;
&:hover {
background: transparentize($blue, 0.9);
}
}
.button__text {
text-transform: uppercase;
font-weight: bold;
font-size: 1.2rem;
}
.button__prefix > * {
position: relative;
top: 2px;
margin-right: 6px;
width: 20px;
}
.button__suffix > * {
position: relative;
top: 2px;
margin-left: 6px;
width: 20px;
}
</style>
<script>
export default {
name: "GButton",
props: {
to: {
type: String,
default: ""
},
href: {
type: String,
default: ""
}
},
computed: {
isExternalLink: vm => Boolean(vm.href),
isInternalLink: vm => Boolean(vm.to)
},
methods: {
onClick(e) {
this.$emit("click", e);
}
},
render(h) {
const children = [
h("div", {
class: "button__prefix"
}, this.$slots.prefix),
h("div", {
class: "button__text"
}, this.$slots.default),
h("div", {
class: "button__suffix"
}, this.$slots.suffix)
];
const baseOptions = {
class: "button",
on: {
click: this.onClick
},
directives: [
{
name: "ripple",
value: "rgba(0, 0, 0, 0.2)"
}
]
};
if (this.isInternalLink) {
return h("nuxt-link", {
...baseOptions,
props: {
to: this.to
}
}, children);
} else if (this.isExternalLink) {
return h("a", {
...baseOptions,
attrs: {
href: this.href,
rel: "noopener"
}
}, children);
} else {
return h("div", {
...baseOptions,
attrs: {
role: "button"
}
}, children);
}
}
};
</script>

View file

@ -1,290 +0,0 @@
<template>
<nav class="navigation-bar" :class="{ 'show-background': showBackground, open, scrolled }">
<div class="navigation-bar__toggle" @click="open = !open">
<span></span>
<span></span>
<span></span>
</div>
<div class="navigation-bar__container-1 content">
<span class="navigation-bar__title">{{ title }}</span>
<div class="navigation-bar__container-2">
<div class="navigation-bar__links">
<template v-for="item in $options.navigationItems">
<nuxt-link
v-if="item.to"
:key="item.to"
:to="item.to"
@click.native.passive="open = false"
>
{{ item.label }}
</nuxt-link>
<a
v-else
:key="item.to"
rel="noopener"
:href="item.href"
@click.native.passive="open = false"
>
{{ item.label }}
</a>
</template>
</div>
</div>
</div>
</nav>
</template>
<style scoped lang="scss">
@import "~@/assets/css/mobile";
@import "~@/assets/css/variables";
.navigation-bar {
height: var(--navbar-height);
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 2;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 1.1rem;
text-transform: uppercase;
background-color: transparent;
&.show-background {
background-color: white;
}
&.scrolled {
.navigation-bar__title {
opacity: 1;
transform: translateY(0);
}
}
}
.navigation-bar__toggle {
display: none;
}
.navigation-bar__title {
font-size: 1.5rem;
font-weight: bold;
text-overflow: ellipsis;
overflow: hidden;
flex-shrink: 0;
max-width: calc(100% - 10px);
transition: 200ms ease;
transition-property: opacity, transform;
opacity: 0;
transform: translateY(10px);
@include notMobile {
font-size: 2rem;
}
}
.navigation-bar__container-1 {
max-width: 100%;
height: 100%;
overflow: hidden;
display: flex;
align-items: center;
justify-content: space-between;
}
.navigation-bar__container-2 {
width: 100%;
}
.navigation-bar__links {
float: right;
a {
display: inline-block;
margin-left: 40px;
position: relative;
text-decoration: none;
color: black;
&::after {
content: "";
position: absolute;
top: 30px;
left: 0;
background-color: black;
height: 2px;
width: 100%;
opacity: 0;
transition: 200ms linear opacity;
}
&:hover {
&::after {
opacity: 1;
}
}
}
}
@include mobile {
.navigation-bar__toggle {
display: block;
position: relative;
left: 30px;
z-index: 2;
& > span {
display: block;
background-color: black;
width: 30px;
height: 2px;
transition: 200ms linear;
transition-property: opacity, transform;
&:nth-child(2) {
margin-top: 8px;
}
&:nth-child(3) {
margin-top: 8px;
}
}
}
.navigation-bar__container-1 {
margin-left: 30px;
}
.navigation-bar__container-2 {
pointer-events: none;
background-color: white;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
padding-top: var(--navbar-height);
opacity: 0;
transition: 200ms ease-out opacity;
}
.navigation-bar__links {
float: none;
& > a {
display: block;
width: fit-content;
margin: 0 auto 20px;
font-size: 1.5rem;
transform: translateX(-100%);
opacity: 0;
transition: 400ms ease-out;
transition-property: opacity, transform;
&:after {
top: 35px;
}
}
}
.navigation-bar.open {
.navigation-bar__toggle > span {
&:nth-child(1) {
transform: translateY(10px) rotate(45deg);
}
&:nth-child(2) {
opacity: 0;
}
&:nth-child(3) {
transform: translateY(-10px) rotate(-45deg);
}
}
.navigation-bar__container-2 {
pointer-events: auto;
opacity: 1;
}
.navigation-bar__links > a {
transform: translateX(0);
opacity: 1;
}
}
}
</style>
<script>
const NAVIGATION_ITEMS = [
{
label: "Home",
to: "/"
},
{
label: "Projects",
to: "/projects"
}
];
export default {
name: "NavigationBar",
navigationItems: NAVIGATION_ITEMS,
props: {
showBackground: {
type: Boolean,
default: false
},
title: {
type: String,
default: ""
}
},
data: () => ({
open: false,
scrollPosition: 0
}),
computed: {
scrolled: vm => vm.scrollPosition > 50
},
mounted() {
const scrollListener = () => {
this.scrollPosition = window.scrollY;
};
window.addEventListener("scroll", scrollListener, { passive: true });
this.$on("hook:beforeDestroy", () => {
window.removeEventListener("scroll", scrollListener);
});
scrollListener();
}
};
</script>

View file

@ -8,32 +8,30 @@
<slot/>
</div>
<hr class="project__divider"/>
<div class="project__buttons">
<GButton v-if="link" class="project__button" :href="link">
<div class="project__buttons flex-with-gutter">
<KButton v-if="link" :href="link">
Open
<template v-slot:suffix>
<ArrowRightIcon/>
</template>
</GButton>
<GButton v-if="github" class="project__button" :href="`https://github.com/${github}`">
</KButton>
<KButton v-if="github" :href="`https://github.com/${github}`">
GitHub
<template v-slot:prefix>
<GitHubIcon/>
</template>
</GButton>
<GButton v-if="npm" class="project__button" :href="`https://www.npmjs.com/package/${npm}`">
</KButton>
<KButton v-if="npm" :href="`https://www.npmjs.com/package/${npm}`">
NPM
<template v-slot:prefix>
<NPMIcon style="width: 30px; top: 4px"/>
</template>
</GButton>
</KButton>
</div>
</div>
</template>
<style scoped lang="scss">
@import "~@/assets/css/variables";
.project__type {
margin-top: -1rem;
margin-bottom: 1rem;
@ -55,30 +53,21 @@
}
.project__buttons {
display: flex;
& > *:not(:last-child) {
margin-right: 5px;
}
.project__button {
&:not(:last-child) {
margin-right: $small-gutter;
}
}
.project__button-icon {
width: 10px;
display: inline;
}
</style>
<script>
import KButton from "kiste/components/KButton";
import ArrowRightIcon from "@/assets/icons/arrow_right.svg";
import GitHubIcon from "@/assets/icons/github.svg";
import NPMIcon from "@/assets/icons/npm.svg";
import GButton from "@/components/GButton";
export default {
name: "GProject",
components: { GButton, ArrowRightIcon, GitHubIcon, NPMIcon },
components: { KButton, ArrowRightIcon, GitHubIcon, NPMIcon },
props: {
title: {
type: String,

View file

@ -1,63 +1,22 @@
<template>
<div class="default-layout fill-screen">
<div class="content default-layout__content">
<KApp>
<nuxt/>
</div>
<footer class="content default-layout__footer">
<nuxt-link
v-for="link in $options.footer"
:key="link.to"
class="default-layout__footer-link"
:to="link.to"
>
{{ link.label }}
</nuxt-link>
</footer>
<KFooter/>
</KApp>
</div>
</template>
<style scoped lang="scss">
@import "~@/assets/css/variables";
@import "~@/assets/css/mobile";
.default-layout__content {
margin-top: var(--navbar-height);
margin-bottom: 50px;
}
.default-layout__footer {
margin-bottom: 40px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
@include mobile {
flex-direction: column;
}
}
.default-layout__footer-link {
color: #606060;
text-decoration: none;
flex-shrink: 0;
margin: 10px;
transition: 100ms linear color;
&:hover {
color: $blue;
}
}
</style>
<script>
import { footer } from "@/assets/js/footer";
import KApp from "kiste/components/KApp";
import KFooter from "kiste/components/KFooter";
export default {
name: "DefaultLayout",
components: {},
footer
components: { KApp, KFooter }
};
</script>

View file

@ -1,5 +1,7 @@
<template>
<KApp>
<nuxt/>
</KApp>
</template>
<style>
@ -7,7 +9,10 @@
</style>
<script>
import KApp from "kiste/components/KApp";
export default {
name: "NoneLayout"
name: "WithoutFooterLayout",
components: { KApp }
};
</script>

View file

@ -17,7 +17,7 @@ export default {
** Global CSS
*/
css: [
"@/assets/css/global.scss"
"@/assets/global.scss"
],
/*
** Plugins to load before mounting the App
@ -30,7 +30,8 @@ export default {
*/
buildModules: [
// Doc: https://github.com/nuxt-community/eslint-module
"@nuxtjs/eslint-module"
"@nuxtjs/eslint-module",
"kiste/nuxt"
],
/*
** Nuxt.js modules
@ -40,6 +41,32 @@ export default {
"@nuxtjs/pwa"
],
kiste: {
theme: {
contentPadding: "10px"
},
navigationItems: [
{
label: "Home",
to: "/"
},
{
label: "Projects",
to: "/projects"
}
],
footerItems: [
{
label: "Legal Notice",
to: "/legal-notice"
},
{
label: "Privacy Policy",
to: "/privacy-policy"
}
]
},
// https://pwa.nuxtjs.org/modules/workbox.html
workbox: {
workboxExtensions: [

View file

@ -23,6 +23,7 @@
"eslint-plugin-nuxt": ">=0.4.2",
"eslint-plugin-vue": "^6.0.1",
"fibers": "^4.0.2",
"kiste": "^1.2.0",
"sass": "^1.23.7",
"sass-loader": "^8.0.0",
"serve": "^11.2.0",

View file

@ -1,6 +1,6 @@
<template>
<div class="index-page">
<NavigationBar show-background/>
<KNavigationBar/>
<AnimatedLogo/>
<main class="index-page__content">
<div class="index-page__name">
@ -21,22 +21,12 @@
</a>
</div>
</main>
<footer class="index-page__footer">
<nuxt-link
v-for="link in $options.footer"
:key="link.to"
class="index-page__footer-link"
:to="link.to"
>
{{ link.label }}
</nuxt-link>
</footer>
<KFooter class="index-page__footer"/>
</div>
</template>
<style scoped lang="scss">
@import "~@/assets/css/variables";
@import "~@/assets/css/mobile";
@use "~kiste/css/mixins/screenSize";
.index-page {
display: flex;
@ -44,7 +34,7 @@
align-items: center;
flex-direction: column;
height: 100vh;
height: calc(100vh - var(--x-navbar-height));
}
.index-page__name {
@ -93,56 +83,36 @@
.index-page__footer {
position: absolute;
top: 100vh;
left: 0;
right: 0;
padding: 20px 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-bottom: 10px;
@include notMobile {
@include screenSize.notMobile {
top: unset;
bottom: 0;
right: 0;
width: fit-content;
padding: 20px;
margin: 0;
flex-direction: row;
}
}
.index-page__footer-link {
color: #606060;
text-decoration: none;
flex-shrink: 0;
margin: 0 10px;
transition: 100ms linear color;
&:hover {
color: $blue;
}
}
</style>
<script>
import KNavigationBar from "kiste/components/KNavigationBar";
import KFooter from "kiste/components/KFooter";
import AnimatedLogo from "../components/AnimatedLogo";
import GitHubIcon from "@/assets/icons/github.svg";
import TwitterIcon from "@/assets/icons/twitter.svg";
import InstagramIcon from "@/assets/icons/instagram.svg";
import EmailIcon from "@/assets/icons/email.svg";
import NavigationBar from "@/components/NavigationBar";
import { footer } from "@/assets/js/footer";
export default {
name: "IndexPage",
layout: "none",
components: { NavigationBar, AnimatedLogo, GitHubIcon, TwitterIcon, InstagramIcon, EmailIcon },
footer
components: { AnimatedLogo, GitHubIcon, TwitterIcon, InstagramIcon, EmailIcon, KNavigationBar, KFooter }
};
</script>

View file

@ -1,6 +1,7 @@
<template>
<div class="legal-notice-page">
<NavigationBar show-background title="Legal Notice"/>
<KNavigationBar title="Legal Notice"/>
<div class="content">
<h1 class="heading--1">
Legal Notice
</h1>
@ -62,18 +63,15 @@
target="_blank"
>Erstellt mit kostenlosem Datenschutz-Generator.de von Dr. Thomas Schwenke</a>
</div>
</div>
</template>
<style scoped lang="scss">
</style>
<script>
import NavigationBar from "@/components/NavigationBar";
import KNavigationBar from "kiste/components/KNavigationBar";
export default {
name: "LegalNoticePage",
components: { NavigationBar },
components: { KNavigationBar },
head: {
htmlAttrs: {
lang: "de"

View file

@ -1,6 +1,7 @@
<template>
<div class="privacy-policy-page">
<NavigationBar show-background title="Datenschutzerklärung"/>
<KNavigationBar title="Datenschutzerklärung"/>
<div class="content">
<h1 class="heading--1">
Datenschutzerklärung
</h1>
@ -34,7 +35,8 @@
</li>
</ul>
<p class="paragraph">
Sofern Sie uns eine Einwilligung erteilt haben, können Sie diese jederzeit mit Wirkung für die Zukunft widerrufen.
Sofern Sie uns eine Einwilligung erteilt haben, können Sie diese jederzeit mit Wirkung für die Zukunft
widerrufen.
</p>
<p class="paragraph">
Sie können sich jederzeit mit einer Beschwerde an eine Aufsichtsbehörde wenden, z. B. an die zuständige
@ -43,7 +45,7 @@
</p>
<p class="paragraph">
Eine Liste der Aufsichtsbehörden (für den nichtöffentlichen Bereich) mit Anschrift finden Sie unter:
<ExternalLink href="https://www.bfdi.bund.de/DE/Infothek/Anschriften_Links/anschriften_links-node.html"/>.
<KExternalLink href="https://www.bfdi.bund.de/DE/Infothek/Anschriften_Links/anschriften_links-node.html"/>.
</p>
<h2 class="heading--2">
Erfassung allgemeiner Informationen beim Besuch unserer Website
@ -67,8 +69,9 @@
<li>zu weiteren administrativen Zwecken.</li>
</ul>
<p class="paragraph">
Wir verwenden Ihre Daten nicht, um Rückschlüsse auf Ihre Person zu ziehen. Informationen dieser Art werden von uns
ggfs. statistisch ausgewertet, um unseren Internetauftritt und die dahinterstehende Technik zu optimieren.
Wir verwenden Ihre Daten nicht, um Rückschlüsse auf Ihre Person zu ziehen. Informationen dieser Art werden von
uns ggfs. statistisch ausgewertet, um unseren Internetauftritt und die dahinterstehende Technik zu
optimieren.
</p>
<h3 class="heading--3">
Rechtsgrundlage
@ -88,17 +91,18 @@
Speicherdauer
</h3>
<p class="paragraph">
Die Daten werden gelöscht, sobald diese für den Zweck der Erhebung nicht mehr erforderlich sind. Dies ist für die
Daten, die der Bereitstellung der Webseite dienen, grundsätzlich der Fall, wenn die jeweilige Sitzung beendet ist.
Die Daten werden gelöscht, sobald diese für den Zweck der Erhebung nicht mehr erforderlich sind. Dies ist für
die Daten, die der Bereitstellung der Webseite dienen, grundsätzlich der Fall, wenn die jeweilige Sitzung
beendet ist.
</p>
<h3 class="heading--3">
Bereitstellung vorgeschrieben oder erforderlich
</h3>
<p class="paragraph">
Die Bereitstellung der vorgenannten personenbezogenen Daten ist weder gesetzlich noch vertraglich vorgeschrieben.
Ohne die IP-Adresse ist jedoch der Dienst und die Funktionsfähigkeit unserer Website nicht gewährleistet. Zudem
können einzelne Dienste und Services nicht verfügbar oder eingeschränkt sein. Aus diesem Grund ist ein Widerspruch
ausgeschlossen.
Die Bereitstellung der vorgenannten personenbezogenen Daten ist weder gesetzlich noch vertraglich
vorgeschrieben. Ohne die IP-Adresse ist jedoch der Dienst und die Funktionsfähigkeit unserer Website nicht
gewährleistet. Zudem können einzelne Dienste und Services nicht verfügbar oder eingeschränkt sein. Aus diesem
Grund ist ein Widerspruch ausgeschlossen.
</p>
<h2 class="heading--2">
Verwendung von Scriptbibliotheken (Google Webfonts)
@ -113,14 +117,14 @@
</p>
<p class="paragraph">
Die Datenschutzrichtlinie des Bibliothekbetreibers Google finden Sie hier:
<ExternalLink href="https://www.google.com/policies/privacy/"/>
<KExternalLink href="https://www.google.com/policies/privacy/"/>
</p>
<h3 class="heading--3">
Rechtsgrundlage
</h3>
<p class="paragraph">
Rechtsgrundlage für die Einbindung von Google Webfonts und dem damit verbundenen Datentransfer zu Google ist Ihre
Einwilligung (Art. 6 Abs. 1 lit. a DSGVO).
Rechtsgrundlage für die Einbindung von Google Webfonts und dem damit verbundenen Datentransfer zu Google ist
Ihre Einwilligung (Art. 6 Abs. 1 lit. a DSGVO).
</p>
<h3 class="heading--3">
Empfänger
@ -138,15 +142,15 @@
</p>
<p class="paragraph">
Weitere Informationen zu Google Web Fonts finden Sie unter
<ExternalLink href="https://developers.google.com/fonts/faq"/> und in der Datenschutzerklärung von Google:
<ExternalLink href="https://www.google.com/policies/privacy/"/>.
<KExternalLink href="https://developers.google.com/fonts/faq"/> und in der Datenschutzerklärung von Google:
<KExternalLink href="https://www.google.com/policies/privacy/"/>.
</p>
<h3 class="heading--3">
Drittlandtransfer
</h3>
<p class="paragraph">
Google verarbeitet Ihre Daten in den USA und hat sich dem EU_US Privacy Shield unterworfen
<ExternalLink href="https://www.privacyshield.gov/EU-US-Framework"/>.
<KExternalLink href="https://www.privacyshield.gov/EU-US-Framework"/>.
</p>
<h3 class="heading--3">
Bereitstellung vorgeschrieben oder erforderlich
@ -160,9 +164,9 @@
</h3>
<p class="paragraph">
Zur Darstellung der Inhalte wird regelmäßig die Programmiersprache JavaScript verwendet. Sie können der
Datenverarbeitung daher widersprechen, indem Sie die Ausführung von JavaScript in Ihrem Browser deaktivieren oder
einen JavaScript-Blocker installieren. Bitte beachten Sie, dass es hierdurch zu Funktionseinschränkungen auf der
Website kommen kann.
Datenverarbeitung daher widersprechen, indem Sie die Ausführung von JavaScript in Ihrem Browser deaktivieren
oder einen JavaScript-Blocker installieren. Bitte beachten Sie, dass es hierdurch zu Funktionseinschränkungen
auf der Website kommen kann.
</p>
<h2 class="heading--2">
Eingebettete YouTube-Videos
@ -171,11 +175,11 @@
Art und Zweck der Verarbeitung
</h3>
<p class="paragraph">
Auf einigen unserer Webseiten betten wir YouTube-Videos ein. Betreiber der entsprechenden Plugins ist die YouTube,
LLC, 901 Cherry Ave., San Bruno, CA 94066, USA (nachfolgend YouTube). Wenn Sie eine Seite mit dem YouTube-Plugin
besuchen, wird eine Verbindung zu Servern von YouTube hergestellt. Dabei wird YouTube mitgeteilt, welche Seiten
Sie besuchen. Wenn Sie in Ihrem YouTube-Account eingeloggt sind, kann YouTube Ihr Surfverhalten Ihnen persönlich
zuzuordnen. Dies verhindern Sie, indem Sie sich vorher aus Ihrem YouTube-Account ausloggen.
Auf einigen unserer Webseiten betten wir YouTube-Videos ein. Betreiber der entsprechenden Plugins ist die
YouTube, LLC, 901 Cherry Ave., San Bruno, CA 94066, USA (nachfolgend YouTube). Wenn Sie eine Seite mit dem
YouTube-Plugin besuchen, wird eine Verbindung zu Servern von YouTube hergestellt. Dabei wird YouTube mitgeteilt,
welche Seiten Sie besuchen. Wenn Sie in Ihrem YouTube-Account eingeloggt sind, kann YouTube Ihr Surfverhalten
Ihnen persönlich zuzuordnen. Dies verhindern Sie, indem Sie sich vorher aus Ihrem YouTube-Account ausloggen.
</p>
<p class="paragraph">
Wird ein YouTube-Video gestartet, setzt der Anbieter Cookies ein, die Hinweise über das Nutzerverhalten sammeln.
@ -184,8 +188,8 @@
Weitere Informationen zu Zweck und Umfang der Datenerhebung und ihrer Verarbeitung durch YouTube erhalten Sie in
den Datenschutzerklärungen des Anbieters, Dort erhalten Sie auch weitere Informationen zu Ihren diesbezüglichen
Rechten und Einstellungsmöglichkeiten zum Schutze Ihrer Privatsphäre
(<ExternalLink href="https://policies.google.com/privacy"/>). Google verarbeitet Ihre Daten in den USA und hat
sich dem EU-US Privacy Shield unterworfen <ExternalLink href="https://www.privacyshield.gov/EU-US-Framework"/>.
(<KExternalLink href="https://policies.google.com/privacy"/>). Google verarbeitet Ihre Daten in den USA und hat
sich dem EU-US Privacy Shield unterworfen <KExternalLink href="https://www.privacyshield.gov/EU-US-Framework"/>.
</p>
<h3 class="heading--3">
Rechtsgrundlage
@ -211,14 +215,14 @@
</p>
<p class="paragraph">
Weitere Informationen zum Datenschutz bei YouTube finden Sie in der Datenschutzerklärung des Anbieters unter:
<ExternalLink href="https://www.google.de/intl/de/policies/privacy/"/>
<KExternalLink href="https://www.google.de/intl/de/policies/privacy/"/>
</p>
<h3 class="heading--3">
Drittlandtransfer
</h3>
<p class="paragraph">
Google verarbeitet Ihre Daten in den USA und hat sich dem EU_US Privacy Shield unterworfen
<ExternalLink href="https://www.privacyshield.gov/EU-US-Framework"/>.
<KExternalLink href="https://www.privacyshield.gov/EU-US-Framework"/>.
</p>
<h3 class="heading--3">
Bereitstellung vorgeschrieben oder erforderlich
@ -246,8 +250,8 @@
Fragen an den Datenschutzbeauftragten
</h2>
<p class="paragraph">
Wenn Sie Fragen zum Datenschutz haben, schreiben Sie uns bitte eine E-Mail oder wenden Sie sich direkt an die für
den Datenschutz verantwortliche Person:
Wenn Sie Fragen zum Datenschutz haben, schreiben Sie uns bitte eine E-Mail oder wenden Sie sich direkt an die
für den Datenschutz verantwortliche Person:
</p>
<p class="paragraph">
Moritz Ruth<br>
@ -263,12 +267,14 @@
</p>
<p class="paragraph">
Die Datenschutzerklärung wurde mithilfe der activeMind AG erstellt, den Experten für
<ExternalLink
<KExternalLink
href="https://www.activemind.de/datenschutz/datenschutzhinweis-generator/"
label="externe Datenschutzbeauftragte"
/> (Version #2019-04-10).
>
externe Datenschutzbeauftragte
</KExternalLink> (Version #2019-04-10).
</p>
</div>
</div>
</template>
<style scoped lang="scss">
@ -276,12 +282,12 @@
</style>
<script>
import NavigationBar from "@/components/NavigationBar";
import ExternalLink from "@/components/ExternalLink";
import KNavigationBar from "kiste/components/KNavigationBar";
import KExternalLink from "kiste/components/KExternalLink";
export default {
name: "PrivacyPolicyPage",
components: { ExternalLink, NavigationBar },
components: { KNavigationBar, KExternalLink },
head: {
htmlAttrs: {
lang: "de"

View file

@ -1,6 +1,7 @@
<template>
<div class="projects-page">
<NavigationBar show-background title="Projects"/>
<KNavigationBar title="Projects"/>
<div class="content">
<h1 class="heading--1">
Projects
</h1>
@ -31,6 +32,7 @@
A pretty console logging library for printing grouped messages with Node.js.
</GProject>
</div>
</div>
</template>
<style scoped lang="scss">
@ -38,11 +40,11 @@
</style>
<script>
import NavigationBar from "@/components/NavigationBar";
import KNavigationBar from "kiste/components/KNavigationBar";
import GProject from "@/components/pages/projects/GProject";
export default {
name: "ProjectsPage",
components: { GProject, NavigationBar }
components: { GProject, KNavigationBar }
};
</script>

View file

@ -2043,6 +2043,13 @@ chownr@^1.1.1, chownr@^1.1.2:
resolved "https://registry.yarnpkg.com/chownr/-/chownr-1.1.3.tgz#42d837d5239688d55f303003a508230fa6727142"
integrity sha512-i70fVHhmV3DtTl6nqvZOnIjbY0Pe4kAUjwHj8z0zAdgBtYrJyYwLKCCuRBQ5ppkyL0AkN7HKRnETdmdp1zqNXw==
chroma-js@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/chroma-js/-/chroma-js-2.1.0.tgz#c0be48a21fe797ef8965608c1c4f911ef2da49d5"
integrity sha512-uiRdh4ZZy+UTPSrAdp8hqEdVb1EllLtTHOt5TMaOjJUvi+O54/83Fc5K2ld1P+TJX+dw5B+8/sCgzI6eaur/lg==
dependencies:
cross-env "^6.0.3"
chrome-trace-event@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/chrome-trace-event/-/chrome-trace-event-1.0.2.tgz#234090ee97c7d4ad1a2c4beae27505deffc608a4"
@ -2434,6 +2441,13 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4:
safe-buffer "^5.0.1"
sha.js "^2.4.8"
cross-env@^6.0.3:
version "6.0.3"
resolved "https://registry.yarnpkg.com/cross-env/-/cross-env-6.0.3.tgz#4256b71e49b3a40637a0ce70768a6ef5c72ae941"
integrity sha512-+KqxF6LCvfhWvADcDPqo64yVIB31gv/jQulX2NGzKS/g3GEVz6/pt4wjHFtFWsHMddebWD/sDthJemzM4MaAag==
dependencies:
cross-spawn "^7.0.0"
cross-spawn@^5.0.1:
version "5.1.0"
resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449"
@ -4640,6 +4654,17 @@ kind-of@^6.0.0, kind-of@^6.0.2:
resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-6.0.2.tgz#01146b36a6218e64e58f3a8d66de5d7fc6f6d051"
integrity sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA==
kiste@^1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/kiste/-/kiste-1.2.0.tgz#d3c78fa9e3135d97e7a5fb760c8b491f08653efe"
integrity sha512-/K5hIpQaa9bOI6Z3oYxkBz1hJyjRn7Pv2j5BTE7gDYPnurCmskmceBPZTb/BvicnEWnwh0c07JPydAK+vJv+UQ==
dependencies:
chroma-js "^2.1.0"
lodash.defaultsdeep "^4.6.1"
lodash.kebabcase "^4.1.1"
lodash.mapvalues "^4.6.0"
vue-ripple-directive "^2.0.1"
last-call-webpack-plugin@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/last-call-webpack-plugin/-/last-call-webpack-plugin-3.0.0.tgz#9742df0e10e3cf46e5c0381c2de90d3a7a2d7555"
@ -4761,7 +4786,7 @@ lodash.camelcase@^4.1.1:
resolved "https://registry.yarnpkg.com/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz#b28aa6288a2b9fc651035c7711f65ab6190331a6"
integrity sha1-soqmKIorn8ZRA1x3EfZathkDMaY=
lodash.defaultsdeep@^4.6.0:
lodash.defaultsdeep@^4.6.0, lodash.defaultsdeep@^4.6.1:
version "4.6.1"
resolved "https://registry.yarnpkg.com/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.1.tgz#512e9bd721d272d94e3d3a63653fa17516741ca6"
integrity sha512-3j8wdDzYuWO3lM3Reg03MuQR957t287Rpcxp1njpEa8oDrikb+FwGdW3n+FELh/A6qib6yPit0j/pv9G/yeAqA==
@ -4776,6 +4801,11 @@ lodash.kebabcase@^4.0.1, lodash.kebabcase@^4.1.1:
resolved "https://registry.yarnpkg.com/lodash.kebabcase/-/lodash.kebabcase-4.1.1.tgz#8489b1cb0d29ff88195cceca448ff6d6cc295c36"
integrity sha1-hImxyw0p/4gZXM7KRI/21swpXDY=
lodash.mapvalues@^4.6.0:
version "4.6.0"
resolved "https://registry.yarnpkg.com/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz#1bafa5005de9dd6f4f26668c30ca37230cc9689c"
integrity sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw=
lodash.memoize@^4.1.2:
version "4.1.2"
resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"