feat(mobile): Adds mobile landscape

pull/49/head
sovanna 2019-12-30 11:14:04 +01:00
parent efd6b92298
commit faeaf48d9d
1 changed files with 83 additions and 0 deletions

View File

@ -139,7 +139,90 @@
##Screen = B/w 481px to 767px
*/
@media (min-width: 481px) and (max-width: 767px) {
body {
font-size: .8rem;
}
#root-shop .productItem {
padding: 2rem 1rem 1rem;
}
#root-shop .productItem .content img {
height: 230px;
}
#root-shop .productItem .content .price {
padding: .3rem;
}
#root-shop .productItem .content h3 {
font-size: 1.1rem;
}
#root-shop .productItem .content ul {
font-size: .5rem;
}
#root-shop .panel {
padding: 1.3rem;
}
#root-shop .panel .control {
flex-direction: column;
margin-bottom: 1.5rem;
}
#root-shop .panel .control > .description,
#root-shop .panel .control > .crate-mode {
width: 100%;
}
#root-shop .panel .control > .crate-mode {
text-align: left;
}
#root-shop .panel .summary {
flex-direction: column;
}
#root-shop .panel .summary>.summary-price table {
font-size: .7rem;
}
#root-shop .panel .summary>.summary-form form {
width: 100%;
}
#root-shop .panel .summary>.summary-price tfoot {
font-size: .85rem;
}
#root-shop .panel .summary>.summary-form form input[type="submit"] {
margin-bottom: 1em;
}
#root-shop .mobileBtnDisplaySideMenu,
#root-shop .mobileCloseMenu {
display: none !important;
}
#root-shop .mobileBtnDisplaySideMenu button,
#root-shop .mobileCloseMenu button {
-webkit-appearance: none !important;
background: none !important;
border: none !important;
}
#root-shop table {
width: 100%;
max-width: 100%;
}
#root-shop table tr {
padding: .8em 0;
display: flex !important;
justify-content: space-between;
}
}
/*
##Device = Most of the Smartphones Mobiles (Portrait)