Merge pull request #198 from webgems/features/gpdr

📚 Add privacy/cookie policy, Disclaimer and TMG§5 notice about the imprint
This commit is contained in:
wellá
2019-10-25 11:22:03 +02:00
committed by GitHub
7 changed files with 272 additions and 2 deletions

View File

@@ -0,0 +1,3 @@
<template lang="pug">
iframe(style="border: 0; width: 100%; border-radius: 3px; font-family:Poppins,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;" src="https://stats.lost.services/index.php?module=CoreAdminHome&action=optOut&language=en&backgroundColor=08e5ff&fontColor=212121&fontSize=&fontFamily=Poppins")
</template>

View File

@@ -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) {

View File

@@ -3,7 +3,14 @@
Github
Logo
Sidebar
no-ssr
template(v-if="showNotice")
.cookie
p This site uses cookies, please read our&nbsp;
nuxt-link.highlighted(to="privacy-policy") Privacy policy.
button(@click.preventDefault="hideCookieNotice") X
nuxt.content
</template>
<script>
@@ -19,6 +26,32 @@ export default {
Search,
Sidebar,
},
data() {
return {
showNotice: false,
}
},
beforeMount() {
this.checkCookieNoticeHidden()
},
methods: {
hideCookieNotice() {
if(typeof(Storage) !== 'undefined'){
localStorage.setItem('cookieNoticeHidden', true)
this.showNotice = false
}
},
checkCookieNoticeHidden() {
if(typeof(Storage) !== 'undefined'){
let cookieNotice = localStorage.getItem('cookieNoticeHidden')
if(cookieNotice) {
this.showNotice = false
} else {
this.showNotice = true
}
}
},
},
}
</script>
@@ -59,7 +92,7 @@ a {
text-decoration: underline;
}
h1, p {
h1, h2, p, ol, i, small {
color: white;
}
@@ -140,6 +173,54 @@ h1 {
'sidebar'
'content';
}
hr {
display: none;
}
}
.highlighted {
text-decoration: none;
background-color: #08e5ff;
color: #212121;
padding: 0 5px;
border-radius: .1rem;
&:hover {
background-color: #008190;
color: white;
}
}
.cookie {
position: fixed;
margin: 1rem;
bottom: 0;
left: 0;
background-color: #232331;
padding: 0 1rem;
border-radius: .3rem;
box-shadow:inset 0px 0px 0px 2px #08e5ff;
p {
font-size: 12px;
margin-left: 1.2rem;
&::before {
content: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHZlcnNpb249IjEuMSIgZmlsbD0iIzA4ZTVmZiI+PGcgaWQ9InN1cmZhY2UxIiBmaWxsPSIjMDhlNWZmIj48cGF0aCBzdHlsZT0iICIgZD0iTSAxNC41IDAgQyAxMC41MzEyNSAwIDcuMTYwMTU2IDIuMzk4NDM4IDUuNzE4NzUgNS43ODEyNSBDIDIuMzU5Mzc1IDcuMjQ2MDk0IDAgMTAuNjA5Mzc1IDAgMTQuNSBDIDAgMTkuNzM0Mzc1IDQuMjY1NjI1IDI0IDkuNSAyNCBDIDEzLjM5MDYyNSAyNCAxNi43NTM5MDYgMjEuNjQwNjI1IDE4LjIxODc1IDE4LjI4MTI1IEMgMjEuNjAxNTYzIDE2LjgzOTg0NCAyNCAxMy40Njg3NSAyNCA5LjUgQyAyNCA0LjI2MTcxOSAxOS43MzgyODEgMCAxNC41IDAgWiBNIDE0LjUgMiBDIDE4LjY2MDE1NiAyIDIyIDUuMzM5ODQ0IDIyIDkuNSBDIDIyIDEyLjA0Njg3NSAyMC43Njk1MzEgMTQuMjM4MjgxIDE4LjkwNjI1IDE1LjU5Mzc1IEMgMTguOTQ5MjE5IDE1LjIzNDM3NSAxOSAxNC44NzEwOTQgMTkgMTQuNSBDIDE5IDExLjU3MDMxMyAxNy42NTYyNSA4Ljk2NDg0NCAxNS41NjI1IDcuMjE4NzUgQyAxNS44MjgxMjUgNi44Nzg5MDYgMTYgNi40NjA5MzggMTYgNiBDIDE2IDQuODk0NTMxIDE1LjEwNTQ2OSA0IDE0IDQgQyAxMy4xMTMyODEgNCAxMi4zNTU0NjkgNC41NzQyMTkgMTIuMDkzNzUgNS4zNzUgQyAxMS4yNjU2MjUgNS4xMzY3MTkgMTAuNDAyMzQ0IDUgOS41IDUgQyA5LjEyODkwNiA1IDguNzY1NjI1IDUuMDUwNzgxIDguNDA2MjUgNS4wOTM3NSBDIDkuNzYxNzE5IDMuMjMwNDY5IDExLjk1MzEyNSAyIDE0LjUgMiBaIE0gMTkgNSBDIDE4LjQ0OTIxOSA1IDE4IDUuNDQ5MjE5IDE4IDYgQyAxOCA2LjU1MDc4MSAxOC40NDkyMTkgNyAxOSA3IEMgMTkuNTUwNzgxIDcgMjAgNi41NTA3ODEgMjAgNiBDIDIwIDUuNDQ5MjE5IDE5LjU1MDc4MSA1IDE5IDUgWiBNIDkuNSA3IEMgMTMuNjUyMzQ0IDcgMTcgMTAuMzQ3NjU2IDE3IDE0LjUgQyAxNyAxNS4zNTkzNzUgMTYuODU5Mzc1IDE2LjE5OTIxOSAxNi41OTM3NSAxNi45Njg3NSBDIDE2LjU4MjAzMSAxNyAxNi41NzAzMTMgMTcuMDMxMjUgMTYuNTYyNSAxNy4wNjI1IEMgMTUuNTIzNDM4IDE5Ljk1NzAzMSAxMi43NTc4MTMgMjIgOS41IDIyIEMgNS4zNDc2NTYgMjIgMiAxOC42NTIzNDQgMiAxNC41IEMgMiAxMS4zMzU5MzggMy45MjU3ODEgOC42MzY3MTkgNi42ODc1IDcuNTMxMjUgQyA2Ljc1IDcuNTE1NjI1IDYuODE2NDA2IDcuNDk2MDk0IDYuODc1IDcuNDY4NzUgQyA3LjY4NzUgNy4xNjc5NjkgOC41ODIwMzEgNyA5LjUgNyBaIE0gMTkuNSA4IEMgMTguNjcxODc1IDggMTggOC42NzE4NzUgMTggOS41IEMgMTggMTAuMzI4MTI1IDE4LjY3MTg3NSAxMSAxOS41IDExIEMgMjAuMzI4MTI1IDExIDIxIDEwLjMyODEyNSAyMSA5LjUgQyAyMSA4LjY3MTg3NSAyMC4zMjgxMjUgOCAxOS41IDggWiBNIDcgMTAgQyA1Ljg5NDUzMSAxMCA1IDEwLjg5NDUzMSA1IDEyIEMgNSAxMy4xMDU0NjkgNS44OTQ1MzEgMTQgNyAxNCBDIDguMTA1NDY5IDE0IDkgMTMuMTA1NDY5IDkgMTIgQyA5IDEwLjg5NDUzMSA4LjEwNTQ2OSAxMCA3IDEwIFogTSAxMiAxMCBDIDExLjQ0OTIxOSAxMCAxMSAxMC40NDkyMTkgMTEgMTEgQyAxMSAxMS41NTA3ODEgMTEuNDQ5MjE5IDEyIDEyIDEyIEMgMTIuNTUwNzgxIDEyIDEzIDExLjU1MDc4MSAxMyAxMSBDIDEzIDEwLjQ0OTIxOSAxMi41NTA3ODEgMTAgMTIgMTAgWiBNIDEzLjUgMTMgQyAxMi42NzE4NzUgMTMgMTIgMTMuNjcxODc1IDEyIDE0LjUgQyAxMiAxNS4zMjgxMjUgMTIuNjcxODc1IDE2IDEzLjUgMTYgQyAxNC4zMjgxMjUgMTYgMTUgMTUuMzI4MTI1IDE1IDE0LjUgQyAxNSAxMy42NzE4NzUgMTQuMzI4MTI1IDEzIDEzLjUgMTMgWiBNIDYgMTYgQyA1LjQ0OTIxOSAxNiA1IDE2LjQ0OTIxOSA1IDE3IEMgNSAxNy41NTA3ODEgNS40NDkyMTkgMTggNiAxOCBDIDYuNTUwNzgxIDE4IDcgMTcuNTUwNzgxIDcgMTcgQyA3IDE2LjQ0OTIxOSA2LjU1MDc4MSAxNiA2IDE2IFogTSAxMCAxOCBDIDkuNDQ5MjE5IDE4IDkgMTguNDQ5MjE5IDkgMTkgQyA5IDE5LjU1MDc4MSA5LjQ0OTIxOSAyMCAxMCAyMCBDIDEwLjU1MDc4MSAyMCAxMSAxOS41NTA3ODEgMTEgMTkgQyAxMSAxOC40NDkyMTkgMTAuNTUwNzgxIDE4IDEwIDE4IFogIiBmaWxsPSIjMDhlNWZmIi8+PC9nPjwvc3ZnPgo=');
width: 18px;
height: 18px;
display: block;
margin-left: -1.5rem;
margin-bottom: -1.1rem;
}
}
button {
color: #fff;
background: none;
border: none;
margin-left: .8rem;
}
}

View File

@@ -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": {

56
pages/cookie-policy.vue Normal file
View File

@@ -0,0 +1,56 @@
<template lang="pug">
main
h1 Our Cookie Policy
p We believe in being transparent about how we collect and use data. This policy provides information about how and when we use cookies for these purposes. Capitalized terms used in this policy but not defined have the meaning set forth in our&nbsp;
nuxt-link.highlighted(to="privacy-policy") Privacy Policy
| &nbsp;which also includes additional details about the collection and use of information at webgems.
h2 What Is A Cookie?
p Cookies are small text files sent by us to your computer or mobile device, which enables webgems features and functionality. They are unique to your account or your browser. Session-based cookies last only while your browser is open and are automatically deleted when you close your browser. Persistent cookies last until you or your browser delete them or until they expire.
p To find out more about cookies, visit&nbsp;
a.highlighted(href="https://www.allaboutcookies.org/") this
| &nbsp;site.
h2 Does Webgems Use Cookies?
p Yes, unless your browser has "Do Not Track" enabled. Matomo creates a persistent cookie inside your browser which contains a Session ID. This Session ID is being used to analyze the usage of our website. No further cookies are created by webgems.
h2 How Can You Get Rid Of Cookies?
p Browser manufacturers provide help pages relating to cookie management in their products. Please see below for more information.
ul
li
a(href="https://support.google.com/chrome/answer/95647?hl=en-GB", title="Google Chrome") Google Chrome
li
a(href="https://support.apple.com/en-us/guide/safari/manage-cookies-and-website-data-sfri11471/mac", title="Google Chrome") Safari Desktop
li
a(href="https://support.apple.com/en-us/HT201265", title="Google Chrome") Safari Mobile
li
a(href="https://support.mozilla.org/en-US/kb/cookies-information-websites-store-on-your-computer", title="Google Chrome") Mozilla Firefox
li
a(href="http://support.google.com/ics/nexus/bin/answer.py?hl=en&answer=2425067", title="Google Chrome") Android
li
a(href="https://support.microsoft.com/en-us/kb/260971", title="Google Chrome") Internet Explorer
h2 Opt Out From Tracking
OptOutIframe
</template>
<script>
import OptOutIframe from '@/components/OptOutIframe.vue'
export default {
components: {
OptOutIframe,
},
}
</script>
<style lang="scss" scoped>
h2 {
margin-top: 2rem;
margin-bottom: 0.5rem;
}
p {
margin-top: 0;
}
</style>

27
pages/imprint.vue Normal file
View File

@@ -0,0 +1,27 @@
<template lang="pug">
div
h1 Imprint
p Webgems.io is a project of&nbsp;
a.highlighted(href="https://lost.design", title="Visit lost.design") www.lost.design
h2 Contact
p
a(href="mailto:hello@webgems.io", title="Write webgems an email") hello@webgems.io
h2 Disclaimer
small Last updated: October 24, 2019
p Disclosures in accordance with § 5 TMG (Telemediengesetz) do not apply, as this is an open source project that is not comercially operated.
p The information contained on webgems.io website (the "Service") is for general information purposes only. Webgems assumes no responsibility for errors or omissions in the contents on the Service. In no event shall webgems be liable for any special, direct, indirect, consequential, or incidental damages or any damages whatsoever, whether in an action of contract, negligence or other tort, arising out of or in connection with the use of the Service or the contents of the Service.
p Webgems reserves the right to make additions, deletions, or modification to the contents on the Service at any time without prior notice. Webgems does not warrant that the website is free of viruses or other harmful components.
p This website may contain links to external websites that are not provided or maintained by or in any way affiliated with webgems. Please note that the webgems does not guarantee the accuracy, relevance, timeliness, or completeness of any information on these external websites.
</template>
<style lang="scss" scoped>
h2 {
margin-top: 2rem;
margin-bottom: 0.5rem;
}
p {
margin-top: 0;
}
</style>

93
pages/privacy-policy.vue Normal file
View File

@@ -0,0 +1,93 @@
<template lang="pug">
main
h1 Our Privacy Policy
p This Privacy Policy describes how webgems collects, uses and discloses information, and what choices you have with respect to the information. We respect the Browser's "Do Not Track" feature, you won't be affected by this policy if enabled.
h2 Information We Collect
p This website uses the web analysis service software Matomo (www.matomo.org), a service of the provider InnoCraft Ltd., 150 Willis St, 6011 Wellington, New Zealand, (Matomo) to collect and store data based on our legitimate interest in the statistical analysis of the user behavior for optimization and marketing purposes as per article 6(1) lit. f GDPR.
p This data can be used to create and evaluate pseudonymized usage profiles for the same purpose. For this purpose, cookies may be used. The data collected with the Matomo technology (including its pseudonymized IP address) is processed on servers, which are hosted by Contabo GmbH.
p Contabo GmbH does not have access to the servers nor the data that is processed (§ 6 Server-administration, Contabo's Terms & Conditions). For more information visit&nbsp;
a.highlighted(href="https://contabo.com/agb.html") Contabo's Terms & Conditions.
p The information generated by the cookie in the pseudonymous user profile will not be used to personally identify the visitor to this website and will not be combined with personal data about the bearer of the pseudonym.
h2 Proccessed Data
p The following information is processed when visiting webgems:
ol(type="I")
li
strong Cookie Information.&nbsp;
| Webgems uses cookies on this website that are necessary for Matomo's analytics. The Websites and Services we provide, do not include cookies and similar tracking technologies of third parties. For more details about how we use these technologies, please see our&nbsp;
nuxt-link.highlighted(to="cookie-policy") Cookie Policy.
li
strong Log data.&nbsp;
| As with most websites and technology services delivered over the Internet, our servers automatically collect information when you access or use our Websites or Services and record it in log files. This log data may include the Internet Protocol (IP) address, the address of the web page visited before using the Website or Services, browser type and settings, the date and time the Services were used, information about browser configuration and plugins, language preferences and cookie data.
li
strong Device information.&nbsp;
| Matomo collects information about devices accessing the Services, including type of device, what operating system is used, device settings, application IDs, unique device identifiers and crash data. Whether we collect some or all of this Other Information often depends on the type of device used and its settings.
li
strong IP information.&nbsp;
| Your IP address will be pseudonymized by 2 byte(s) before any further processing of your data, e.g. 192.168.xxx.xxx.
li
strong Location information.&nbsp;
| Matomo uses your pseudonymized IP address in order to approximate determine your location by country.
h2 Data Retention
p All data that is being processed, will be automatically deleted after 180 days.
h2 How We Disclose and Share Information
p The analytics for this project will not be shared with third parties at any given point. Long time contributors of the project may have access to view analytics interface while not being able to alter the data itself.
h2 Opt Out From Tracking
p If you do not agree to this data from your visit being stored and evaluated, then you can object to the storage and use at any time by clicking below. In this case, an opt-out cookie will be placed in your browser, which means that Matomo does not collect any session data. Please note that the complete deletion of your cookies means that the opt-out cookie will be deleted too and you may need to activate it again.
OptOutIframe
h2 Re-Enable Cookie Banner
p Click&nbsp;
a.highlighted(@click.preventDefault="restoreCookieNotice") here!
h2 Contact Us
p For any data privacy related enquiries, such as requesting a copy of your information or complete deletion, please contact us via mail at&nbsp;
a(href="mailto:dataprivacy@webgems.io") dataprivacy@webgems.io
</template>
<script>
import OptOutIframe from '@/components/OptOutIframe.vue'
export default {
components: {
OptOutIframe,
},
data() {
return {
}
},
methods: {
restoreCookieNotice() {
if(typeof(Storage) !== 'undefined'){
localStorage.removeItem('cookieNoticeHidden')
location.reload()
}
},
checkCookieNoticeRestore() {
if(typeof(Storage) !== 'undefined'){
let cookieNotice = localStorage.getItem('cookieNoticeRestore')
if(cookieNotice === true) {
this.showRestore = true
console.log('as', this.showRestore)
} else {
this.showRestore = false
}
}
},
},
}
</script>
<style lang="scss" scoped>
h2 {
margin-top: 2rem;
margin-bottom: 0.5rem;
}
p {
margin-top: 0;
}
</style>