xdrm-brackets
/
xdrm.io
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fix: remove contact from the home page

This commit is contained in:
Adrien Marquès 2022-10-18 16:58:24 +02:00
parent 53d16159b9
commit fe4af9ea62
Signed by: xdrm-brackets
GPG Key ID: D75243CA236D825E
2 changed files with 21 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/Home.vue
View File

@ -1,11 +1,6 @@
<template>
<div id='home'>
<div class='contact'>
<span class='tel'>(+33) 06 69 05 19 10</span>
<span class='mail'>xdrm.dev@gmail.com</span>
<span class='addr'>Montauban, 82000</span>
</div>
<LangPicker />
@ -135,32 +130,19 @@ export default class Home extends Vue {
align-items: center;
}
.contact {
grid-column: 1 / 4;
.lang-picker {
grid-column: 3;
grid-row: 1;
display: flex;
position: relative;
justify-self: end;
margin: 1em 0;
flex-flow: row nowrap;
justify-content: space-around;
color: #9ea6b3;
font-size: 1.2em;
font-weight: 400;
}
.lang-picker {
display: block;
position: absolute;
position: relative;
top: 0;
right: 0;
margin-top: 1em;
margin-right: 1em;
margin-top: .5em;
margin-right: .5em;
font-size: 1.2em;
}

29
src/components/LangPicker.vue
View File

@ -1,10 +1,10 @@
<template>
<div class='lang-picker'>
<div @click='current = locales[0]'>
<img src='../assets/lang/en-US.svg' :data-active='current == locales[0]'/>
<div @click='current = locales[0]' :data-active='current == locales[0]'>
<img src='../assets/lang/en-US.svg'/>
</div>
<div @click='current = locales[1]'>
<img src='../assets/lang/fr-FR.svg' :data-active='current == locales[1]'/>
<div @click='current = locales[1]' :data-active='current == locales[1]'>
<img src='../assets/lang/fr-FR.svg'/>
</div>
</div>
</template>
@ -48,22 +48,23 @@ export default class LangPicker extends Vue {
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
.lang-picker {
div.lang-picker {
display: flex;
position: relative;
flex: row nowrap;
flex-flow: row nowrap;
img {
display: inline-block;
width: 2em;
margin-right: .5em;
div {
flex: 2em;
display: block;
padding: .25em;
cursor: pointer;
transform-style: preserve-3d;
transition: filter .1s ease-in-out;
;
filter: grayscale(70%);
&[data-active=true]{
@ -71,12 +72,12 @@ export default class LangPicker extends Vue {
}
&:not([data-active=true]):hover {
filter: grayscale(40%);
filter: grayscale(40%);
}
}
& div:last-child > img {
margin: 0;
img {
width: 2em;
}
}