Add the email and phone numbers at the very top

Requested by the customer
This commit is contained in:
jordi fita mas 2023-12-20 20:39:26 +01:00
parent 34081a50f4
commit 7b6bae5062
2 changed files with 188 additions and 149 deletions

View File

@ -192,11 +192,41 @@ body > header {
top: 0; top: 0;
z-index: 999; z-index: 999;
padding: 1rem 2.5rem; padding: 1rem 2.5rem;
display: flex; display: grid;
grid-template-columns: auto 1fr;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
} }
body > header > address {
grid-column: 1 / span 2;
margin: 0 0 1em;
font-size: 1.3rem;
display: flex;
gap: 2em;
}
body > header > address a {
display: flex;
gap: .5em;
}
body > header > address a::before {
display: inline-block;
width: 1.2rem;
aspect-ratio: 1;
content: '';
background: left center / 100% no-repeat;
}
body > header > address a[href^='tel:']::before {
background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"%3E%3Crect width="256" height="256" fill="none"/%3E%3Cpath d="M164.39,145.34a8,8,0,0,1,7.59-.69l47.16,21.13a8,8,0,0,1,4.8,8.3A48.33,48.33,0,0,1,176,216,136,136,0,0,1,40,80,48.33,48.33,0,0,1,81.92,32.06a8,8,0,0,1,8.3,4.8l21.13,47.2a8,8,0,0,1-.66,7.53L89.32,117a7.93,7.93,0,0,0-.54,7.81c8.27,16.93,25.77,34.22,42.75,42.41a7.92,7.92,0,0,0,7.83-.59Z" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/%3E%3C/svg%3E');
}
body > header > address a[href^='mailto:']::before {
background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"%3E%3Crect width="256" height="256" fill="none"/%3E%3Cpolyline points="224 56 128 144 32 56" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/%3E%3Cpath d="M32,56H224a0,0,0,0,1,0,0V192a8,8,0,0,1-8,8H40a8,8,0,0,1-8-8V56A0,0,0,0,1,32,56Z" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/%3E%3Cline x1="110.55" y1="128" x2="34.47" y2="197.74" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/%3E%3Cline x1="221.53" y1="197.74" x2="145.45" y2="128" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"/%3E%3C/svg%3E');
}
body > header, nav .has-submenu ul { body > header, nav .has-submenu ul {
background-color: rgba(var(--clar-rgb), 0.7); background-color: rgba(var(--clar-rgb), 0.7);
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
@ -290,7 +320,6 @@ nav .has-submenu:hover ul, nav .has-submenu:focus-within ul {
@media (max-width: 80rem) { @media (max-width: 80rem) {
body > header { body > header {
display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
} }
@ -590,7 +619,9 @@ dl, .nature div + div, .outside_activities > div {
margin-top: 0 !important; margin-top: 0 !important;
} }
} /* end autside-activities tablet & mobile */ }
/* end autside-activities tablet & mobile */
.outside_activities { .outside_activities {
margin-top: 2rem; margin-top: 2rem;
@ -944,6 +975,7 @@ select {
background: white; background: white;
padding: 20px; padding: 20px;
} }
/* /*
label { label {
display: flex; display: flex;
@ -967,7 +999,6 @@ button {
} }
/* radio buttins + checkbox */ /* radio buttins + checkbox */
/* Context for relative positioning */ /* Context for relative positioning */
@ -1031,8 +1062,6 @@ input[type="checkbox"]:focus {
} }
#booking fieldset { #booking fieldset {
border: none; border: none;
} }
@ -1102,12 +1131,15 @@ input[type="checkbox"]:focus {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
body > footer section { body > footer section {
width: 100% !important; width: 100% !important;
margin: 40px 0 0 0; margin: 40px 0 0 0;
} }
}/* end footer responsive */ }
/* end footer responsive */
footer { footer {
margin: 120px 0 0 0; margin: 120px 0 0 0;

View File

@ -22,7 +22,14 @@
<body> <body>
<a href="#content">{{( gettext "Skip to main content" )}}</a> <a href="#content">{{( gettext "Skip to main content" )}}</a>
<header> <header>
<h1><a href="/{{ currentLocale }}/"><span class="logo">◭</span><span class="name">{{( gettext "Campsite Montagut" )}}</span></a></h1> {{ with .CompanyAddress -}}
<address>
<a href="tel:{{ replaceAll .Phone " " "" }}">{{ .Phone }}</a>
<a href="mailto:{{ .Email }}">{{ .Email }}</a>
</address>
{{- end }}
<h1><a href="/{{ currentLocale }}/"><span class="logo">◭</span><span
class="name">{{( gettext "Campsite Montagut" )}}</span></a></h1>
<input type="checkbox" id="menuShowHide"> <input type="checkbox" id="menuShowHide">
<label for="menuShowHide"></label> <label for="menuShowHide"></label>
<nav> <nav>