diff --git a/components/Sidebar.vue b/components/Sidebar.vue index f47f40d..a7b317c 100644 --- a/components/Sidebar.vue +++ b/components/Sidebar.vue @@ -4,6 +4,11 @@ template(v-for='category in categories') //- nuxt-link(:to='$i18n.path(category.slug)') {{ category.title }} nuxt-link(:to='category.slug') {{ category.title }} + hr + nuxt-link(to='privacy-policy') Privacy Policy + nuxt-link(to='cookie-policy') Cookie Policy + nuxt-link(to='imprint') Imprint + hr div(class="toggleWrapper" @click="toggleCardsVisible") div(class="viewToggle" :class="{active: areCardsVisible}") Cards div(class="viewToggle" :class="{active: !areCardsVisible}") Table @@ -58,6 +63,7 @@ export default { border-style: solid; border-radius: 0.25rem; overflow: hidden; + margin: 1rem auto; } .viewToggle { padding: 0 0.2rem; @@ -67,6 +73,10 @@ export default { background-color: #08e5ff; color: #232331; } + hr { + width: 80%; + background-color: #08e5ff; + } } @media (max-width: 400px) { diff --git a/layouts/default.vue b/layouts/default.vue index e39a6da..d560dd2 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -3,7 +3,14 @@ Github Logo Sidebar + no-ssr + template(v-if="showNotice") + .cookie + p This site uses cookies, please read our  + nuxt-link.highlighted.highlighted__inverted(to="privacy-policy") Privacy policy. + button(@click.preventDefault="hideCookieNotice") X nuxt.content + @@ -59,7 +92,7 @@ a { text-decoration: underline; } -h1, p { +h1, h2, p, ol, i, small { color: white; } @@ -142,6 +175,46 @@ h1 { } } +.highlighted { + text-decoration: none; + background-color: #08e5ff; + color: #212121; + padding: 0 5px; + border-radius: .1rem; + + &:hover { + background-color: #008190; + color: white; + } + + &__inverted{ + background-color: #232331; + color: #08e5ff; + border-radius: .2rem; + } +} + +.cookie { + position: fixed; + margin: 1rem; + bottom: 0; + left: 0; + background-color: #08e5ff; + padding: 0 1rem; + border-radius: .3rem; + + p { + color: #212121; + font-size: 12px; + } + + button { + background: none; + border: none; + margin-left: .8rem; + } +} + // #232331 dark bg // #2D3748 ligher cards diff --git a/package.json b/package.json index 3ec9d5f..4e04a27 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "webgems", "version": "1.0.0", - "description": "webgems for devs and designers ", + "description": "Webgems is a goto place for devs and designers to find new resources and more.", "author": "lost.design", "private": true, "scripts": { diff --git a/pages/cookie-policy.vue b/pages/cookie-policy.vue new file mode 100644 index 0000000..3b4b12e --- /dev/null +++ b/pages/cookie-policy.vue @@ -0,0 +1,46 @@ + + + \ No newline at end of file diff --git a/pages/imprint.vue b/pages/imprint.vue new file mode 100644 index 0000000..54784c0 --- /dev/null +++ b/pages/imprint.vue @@ -0,0 +1,27 @@ + + + \ No newline at end of file diff --git a/pages/privacy-policy.vue b/pages/privacy-policy.vue new file mode 100644 index 0000000..6bedfc8 --- /dev/null +++ b/pages/privacy-policy.vue @@ -0,0 +1,88 @@ + + + + + \ No newline at end of file