ed.brz9.dev/proj/map/asset/css/style.css

385 lines
5.9 KiB
CSS

@import url("https://file.brz9.dev/web/css/normalize.css");
@import url("./color.css");
@import url("./map.css");
@import url("./font.css");
header {
height: 100px;
width: 100vw;
}
body {
height: 100vh;
height: --webkit-fill-available;
overflow: hidden;
}
section#logo {
position: relative;
left: 5px;
top: 5px;
}
section#lang {
position: relative;
text-align: right;
margin-top: -12px;
}
section#lang span.marker {
position: absolute;
height: 5px;
left: 0;
width: 0;
bottom: -8px;
transition: 0.5s;
}
section#lang span {
margin-right: 10px;
}
section#map-container {
position: fixed;
top: 40px;
width: 100vw;
}
#map {
height: 300px;
width: 100vw;
}
main {
position: fixed;
top: 340px;
bottom: 0px;
width: 100vw;
overflow-x: hidden;
}
div#list {
overflow-y: scroll;
height: 100%;
width: 100%;
padding-left: 10px;
scrollbar-width: none;
overflow-x: hidden;
}
div#list::-webkit-scrollbar {
display: none;
}
.listchild {
height: 0%;
max-height: 0px;
overflow: hidden;
transition: height 0.3s;
}
.listchild.active {
height: 100%;
max-height: none;
overflow: hidden;
}
span.listname {
margin-top: 10px;
margin-bottom: 0px;
display: inline-block;
}
span.listname h3 {
margin: 0px;
float: left;
}
span.listname span.listicon {
margin: 5px;
margin-left: 10px;
float: left;
line-height: 80%;
font-size: 1rem;
transform: rotate(0deg);
transition: transform 0.3s;
}
span.listname.active span.listicon {
float: left;
transform: rotate(45deg);
transition: transform 0.3s;
}
section.listchild {
display: block;
padding-right: 10px;
}
main section.void {
height: 100vh;
}
section.lastlistitem {
width: 100vw;
margin-bottom: 20px;
position: relative;
}
section.lastlistitem aside {
float: left;
width: 50%;
}
section.lastlistitem aside h3 {
margin-top: 0px;
margin-bottom: 0px;
}
section.lastlistitem aside p {
padding-right: 20px;
}
section.lastlistitem img {
width: 100%;
height: 200px;
object-fit: cover;
margin-left: -10px;
}
section.lastlistitem:after {
content: "";
display: table;
clear: both;
}
section.lastlistitem aside span.info {
position: absolute;
bottom: 0px;
font-size: 35px;
/*background-color: var(--b9h-color-fg);*/
color: var(--b9h-color-fg);
}
div.sep {
background-color: var(--b9h-color-fg);
height:0px;
width: 110vw;
margin-left: -8px;
overflow-x: hidden;
content: "jsdflkj"
}
section.card {
position: fixed;
top: 110vh;
left: 0px;
right: 0px;
bottom: 0px;
background-color: var(--b9h-color-bg);
z-index: 1000;
transition: top 0.5s;
height: 100vh;
}
section.card nav {
margin-top: 50px;
margin-bottom: 30px;
display: flex;
flex-direction: row;
justify-content: space-around;
}
section.card nav span {
font-size: 30px;
}
section.card span.byl-icon-cross {
position: absolute;
right: 40px;
top: 40px;
font-size: 1.3rem;
}
section.tabroll {
margin-top: 0px;
height: 80vh;
display: flex;
flex-direction: row;
}
section.tabroll {
transform: translateX(-0vw);
transition: transform 0.5s;
}
section.tabroll section.singletab {
width: 100vw;
height: 100%;
}
nav.cardnav {
position: relative;
}
nav.cardnav span.marker {
position: absolute;
height: 5px;
left: 0px;
width: 0px;
background-color: var(--b9h-color-accent);
bottom: -20px;
transition: 0.5s;
}
/**Leaflet overwrite**/
div.leaflet-popup-tip {
background-color: var(--b9h-color-fg);
}
.leaflet-container div.leaflet-popup-content-wrapper {
border-radius: 0px;
color: var(--b9h-color-bg);
background-color: var(--b9h-color-fg);
font-family: Inter;
font-weight: 400;
font-size: 0.8rem;
text-align: center;
padding-top: 5px;
}
.leaflet-container a.leaflet-popup-close-button {
color: var(--b9h-color-bg);
}
div.timetable p span.hour {
float: right;
margin-right: 0px;
}
div.timetable p {
margin-left: 20px;
margin-bottom: 30px;
}
section.restomenu {
/*! margin-top: 50px; */
padding: 10px;
height: 100%;
overflow-y: scroll;
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}
section.restomenu section.top {
margin-top: 20px;
margin-bottom: 20px;
text-align: center;
}
section.restomenu section.top p.drinks {
font-style: italic;
font-size: 1rem;
}
section.restomenu section.top p{
margin-bottom: 0px;
margin-top: 5px;
}
section.restomenu div.dish h3 {
margin-bottom: 0px;
margin-top: 0px;
}
section.restomenu div.dish p {
margin-top: 3px;
font-style: italic;
}
section.restomenu div.dish p {
line-height: 1rem;
}
section.restomenu ul {
margin-top: 5px;
margin-bottom: 5px;
margin-left: 0px;
padding-left: 0px;
}
section.restomenu h2 {
margin-top: 30px;
text-decoration: none;
text-underline-offset: 10px;
text-decoration-thickness: 5px;
font-size: 1.2rem;
margin-bottom: 10px;
}
::-webkit-scrollbar {
display: none;
}
section#resto nav span.resto-tag {
margin-top: 0px;
margin-bottom: 0px;
width: auto;
display: inline-block;
cursor: pointer;
}
section#resto nav span.resto-tag h3 {
border: 3px;
border-style: solid;
border-width: 4px;
width: auto;
padding: 6px;
margin: 5px;
font-size: 0.9rem;
}
section#resto nav span.resto-tag.active h3 {
border-color: var(--b9h-color-accent);
}
nav.restotagcloud {
margin-bottom: 10px;
}
div.tabinfocontent {
padding: 10px;
margin-top: 20px;
font-size: 1.2rem;
}
div.tabinfocontent span.infotags {
margin-right: 10px;
}
div.tabinfocontent section.infoline {
margin-bottom: 30px;
}
section.card div h3.cardtitle {
margin-top: 40px;
margin-left: 20px;
text-decoration: underline;
text-underline-offset: 15px;
text-decoration-thickness: 5px;
text-decoration-color: var(--b9h-color-accent);
}
section.restomenu div.dish {
margin-left: 20px;
}
a.leaflet-popup-close-button {
display: none;
}
div.leaflet-popup.leaflet-zoom-animated {
bottom: -15px !important;
}