webfussel/wf4
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ADD: logo via NuxtIcon

Browse source 
Icon via NuxtIcon and SVG
This commit is contained in:
webfussel 2025-02-24 07:51:39 +01:00
parent bde5e850e0
commit 06cdabfa37
3 changed files with 18 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

6
app/assets/css/header.css
View file

@ -38,12 +38,6 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 1rem; gap: 1rem;
& svg {
--size: 40px;
width: var(--size);
height: var(--size);
}
} }
& nav { & nav {

17
app/assets/icons/logo.svg Normal file
View file

@ -0,0 +1,17 @@
<svg aria-label="Logo" class="logo" height="40" viewBox="0 0 2500 2500" width="40">
<g id="Logo">
<g transform="matrix(2.00744,0,-5.91646e-31,2.00744,-1223.85,-1050.52)">
<path class="fussel"
d="M1232.34,1444.88L1356.88,1532.06C1356.88,1532.06 1405.5,1504.81 1444.06,1395.07C1464.03,1338.21 1476.18,1339.49 1506.32,1320.35C1579.8,1273.69 1638.29,1212.62 1630.86,1195.81C1560.6,1178.12 1512.77,1137.84 1506.32,1102.15L1618.41,946.736C1618.41,946.736 1514.23,877.412 1406.69,896.922C1407.7,845.817 1413.57,804.009 1481.42,759.931C1417.36,736.758 1260.23,740.351 1182.53,834.653C1115.13,783.067 1068.98,763.931 1008.18,759.931L1045.54,872.014C999.993,865.527 914.886,866.941 858.733,902.888C912.917,941.197 943.173,985.627 958.362,1033.91C883.905,1079.32 844.648,1134.09 808.918,1195.81C875.598,1205.68 938.224,1226.42 970.816,1282.99C1016.82,1362.83 1028.77,1456.11 1107.81,1532.06L1232.34,1444.88"/>
</g>
<g transform="matrix(1,0,0,1,-422.589,697.589)">
<path class="glasses" d="M1747.59,277.411C1695.36,294.131 1645.34,294.246 1597.59,277.411"/>
</g>
<path class="glasses"
d="M1175,975C1189.02,1037.51 1161.76,1216.53 1125,1300C1027.14,1307.22 909.088,1298.04 825,1275C798.072,1183.9 789.715,1050.66 825,950C935.158,934.697 1076.23,935.423 1175,975Z"/>
<g transform="matrix(-1,0,0,1,2500,2.20268e-13)">
<path class="glasses"
d="M1175,975C1189.02,1037.51 1161.76,1216.53 1125,1300C1027.14,1307.22 909.088,1298.04 825,1275C798.072,1183.9 789.715,1050.66 825,950C935.158,934.697 1076.23,935.423 1175,975Z"/>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.6 KiB

18
app/components/Header.vue
View file

@ -3,23 +3,7 @@
<header ref="header" class="Header"> <header ref="header" class="Header">
<div ref="headerWrapper" class="wrapper z-0"> <div ref="headerWrapper" class="wrapper z-0">
<strong> <strong>
<svg aria-label="Logo" class="logo" height="40" viewBox="0 0 2500 2500" width="40"> <Icon class="logo" name="wf:logo" mode="svg" size="40px" />
<g id="Logo">
<g transform="matrix(2.00744,0,-5.91646e-31,2.00744,-1223.85,-1050.52)">
<path class="fussel"
d="M1232.34,1444.88L1356.88,1532.06C1356.88,1532.06 1405.5,1504.81 1444.06,1395.07C1464.03,1338.21 1476.18,1339.49 1506.32,1320.35C1579.8,1273.69 1638.29,1212.62 1630.86,1195.81C1560.6,1178.12 1512.77,1137.84 1506.32,1102.15L1618.41,946.736C1618.41,946.736 1514.23,877.412 1406.69,896.922C1407.7,845.817 1413.57,804.009 1481.42,759.931C1417.36,736.758 1260.23,740.351 1182.53,834.653C1115.13,783.067 1068.98,763.931 1008.18,759.931L1045.54,872.014C999.993,865.527 914.886,866.941 858.733,902.888C912.917,941.197 943.173,985.627 958.362,1033.91C883.905,1079.32 844.648,1134.09 808.918,1195.81C875.598,1205.68 938.224,1226.42 970.816,1282.99C1016.82,1362.83 1028.77,1456.11 1107.81,1532.06L1232.34,1444.88"/>
</g>
<g transform="matrix(1,0,0,1,-422.589,697.589)">
<path class="glasses" d="M1747.59,277.411C1695.36,294.131 1645.34,294.246 1597.59,277.411"/>
</g>
<path class="glasses"
d="M1175,975C1189.02,1037.51 1161.76,1216.53 1125,1300C1027.14,1307.22 909.088,1298.04 825,1275C798.072,1183.9 789.715,1050.66 825,950C935.158,934.697 1076.23,935.423 1175,975Z"/>
<g transform="matrix(-1,0,0,1,2500,2.20268e-13)">
<path class="glasses"
d="M1175,975C1189.02,1037.51 1161.76,1216.53 1125,1300C1027.14,1307.22 909.088,1298.04 825,1275C798.072,1183.9 789.715,1050.66 825,950C935.158,934.697 1076.23,935.423 1175,975Z"/>
</g>
</g>
</svg>
webfussel webfussel
</strong> </strong>
<input id="navToggle" v-model="isBurgerOpen" type="checkbox"> <input id="navToggle" v-model="isBurgerOpen" type="checkbox">