New CSS #1
10
src/app.scss
10
src/app.scss
@ -42,14 +42,14 @@ $default-border-radius:5px;
|
|||||||
}
|
}
|
||||||
|
|
||||||
.default{
|
.default{
|
||||||
// margin: auto;
|
margin: auto;
|
||||||
// margin-top: 50px;
|
// margin-top: 50px;
|
||||||
// margin-bottom: 50px;
|
// margin-bottom: 50px;
|
||||||
// text-align: center;
|
// text-align: center;
|
||||||
// @media (min-width: $min-tablet) {
|
@media (min-width: $min-tablet) {
|
||||||
// width: 80%;
|
width: 80%;
|
||||||
// max-width: 1024px;
|
max-width: 1024px;
|
||||||
// }
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.image-container{
|
.image-container{
|
||||||
|
@ -58,7 +58,7 @@
|
|||||||
}
|
}
|
||||||
.aboutMe {
|
.aboutMe {
|
||||||
background-color: $basecolor2;
|
background-color: $basecolor2;
|
||||||
border: solid 1px $border-color;
|
// border: solid 1px $border-color;
|
||||||
border-radius: $default-border-radius;
|
border-radius: $default-border-radius;
|
||||||
padding: 30px;
|
padding: 30px;
|
||||||
margin: 30px;
|
margin: 30px;
|
||||||
|
@ -29,11 +29,11 @@
|
|||||||
img.profile {
|
img.profile {
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
max-width: 150px;
|
max-width: 150px;
|
||||||
border: solid 1px $border-color;
|
// border: solid 1px $border-color;
|
||||||
}
|
}
|
||||||
.contacts {
|
.contacts {
|
||||||
background-color: $basecolor2;
|
background-color: $basecolor2;
|
||||||
border: solid 1px $border-color;
|
// border: solid 1px $border-color;
|
||||||
border-radius: $default-border-radius;
|
border-radius: $default-border-radius;
|
||||||
padding: 30px;
|
padding: 30px;
|
||||||
margin: 30px;
|
margin: 30px;
|
||||||
@ -43,10 +43,6 @@
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.contacts:last-of-type {
|
|
||||||
width: 86%;
|
|
||||||
}
|
|
||||||
.links {
|
.links {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
ul {
|
ul {
|
||||||
|
@ -71,7 +71,7 @@
|
|||||||
}
|
}
|
||||||
.job-container {
|
.job-container {
|
||||||
background-color: $basecolor2;
|
background-color: $basecolor2;
|
||||||
border: solid 1px $border-color;
|
// border: solid 1px $border-color;
|
||||||
border-radius: $default-border-radius;
|
border-radius: $default-border-radius;
|
||||||
padding: 30px;
|
padding: 30px;
|
||||||
margin: 30px;
|
margin: 30px;
|
||||||
|
@ -5,8 +5,19 @@
|
|||||||
export let jobs: Schema[] = [];
|
export let jobs: Schema[] = [];
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div>
|
<div class="jobs-container">
|
||||||
{#each jobs as job}
|
{#each jobs as job}
|
||||||
<JobElement {job} {currentLanguage} />
|
<div class="item"><JobElement {job} {currentLanguage} /></div>
|
||||||
{/each}
|
{/each}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.jobs-container {
|
||||||
|
display: inline-grid;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
col:nth-child(2n + 3) {
|
||||||
|
grid-column-start: 0;
|
||||||
|
grid-column-end: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
@ -5,7 +5,7 @@
|
|||||||
home: { it: 'Home', en: 'Home' },
|
home: { it: 'Home', en: 'Home' },
|
||||||
job: { it: 'Esperienze', en: 'Experiences' },
|
job: { it: 'Esperienze', en: 'Experiences' },
|
||||||
school: { it: 'Formazione', en: 'Training' },
|
school: { it: 'Formazione', en: 'Training' },
|
||||||
contacts: { it: 'Contatti', en: 'Contacts' },
|
blog: { it: 'Blog', en: 'Blog' },
|
||||||
portfolio: { it: 'Portfolio', en: 'Portfolio' }
|
portfolio: { it: 'Portfolio', en: 'Portfolio' }
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@ -46,15 +46,9 @@
|
|||||||
><span class="hide">{menu.portfolio[currentLanguage]}</span><i class="fas fa-user-clock" /></a
|
><span class="hide">{menu.portfolio[currentLanguage]}</span><i class="fas fa-user-clock" /></a
|
||||||
>
|
>
|
||||||
|
|
||||||
<a
|
<!-- <a class="menu-element" href="/blog" alt={menu.blog[currentLanguage]}
|
||||||
use:scrollto={{ element: '#contacts', offset: -70 }}
|
><span class="hide">{menu.blog[currentLanguage]}</span><i class="fas fa-address-card" /></a
|
||||||
class="menu-element"
|
> -->
|
||||||
href="#contacts"
|
|
||||||
alt={menu.contacts[currentLanguage]}
|
|
||||||
><span class="hide">{menu.contacts[currentLanguage]}</span><i
|
|
||||||
class="fas fa-address-card"
|
|
||||||
/></a
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
0
src/routes/blog.svelte
Normal file
0
src/routes/blog.svelte
Normal file
@ -42,7 +42,6 @@
|
|||||||
<div class="menu">
|
<div class="menu">
|
||||||
<Menu {currentLanguage} />
|
<Menu {currentLanguage} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="home" class="default">
|
<div id="home" class="default">
|
||||||
<h1>{titles.home[currentLanguage]}</h1>
|
<h1>{titles.home[currentLanguage]}</h1>
|
||||||
<AboutMe {currentLanguage} />
|
<AboutMe {currentLanguage} />
|
||||||
@ -59,10 +58,6 @@
|
|||||||
<h2>{titles.portfolio[currentLanguage]}</h2>
|
<h2>{titles.portfolio[currentLanguage]}</h2>
|
||||||
<Jobs jobs={portfolio} {currentLanguage} />
|
<Jobs jobs={portfolio} {currentLanguage} />
|
||||||
</div>
|
</div>
|
||||||
<div id="contacts" class="default">
|
|
||||||
<h2>{titles.contacts[currentLanguage]}</h2>
|
|
||||||
<Contacts />
|
|
||||||
</div>
|
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@ -72,9 +67,11 @@
|
|||||||
height: 30px;
|
height: 30px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
text-align: end;
|
|
||||||
background-color: $basecolor2;
|
background-color: $basecolor2;
|
||||||
padding-top: 10px;
|
padding-top: 10px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: end;
|
||||||
}
|
}
|
||||||
.menu {
|
.menu {
|
||||||
background-color: $basecolor2;
|
background-color: $basecolor2;
|
||||||
@ -92,9 +89,11 @@
|
|||||||
border: 0;
|
border: 0;
|
||||||
background: none;
|
background: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
border-radius: 0px;
|
border-radius: $default-border-radius;
|
||||||
border: solid $button-border-color 1px;
|
border: solid $button-border-color 1px;
|
||||||
|
width: 40px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
.custom-button:hover {
|
.custom-button:hover {
|
||||||
background-color: $accent2;
|
background-color: $accent2;
|
||||||
|
Loading…
Reference in New Issue
Block a user