102 lines
1.3 KiB
SCSS
102 lines
1.3 KiB
SCSS
html,body{
|
|
margin: 0;
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
|
|
@mixin layout-row{
|
|
box-sizing: content-box;
|
|
max-width: 1920px;
|
|
margin: 0 auto;
|
|
padding: 0 1rem;
|
|
}
|
|
|
|
#app {
|
|
box-sizing: border-box;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
|
|
font-weight: normal;
|
|
|
|
// display: flex;
|
|
// flex-flow: column-reverse;
|
|
}
|
|
|
|
#header{
|
|
// flex: 0 0 auto;
|
|
position: absolute;
|
|
bottom:0;
|
|
left:0;
|
|
width: 100vw;
|
|
padding: 1rem 0;
|
|
>.row{
|
|
@include layout-row();
|
|
}
|
|
}
|
|
|
|
#main-content{
|
|
// flex: 1 1 auto;
|
|
width:100vw;
|
|
height:100vh;
|
|
|
|
overflow-x: hidden;
|
|
overflow-y: hidden;
|
|
// padding: 1rem 0;
|
|
|
|
#map-backgrounds{
|
|
position: absolute;
|
|
z-index: -1;
|
|
top:0; left:0;
|
|
width:100%;
|
|
height:100%;
|
|
>canvas.map-bg-canvas{
|
|
position: absolute;
|
|
// z-index: -1;
|
|
top:0; left:0;
|
|
width:100%;
|
|
height:100%;
|
|
}
|
|
}
|
|
|
|
#map-matter{
|
|
position: absolute;
|
|
z-index: -1;
|
|
top:0; left:0;
|
|
width:100%;
|
|
height:100%;
|
|
}
|
|
|
|
#map-concernements{
|
|
width:100%;
|
|
height:100%;
|
|
z-index: 1;
|
|
}
|
|
|
|
|
|
#map-nav{
|
|
position: absolute;
|
|
z-index: 2;
|
|
top:0; left: 0;
|
|
width:100vw;
|
|
padding:1rem 0;
|
|
>ul{
|
|
@include layout-row();
|
|
}
|
|
}
|
|
|
|
// >.row{
|
|
// @include layout-row();
|
|
// }
|
|
|
|
#content{
|
|
box-sizing: border-box;
|
|
position: absolute;
|
|
top:0; right:0;
|
|
height:100vh;
|
|
padding: 0.5rem;
|
|
}
|
|
|
|
}
|
|
|