NewTabPage/main.css

127 lines
2.1 KiB
CSS

html {
/* set these manually to fix background images on chrome mobile */
width: 100%;
height: 100%;
}
body {
width: 100%;
height: 100%;
background: white no-repeat center center fixed;
background-size: cover;
tab-size: 4;
-moz-tab-size: 4;
-webkit-transition: background-image 1.0s ease-in-out;
-moz-transition: background-image 1.0s ease-in-out;
-o-transition: background-image 1.0s ease-in-out;
transition: background-image 1.0s ease-in-out;
}
.card-header {
background-color: #FEA63C;
color: white;
font-size: 16px;
font-weight: 600;
padding-top: 0.4em;
padding-bottom: 0.4em;
}
.start-hidden {
display: none;
height: 16px; /* prvents problems with height jumping with jquery show/hide */
}
.list-group-item {
padding-top: .4rem;
padding-bottom: .4rem;
}
.card, .btn {
border: 0px;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
/* always leave at least an empty space in a group */
.list-group {
min-height: 31px;
}
.dragHandle, .dragGroupHandle {
cursor: move;
}
.navbar {
background: transparent !important;
}
/* Move the navbar contents onto the same line as the toggler */
#navbarCollapse {
margin-top: -2.5rem !important;
margin-right: 50px;
}
.toggler-bg-dark {
background: rgba(0, 0, 0, 0.24);
}
.toggler-bg-light {
background: rgba(255, 255, 255, 0.24);
}
.clickable {
cursor: pointer;
}
textarea {
font-family: monospace;
white-space: pre;
}
/* set the width of the main container based on element width */
@media (max-width: 34em) {
#wrapper {
width: 90%;
}
}
@media (min-width: 34em) {
#wrapper {
width: 60%;
}
}
/* change the number of columns in card-columns */
@media (min-width: 34em) {
.card-columns {
-webkit-column-count: 1;
-moz-column-count: 1;
column-count: 1;
}
}
@media (min-width: 48em) {
.card-columns {
-webkit-column-count: 1;
-moz-column-count: 1;
column-count: 1;
}
}
@media (min-width: 62em) {
.card-columns {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
}
}
@media (min-width: 75em) {
.card-columns {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
}
}