caisse-bliss/assets/css/pages/responsive.scss
2019-07-05 14:17:19 +02:00

189 lines
2.6 KiB
SCSS
Executable File

@media all and(max-width: 1600px) {
.big-footer{
padding-left: 5em;
}
#caisse-now{
margin-left: -1em;
}
}
@media all and(max-width: 1200px) {
#caisse-now{
margin-left: 0;
}
.big-footer{
padding-left: 0;
}
nav {
min-width: auto;
}
html, body {
font-size: 1.2rem;
}
.bg-shader {
height: 100%;
min-height: 100vh;
}
.product-values-block {
padding: 1em;
}
#homepage {
.main-section {
padding: 2rem;
}
.btn {
display: block;
width: 100%;
font-size: 1.25em;
}
}
#caisse-now {
.product-box {
width: 100%;
&.active{
.product-button{
background: greenyellow;
}
}
}
.product-button {
min-width: calc(100% - 56px)
}
.listing-products {
.btn, button {
font-size: 1rem;
padding: 0.2em;
border-radius: 0.3em;
}
}
}
}
@media all and(max-width: 1200px) {
#bodyland {
.container {
min-height: 100vh;
width: 80vw;
}
}
#menu-dashboard {
font-size: 1rem;
width: 19vw;
min-width: 200px;
.nav {
min-width: 200px;
}
}
form {
margin-top: 3em;
select {
width: 100%;
margin: 1em 0;
}
+ ul {
margin-top: 1em;
list-style-type: none;
a {
display: block;
.fa {
margin-right: 1em;
}
}
}
}
}
@media all and(max-width: 600px) {
#menu_button{
}
html, body {
font-size: 1rem;
}
#menu-dashboard .nav .logo-home.btn-default {
height: auto;
font-size: 2em;
}
#menu-dashboard {
width: 100vw;
visibility: hidden;
&.shown {
visibility: visible;
}
.nav {
min-width: 200px;
height: 100vh;
overflow: auto;
a {
font-size: 2rem;
}
}
}
.main-section > div {
padding-top: 0;
}
.product-values {
padding: 0;
}
.bigger-text, #homepage, .hint, .product-values-block {
font-size: 1.25rem;
line-height: 2rem;
}
.category-listing {
width: calc(100vw - 4rem);
height: 25vh;
min-height: auto;
float: left;
clear: both;
overflow: auto;
}
.sellings {
input {
width: 100%;
}
}
.client-now {
input {
width: 50%;
}
}
.sellings, .client-now {
input {
font-size: 1.5rem;
padding: 0.5rem;
}
}
.big-footer {
font-size: 1rem;
}
#caisse-now .product-box {
margin-bottom: 0.25rem;
}
#caisse-now .listing-products button {
padding: 0.5rem 1rem;
.express-button {
padding: 0.5rem 1rem;
}
}
}