132 lines
1.6 KiB
CSS
132 lines
1.6 KiB
CSS
body {
|
|
margin: 0;
|
|
height: 100%;
|
|
}
|
|
|
|
html {
|
|
height: 100%;
|
|
}
|
|
|
|
#root {
|
|
height: 100%;
|
|
}
|
|
|
|
*, :after, :before {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
#container {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
#header {
|
|
background-color: hsla(0,0%,100%,.95);
|
|
box-shadow: 0 2px 4px 0 rgba(73,73,73,.1);
|
|
height: 60px;
|
|
position: fixed;
|
|
top: 0;
|
|
z-index: 10000;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 20px;
|
|
}
|
|
|
|
|
|
.filter-row {
|
|
padding: 15px 0;
|
|
border-bottom: 1px solid #e7e7e7;
|
|
}
|
|
|
|
.listings-row {
|
|
margin-bottom: 15px;
|
|
border: 1px solid #e6e6e6;
|
|
background: #fff;
|
|
cursor: pointer;
|
|
border-radius: 3px;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
#left {
|
|
height: 100%;
|
|
}
|
|
|
|
#map {
|
|
height: 100%;
|
|
}
|
|
|
|
|
|
.right-content {
|
|
padding: 10px 10px 0;
|
|
overflow-y: auto;
|
|
height: 100%;
|
|
}
|
|
|
|
#right {
|
|
box-sizing: border-box;
|
|
width: 572px;
|
|
padding-top: 60px;
|
|
float: right;
|
|
height: 100%;
|
|
border: 1px solid #e6e6e6;
|
|
background: rgba(252,252,253,.9);
|
|
|
|
}
|
|
|
|
.filters {
|
|
margin: 0;
|
|
padding: 10px 25px 0;
|
|
border: 1px solid #e6e6e6;
|
|
background: #fff;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.filters-btn-toggle {
|
|
margin-top: 90px;
|
|
display: none;
|
|
}
|
|
|
|
.filters-close-button {
|
|
display: none;
|
|
}
|
|
|
|
.left-hidden-shown {
|
|
display: block;
|
|
}
|
|
|
|
.right-hidden-shown {
|
|
display: block;
|
|
}
|
|
|
|
@media (max-width : 768px) {
|
|
#right {
|
|
width: 100%;
|
|
}
|
|
|
|
.filters-btn-toggle {
|
|
margin-top: 90px;
|
|
display: block;
|
|
}
|
|
|
|
.filters-close-button {
|
|
display: block;
|
|
}
|
|
|
|
.left-hidden{
|
|
display: none;
|
|
}
|
|
|
|
.right-shown {
|
|
display: block;
|
|
}
|
|
|
|
.right-base {
|
|
display: none;
|
|
}
|
|
|
|
.left-base {
|
|
display: block;
|
|
}
|
|
}
|