Skip to content

Commit

Permalink
update on header
Browse files Browse the repository at this point in the history
  • Loading branch information
Bjorn Zschernack committed Nov 3, 2023
1 parent cc6dd6b commit baf7481
Show file tree
Hide file tree
Showing 14 changed files with 200 additions and 16 deletions.
14 changes: 14 additions & 0 deletions images/icons/Beschichtung_icon.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
11 changes: 11 additions & 0 deletions images/icons/Kontakt_icon.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 10 additions & 0 deletions images/icons/Service_icon.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 8 additions & 0 deletions images/icons/clock.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
15 changes: 15 additions & 0 deletions images/icons/fahrzeuge_icon.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions images/icons/felge.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
23 changes: 17 additions & 6 deletions scss/includes/_main.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ body {
width:100%;
height:100%;
overflow-x: hidden;
background-color: #f8fcff;
background-color: $bodybg;
font-family: 'BarlowCondensed';
font-size: 16px;
color: $copyblue;
Expand All @@ -27,11 +27,7 @@ body {
}

header {
#menucontainer {
background-color: #03223e;
min-height: 50px;
}


.contact {

.whatsapp{
Expand All @@ -48,6 +44,21 @@ body {
margin-right: 20px;
}
}

.clock {
margin-right: 20px;
&:before{
content:' ';
display: inline-block;
background-image: url('../images/icons/clock.svg');
background-size: 17.1px 17.1px;
background-repeat: no-repeat;
width:17px;
height:17px;
vertical-align: text-bottom;
margin-right: 5px;
}
}
}
}

Expand Down
48 changes: 48 additions & 0 deletions scss/includes/_menu.scss
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
#menucontainer {
background-color: #03223e;
min-height: 50px;

ul {
display: flex;
list-style: none;
padding: 0;
li {
padding:0;

a{
color:white;
font-size: 17px;
padding:30px 45px;
display: block;
}

&.car {
a{
&:before{
content:' ';
display: inline-block;
background-image: url('../images/icons/fahrzeuge_icon.svg');
background-size: 25.8px 14.9px;
background-repeat: no-repeat;
width: 26px;
height: 26px;
/* vertical-align: sub; */
margin-right: 10px;
line-height: 26px;
vertical-align: middle;
position: relative;
top: 3px;
}
}
}

&.orange {
a{
border-bottom:8px solid $orange;
}
}


}
}
}
7 changes: 6 additions & 1 deletion scss/includes/_variables.scss
View file
Original file line number Diff line number Diff line change
@@ -1 +1,6 @@
$copyblue:#062b4d;
$bodybg:#f8fcff;
$copyblue:#062b4d;
$orange:#e8a422;
$green:#89b459;
$red:#ea612e;
$blue:#245861;
55 changes: 51 additions & 4 deletions scss/styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,10 +38,6 @@ body a {
body a:hover {
text-decoration: underline;
}
body header #menucontainer {
background-color: #03223e;
min-height: 50px;
}
body header .contact .whatsapp {
padding-left: 20px;
}
Expand All @@ -55,4 +51,55 @@ body header .contact .whatsapp:before {
height: 17px;
vertical-align: text-bottom;
margin-right: 20px;
}
body header .contact .clock {
margin-right: 20px;
}
body header .contact .clock:before {
content: " ";
display: inline-block;
background-image: url("../images/icons/clock.svg");
background-size: 17.1px 17.1px;
background-repeat: no-repeat;
width: 17px;
height: 17px;
vertical-align: text-bottom;
margin-right: 5px;
}

#menucontainer {
background-color: #03223e;
min-height: 50px;
}
#menucontainer ul {
display: flex;
list-style: none;
padding: 0;
}
#menucontainer ul li {
padding: 0;
}
#menucontainer ul li a {
color: white;
font-size: 17px;
padding: 30px 45px;
display: block;
}
#menucontainer ul li.car a:before {
content: " ";
display: inline-block;
background-image: url("../images/icons/fahrzeuge_icon.svg");
background-size: 25.8px 14.9px;
background-repeat: no-repeat;
width: 26px;
height: 26px;
/* vertical-align: sub; */
margin-right: 10px;
line-height: 26px;
vertical-align: middle;
position: relative;
top: 3px;
}
#menucontainer ul li.orange a {
border-bottom: 8px solid #e8a422;
}
1 change: 1 addition & 0 deletions scss/styles.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
@import 'includes/fonts';
@import 'includes/variables';
@import 'includes/main';
@import 'includes/menu';


4 changes: 4 additions & 0 deletions template-parts/header/contact.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,8 @@
<p>Wir beraten Sie gerne:</p>
<p class="whatsapp"><a href="https://wa.me/4915735980000" target="_blank">02761/ 82870</a></p>
</div>
<div class="d-flex flex-row">
<p class="clock text-end">Mo.-Fr.:<br>Sa.:</p>
<p class="">08:00 - 17:00 Uhr<br>09:00 - 12:00 Uhr</p>
</div>
</div>
14 changes: 12 additions & 2 deletions template-parts/header/header.php
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<header class="container-fluid w-100 p-0" id="header">


<div class="container bg-white py-4" id="header-inner-container">
<div class="container py-4" id="header-inner-container">
<div class="row">

<div class="col-6 col-xl-3">
Expand All @@ -15,6 +15,16 @@
</div>
</div>

<div class="w-100" id="menucontainer"></div>
<div class="w-100" id="menucontainer">

<div class="container">


<?php
wp_nav_menu(array('menu' => 'mainmenu', 'menu_id'=>'mainmenu', 'container' => false, 'menu_class' => 'mleft'));
?>

</div>
</div>

</header>
3 changes: 0 additions & 3 deletions template-parts/header/menu.php
View file
Original file line number Diff line number Diff line change
@@ -1,3 +0,0 @@
<?php
wp_nav_menu(array('menu' => 'mainmenu', 'menu_id'=>'mainmenu', 'container' => false, 'menu_class' => 'mleft'));
?>

0 comments on commit baf7481

Please sign in to comment.