mirror of
https://github.com/pierre42100/comunic
synced 2024-09-29 03:22:49 +00:00
323 lines
7.3 KiB
CSS
Executable File
323 lines
7.3 KiB
CSS
Executable File
/*
|
|
* Devices
|
|
* min 1200
|
|
* min 1024
|
|
* max 1024
|
|
* max 768
|
|
* max 640
|
|
* max 480
|
|
* max 320
|
|
*/
|
|
#responsive-utils .hide-element {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
#responsive-utils .show-element {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
}
|
|
#responsive-utils .full-size {
|
|
float: none !important;
|
|
display: block !important;
|
|
width: 100% !important;
|
|
margin-left: 0 !important;
|
|
margin-right: 0 !important;
|
|
}
|
|
#responsive-utils .half-size {
|
|
width: 50% !important;
|
|
}
|
|
#responsive-utils .container-desktop {
|
|
width: 940px !important;
|
|
}
|
|
#responsive-utils .container-phone {
|
|
width: 100% !important;
|
|
}
|
|
#responsive-utils .container-phone2 {
|
|
width: 100% !important;
|
|
}
|
|
#responsive-utils .container-phone3 {
|
|
width: 100% !important;
|
|
}
|
|
#responsive-utils .container-phone4 {
|
|
width: 100% !important;
|
|
}
|
|
#responsive-utils .container-tablet {
|
|
width: 720px !important;
|
|
}
|
|
#responsive-utils .container-large {
|
|
width: 1140px !important;
|
|
}
|
|
#responsive-utils .container-phone {
|
|
padding: 0 10px;
|
|
}
|
|
/* Desktop */
|
|
@media screen and (min-width: 800px) {
|
|
.no-desktop {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
}
|
|
@media screen and (min-width: 1024px) {
|
|
.no-desktop {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
.on-desktop {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
}
|
|
.container {
|
|
width: 940px !important;
|
|
}
|
|
}
|
|
/* Large desktop */
|
|
@media screen and (min-width: 1200px) {
|
|
html {
|
|
font-size: 70%;
|
|
}
|
|
.no-large {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
.on-large {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
}
|
|
.container {
|
|
width: 1140px !important;
|
|
}
|
|
}
|
|
/* tablet landscape*/
|
|
@media only screen and (max-width: 1024px) {
|
|
.no-tablet-landscape,
|
|
.no-tablet {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
.on-tablet {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
}
|
|
.container {
|
|
width: 940px !important;
|
|
}
|
|
}
|
|
/* tablet portrait */
|
|
@media only screen and (max-width: 800px) {
|
|
html {
|
|
font-size: 60%;
|
|
}
|
|
.no-tablet-portrait,
|
|
.no-tablet {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
.on-tablet {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
}
|
|
.container {
|
|
width: 720px !important;
|
|
}
|
|
.grid:not(.fluid) > .row {
|
|
margin: 0;
|
|
}
|
|
.grid:not(.fluid) > .row > [class*="span"] {
|
|
width: 350px !important;
|
|
margin-left: 0 !important;
|
|
margin-bottom: 20px;
|
|
}
|
|
.grid:not(.fluid) > .row > [class*="span"]:nth-child(even) {
|
|
margin-left: 20px !important;
|
|
}
|
|
.grid:not(.fluid) > .row .span12,
|
|
.grid:not(.fluid) > .row .span7,
|
|
.grid:not(.fluid) > .row .span8,
|
|
.grid:not(.fluid) > .row .span9,
|
|
.grid:not(.fluid) > .row .span10,
|
|
.grid:not(.fluid) > .row .span11 {
|
|
width: 720px !important;
|
|
}
|
|
.grid:not(.fluid) > .row .span12:nth-child(even),
|
|
.grid:not(.fluid) > .row .span7:nth-child(even),
|
|
.grid:not(.fluid) > .row .span8:nth-child(even),
|
|
.grid:not(.fluid) > .row .span9:nth-child(even),
|
|
.grid:not(.fluid) > .row .span10:nth-child(even),
|
|
.grid:not(.fluid) > .row .span11:nth-child(even) {
|
|
margin-left: 0 !important;
|
|
}
|
|
.grid:not(.fluid) > .row .row {
|
|
margin: 0;
|
|
}
|
|
.grid:not(.fluid) > .row .row [class*="span"] {
|
|
width: 350px !important;
|
|
margin-left: 0 !important;
|
|
margin-bottom: 20px;
|
|
}
|
|
.grid:not(.fluid) > .row .row [class*="span"]:nth-child(even) {
|
|
margin-left: 20px !important;
|
|
}
|
|
.grid:not(.fluid) > .row .row .span12,
|
|
.grid:not(.fluid) > .row .row .span7,
|
|
.grid:not(.fluid) > .row .row .span8,
|
|
.grid:not(.fluid) > .row .row .span9,
|
|
.grid:not(.fluid) > .row .row .span10,
|
|
.grid:not(.fluid) > .row .row .span11 {
|
|
width: 720px !important;
|
|
}
|
|
.grid:not(.fluid) > .row .row .span12:nth-child(even),
|
|
.grid:not(.fluid) > .row .row .span7:nth-child(even),
|
|
.grid:not(.fluid) > .row .row .span8:nth-child(even),
|
|
.grid:not(.fluid) > .row .row .span9:nth-child(even),
|
|
.grid:not(.fluid) > .row .row .span10:nth-child(even),
|
|
.grid:not(.fluid) > .row .row .span11:nth-child(even) {
|
|
margin-left: 0 !important;
|
|
}
|
|
.navigation-bar,
|
|
.navbar {
|
|
position: relative !important;
|
|
}
|
|
.navigation-bar .pull-menu,
|
|
.navbar .pull-menu {
|
|
display: block !important;
|
|
}
|
|
.navigation-bar .element,
|
|
.navbar .element {
|
|
float: none !important;
|
|
}
|
|
.navigation-bar .element-divider,
|
|
.navbar .element-divider {
|
|
display: none !important;
|
|
}
|
|
.navigation-bar .element-menu,
|
|
.navbar .element-menu {
|
|
position: relative;
|
|
float: none;
|
|
display: none;
|
|
width: 100% !important;
|
|
background-color: inherit;
|
|
z-index: 1000;
|
|
}
|
|
.navigation-bar .element-menu li,
|
|
.navbar .element-menu li {
|
|
display: block !important;
|
|
float: none !important;
|
|
width: 100%;
|
|
}
|
|
.navigation-bar .element-menu li a,
|
|
.navbar .element-menu li a {
|
|
display: block !important;
|
|
float: none !important;
|
|
width: 100%;
|
|
}
|
|
.navigation-bar .element-menu li .dropdown-menu,
|
|
.navbar .element-menu li .dropdown-menu {
|
|
position: relative !important;
|
|
left: 0;
|
|
}
|
|
.navigation-bar .element-menu .dropdown-toggle,
|
|
.navbar .element-menu .dropdown-toggle {
|
|
color: inherit;
|
|
position: relative;
|
|
}
|
|
.navigation-bar .element-menu .dropdown-toggle:after,
|
|
.navbar .element-menu .dropdown-toggle:after {
|
|
position: absolute;
|
|
left: 100% !important;
|
|
margin-left: -15px;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 800px) {
|
|
.navigation-bar .pull-menu,
|
|
.navbar .pull-menu {
|
|
display: block !important;
|
|
}
|
|
}
|
|
/* Phones landscape*/
|
|
@media only screen and (max-width: 640px) {
|
|
html {
|
|
font-size: 60%;
|
|
}
|
|
.no-phone-landscape,
|
|
.no-phone {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
.on-phone {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
}
|
|
.container {
|
|
width: 100% !important;
|
|
padding: 0 10px;
|
|
}
|
|
.grid:not(.fluid) > .row {
|
|
margin: 0;
|
|
}
|
|
.grid:not(.fluid) > .row > [class*="span"] {
|
|
width: 100% !important;
|
|
margin: 0 !important;
|
|
margin-bottom: 5px !important;
|
|
}
|
|
.grid:not(.fluid) > .row > [class*="span"]:nth-child(even) {
|
|
margin-left: 0 !important;
|
|
}
|
|
.grid:not(.fluid) > .row .span12 {
|
|
width: 100% !important;
|
|
}
|
|
.grid:not(.fluid) > .row .row {
|
|
margin: 0;
|
|
}
|
|
.grid:not(.fluid) > .row .row > [class*="span"] {
|
|
width: 100% !important;
|
|
margin: 0 !important;
|
|
margin-bottom: 5px !important;
|
|
}
|
|
.grid:not(.fluid) > .row .row > [class*="span"]:nth-child(even) {
|
|
margin-left: 0 !important;
|
|
}
|
|
.grid:not(.fluid) > .row .row .span12 {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
/* Phones portrait*/
|
|
@media only screen and (max-width: 480px) {
|
|
html {
|
|
font-size: 45%;
|
|
}
|
|
.no-phone-landscape,
|
|
.no-phone {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
.container {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 360px) {
|
|
html {
|
|
font-size: 40%;
|
|
}
|
|
.no-phone-portrait,
|
|
.no-phone {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
.container {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 320px) {
|
|
html {
|
|
font-size: 40%;
|
|
}
|
|
.no-phone-portrait,
|
|
.no-phone {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
}
|
|
.container {
|
|
width: 100% !important;
|
|
}
|
|
}
|