raffi/portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

playing with footer

Browse Source
This commit is contained in:
raffiskender
2023-09-19 11:05:29 +02:00
parent ff3ea2cdcd
commit d268f431d3
4 changed files with 517 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

113
src/components/Footer.vue
View File

@@ -1,7 +1,7 @@
<script setup>
import { ref } from 'vue';
const show = ref(false)
const show = ref(true)
</script>
<template>
@@ -133,70 +133,29 @@ const show = ref(false)
</g>
</g>
</svg>
<svg
viewBox="75 -50 300 150"
style="fill:none;
stroke:white;
stroke-width:5;
stroke-linecap:round;"
>
<path
style="
stroke-linejoin:round;
stroke-miterlimit:4;
stroke-dasharray:none;
stroke-opacity:1"
d="M 139.17222,9.3942355 C 173.00215,31.292212 218.1812,60.980457 218.48057,79.674699 218.59904,87.056983 99.966521,77.122595 100.0371,73.59533 212.37863,43.378561 246.84869,31.106644 355.29155,12.76416"
id="path862"
sodipodi:nodetypes="cscc" />
<path
style="
stroke-linejoin:miter;
stroke-miterlimit:4;
stroke-dasharray:none;
stroke-opacity:1"
d="m 312.83425,25.675399 0.42594,12.212728"
id="path3943" />
<path
style="stroke-linejoin:miter;
stroke-miterlimit:4;
stroke-dasharray:none;
stroke-opacity:1"
d="m 311.63779,8.7395766 0.2454,2.4946354"
id="path3945" />
<path
style="stroke-linejoin:round;
stroke-miterlimit:4;
stroke-dasharray:none;
stroke-opacity:1"
d="M 98.736495,1.2925001 C 130.71965,-24.665921 192.41147,-27.93255 195.70827,-12.082894 c 3.52112,16.9281249 -16.15069,23.426128 -5.21999,35.069064 7.51533,8.004927 22.54721,0.801375 22.54721,0.801375"
id="path4209"
sodipodi:nodetypes="cssc" />
<path
style="stroke-linejoin:miter;
stroke-miterlimit:4;
stroke-dasharray:none;
stroke-opacity:1"
d="m 230.59072,12.767977 c -3.05309,3.537063 -5.46022,13.433154 -3.26784,14.895394 4.2835,2.856811 13.40139,-12.097612 13.1368,-13.525975 -0.40148,-2.164937 -8.06688,-3.457217 -9.86896,-1.369419 z"
id="path5599"
sodipodi:nodetypes="ssss" />
<path
style="stroke-linejoin:miter;
stroke-miterlimit:4;
stroke-dasharray:none;
stroke-opacity:1"
d="m 283.01637,21.941476 c 13.77166,-17.5948162 20.26231,-58.430437 14.87852,-54.688625 -16.63519,11.561933 1.50986,84.878597 -3.86255,94.259788 -2.77674,4.848515 -20.37598,-8.366388 -16.48804,-18.315105 2.64201,-6.760505 6.86016,-5.127064 11.95096,-8.174896"
id="path6508"
sodipodi:nodetypes="csssc" />
<path
style="stroke-linejoin:miter;
stroke-miterlimit:4;
stroke-dasharray:none;
stroke-opacity:1"
d="m 268.00837,42.908163 c -26.42894,-1.402892 -17.3056,39.667651 -1.54342,31.364589 9.85909,-5.193503 -6.22644,-101.377213 2.11133,-100.854828 4.16005,0.260637 0.22284,13.904191 -6.67691,26.02389012 C 254.99972,11.56156 245.13969,22.122662 242.18918,19.553315 240.05011,17.69049 240.35315,11.012501 241.34202,8.7752027"
/>
</svg>
<svg
<div class="raffi">
COUCOU
<!-- <svg id = "raffi" viewBox="75 -50 300 150"> -->
<path id="raffi_path"
style="fill:none;
stroke-width:6;
stroke-linecap:round;
stroke-linejoin:round;
stroke-miterlimit:4;
stroke-dasharray:none;
stroke-opacity:1;
stroke:rgb(235, 235, 235);"
d="M 139.17222,9.3942355 C 173.00215,31.292212 218.1812,60.980457 218.48057,79.674699 218.59904,87.056983 99.966521,77.122595 100.0371,73.59533 212.37863,43.378561 246.84869,31.106644 355.29155,12.76416
M 98.736495,1.2925001 C 130.71965,-24.665921 192.41147,-27.93255 195.70827,-12.082894 c 3.52112,16.9281249 -16.15069,23.426128 -5.21999,35.069064 7.51533,8.004927 22.54721,0.801375 22.54721,0.801375
M 230.59072,12.767977 c -3.05309,3.537063 -5.46022,13.433154 -3.26784,14.895394 4.2835,2.856811 13.40139,-12.097612 13.1368,-13.525975 -0.40148,-2.164937 -8.06688,-3.457217 -9.86896,-1.369419
M 268.00837,42.908163 c -26.42894,-1.402892 -17.3056,39.667651 -1.54342,31.364589 9.85909,-5.193503 -6.22644,-101.377213 2.11133,-100.854828 4.16005,0.260637 0.22284,13.904191 -6.67691,26.02389012 C 254.99972,11.56156 245.13969,22.122662 242.18918,19.553315 240.05011,17.69049 240.35315,11.012501 241.34202,8.7752027
M 283.01637,21.941476 c 13.77166,-17.5948162 20.26231,-58.430437 14.87852,-54.688625 -16.63519,11.561933 1.50986,84.878597 -3.86255,94.259788 -2.77674,4.848515 -20.37598,-8.366388 -16.48804,-18.315105 2.64201,-6.760505 6.86016,-5.127064 11.95096,-8.174896
M 312.83425,36 313,29
M 311.63779,10 312.2454,10"/>
<!-- </svg> -->
</div>
<svg
viewBox="465 -39 150 175"
style="height : 1.8em"
>
@@ -277,6 +236,30 @@ const show = ref(false)
margin-right: 0.5em;
color:white;
}
.raffi{
background: linear-gradient(90deg, #0f0, #f0f, #00f, #FF0, #0ff);
color:transparent;
}
.stop1{
stop-color:#f0f;
}
.stop2{
offset-gradient: 20%;
stop-color:#f00;
}
.stop3{
stop-color:#0f0;
}
.stop4{
stop-color:#00f;
}
.stop5{
stop-color:#f0f;
}
.arrow{
margin-left: 0.4em;
position : fixed;