about mobile, title fixes & styling

This commit is contained in:
cupcakearmy 2020-07-27 12:36:55 +02:00
parent 3c6e25af7a
commit 4be28ac4cf
No known key found for this signature in database
GPG Key ID: D28129AE5654D9D9
8 changed files with 120 additions and 56 deletions

View File

@ -66,20 +66,20 @@ export default {
onwarn,
},
serviceworker: {
input: config.serviceworker.input(),
output: config.serviceworker.output(),
plugins: [
resolve(),
replace({
'process.browser': true,
'process.env.NODE_ENV': JSON.stringify(mode),
}),
commonjs(),
!dev && terser(),
],
// serviceworker: {
// input: config.serviceworker.input(),
// output: config.serviceworker.output(),
// plugins: [
// resolve(),
// replace({
// 'process.browser': true,
// 'process.env.NODE_ENV': JSON.stringify(mode),
// }),
// commonjs(),
// !dev && terser(),
// ],
preserveEntrySignatures: false,
onwarn,
},
// preserveEntrySignatures: false,
// onwarn,
// },
}

View File

@ -44,6 +44,6 @@
<p>{project.body}</p>
<ion-icon name="link-outline" />
<a href={project.link}>{project.link.replace(/https?:\/\//, '')}</a>
<a rel="noopener noreferrer" target="_blank" href={project.link}>{project.link.replace(/https?:\/\//, '')}</a>
</section>

View File

@ -1,24 +1,31 @@
<script>
export let letters = []
export let even = false
</script>
<style>
span {
font-size: 8vw;
text-transform: uppercase;
user-select: none;
width: 1em;
text-align: center;
display: inline-block;
}
div {
margin-left: -0.5em;
font-size: min(8vw, 2.5em);
text-transform: uppercase;
user-select: none;
letter-spacing: 0.35em;
}
div.even {
font-size: 8vw;
}
</style>
<div>
{#each letters as letter}
<span>{letter}</span>
{/each}
<div class:even>
{#if even}
{#each letters as letter}
<span>{letter}</span>
{/each}
{:else}{letters}{/if}
</div>

View File

@ -11,6 +11,7 @@
height: 30vw;
left: 35em;
top: 12em;
max-width: 25em;
}
@media (max-width: 55em) {

View File

@ -1,18 +1,30 @@
<script>
import SimplePage from '../components/SimplePage.svelte'
const links = [
{ href: 'mailto:hi@nicco.io', name: 'Say hi@nicco.io', icon: 'chatbubble-outline' },
{ href: 'https://github.com/cupcakearmy', name: 'Github', icon: 'logo-github' },
{ href: '/privacy', name: 'Privacy Policy', icon: 'finger-print-outline' },
]
</script>
<style>
a {
text-decoration: none;
ul {
list-style: none;
margin: 0;
padding: 0;
}
a:hover {
text-decoration: underline;
li {
transition: transform 200ms ease;
padding: 0.75em 0.5em;
cursor: pointer;
border-radius: 0.5em;
}
span {
margin-right: 2em;
li:hover {
box-shadow: 0px 6px 6px -3px #00000012;
transform: translateY(0.25em) translateX(0.15em) scale(1.05);
}
ion-icon {
@ -23,28 +35,16 @@
<svelte:head>
<title>Contact</title>
</svelte:head>
<SimplePage title="Contact">
<p>
<span>
<a rel="noopener noreferrer" href="mailto:hi@nicco.io">
<ion-icon name="chatbubble-outline" size="large" />
Say hi@nicco.io
</a>
</span>
<span>
<a rel="noopener noreferrer" target="_blank" href="https://github.com/cupcakearmy/">
<ion-icon name="logo-github" size="large" />
Github
</a>
</span>
<span>
<a href="/privacy">
<ion-icon name="finger-print-outline" size="large" />
Privacy
</a>
</span>
</p>
<ul>
{#each links as { href, name, icon }}
<li>
<a rel="noopener noreferrer" {href}>
<ion-icon name={icon} size="large" />
{name}
</a>
</li>
{/each}
</ul>
</SimplePage>

View File

@ -5,6 +5,7 @@
<style>
p {
font-size: 4vw;
margin-top: 0;
}
section {
@ -21,6 +22,7 @@
section.left {
align-items: flex-start;
padding-left: 1em;
width: initial;
}
section.right {
@ -53,8 +55,8 @@
<section class="left" style="z-index: 3;">
<h1>
<SpacedLetters letters="Niccolò" />
<SpacedLetters letters="Borgioli" />
<SpacedLetters letters="Niccolò" even />
<SpacedLetters letters="Borgioli" even />
</h1>
<p>Design & Development</p>

50
src/routes/privacy.svelte Normal file
View File

@ -0,0 +1,50 @@
<script>
import SimplePage from '../components/SimplePage.svelte'
</script>
<SimplePage title="Privacy Policy">
<h3>TLDR;</h3>
<ul>
<li>There is no personal data collected, everything is anonymized</li>
<li>No data is passed to any third party</li>
</ul>
<hr />
<!-- <h2>The Legal</h2> -->
<p>
Your privacy is important to us. It is our policy to respect your privacy regarding any information we may collect
from you across our website, https://nicco.io, and other sites we own and operate.
</p>
<p>
We only ask for personal information when we truly need it to provide a service to you. We collect it by fair and
lawful means, with your knowledge and consent. We also let you know why were collecting it and how it will be used.
</p>
<p>
We only retain collected information for as long as necessary to provide you with your requested service. What data
we store, well protect within commercially acceptable means to prevent loss and theft, as well as unauthorised
access, disclosure, copying, use or modification.
</p>
<p>
We dont share any personally identifying information publicly or with third-parties, except when required to by
law.
</p>
<p>
Our website may link to external sites that are not operated by us. Please be aware that we have no control over the
content and practices of these sites, and cannot accept responsibility or liability for their respective privacy
policies.
</p>
<p>
You are free to refuse our request for your personal information, with the understanding that we may be unable to
provide you with some of your desired services.
</p>
<p>
Your continued use of our website will be regarded as acceptance of our practices around privacy and personal
information. If you have any questions about how we handle user data and personal information, feel free to contact
us.
</p>
<p>This policy is effective as of 1 January 2019.</p>
</SimplePage>

View File

@ -26,7 +26,7 @@ h5,
h6 {
font-family: 'Playfair Display', serif;
font-weight: normal;
margin: 0.5em 0;
margin: 1em 0 0.5em 0;
}
p {
@ -34,6 +34,10 @@ p {
line-height: 1.5;
}
hr {
border: 0.1px solid var(--clr-primary);
}
:root {
--clr-primary: hsl(219, 90%, 80%);
}