Merge remote-tracking branch 'snipe-it-upstream/develop' into develop
BIN
.public/css/dist/blue.png
vendored
Normal file
After Width: | Height: | Size: 1.1 KiB |
BIN
.public/css/dist/blue@2x.png
vendored
Normal file
After Width: | Height: | Size: 1.4 KiB |
767
npm-shrinkwrap.json
generated
|
@ -22,6 +22,7 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@fortawesome/fontawesome-free": "^5.2.0",
|
||||
"admin-lte": "^2.4.8",
|
||||
"ajv": "^6.5.3",
|
||||
"blueimp-file-upload": "^9.18.0",
|
||||
"bootstrap": "^3.3.7",
|
||||
|
@ -40,7 +41,7 @@
|
|||
"less": "less/less.js#efa6eb5306f28a7ef7e235d79ce854b780345591",
|
||||
"less-loader": "^4.1.0",
|
||||
"papaparse": "^4.3.3",
|
||||
"select2": "^4.0.3",
|
||||
"select2": "^4.0.5",
|
||||
"tableexport.jquery.plugin": "^1.9.15",
|
||||
"tether": "^1.4.0",
|
||||
"vue-resource": "^1.3.3"
|
||||
|
|
BIN
public/css/AdminLTE.min.css
vendored
BIN
public/css/blue.png
Normal file
After Width: | Height: | Size: 1.1 KiB |
BIN
public/css/blue@2x.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
BIN
public/css/bootstrap-table.css
vendored
BIN
public/css/bootstrap-tables-sticky-header.css
vendored
BIN
public/css/bootstrap.css
vendored
BIN
public/css/bootstrap.datepicker.css
vendored
BIN
public/css/bootstrap.min.css
vendored
BIN
public/css/build/AdminLTE.css
Normal file
BIN
public/css/build/AdminLTE.css.map
Normal file
BIN
public/css/build/app.css.map
Normal file
BIN
public/css/dist/all.css
vendored
BIN
public/css/ekko-lightbox.min.css
vendored
BIN
public/css/font-awesome/font-awesome.css
vendored
BIN
public/css/font-awesome/font-awesome.min.css
vendored
BIN
public/css/jquery.typeahead.min.css
vendored
BIN
public/css/lib/bootstrap-wysihtml5.css
vendored
BIN
public/css/lib/bootstrap.datepicker.css
vendored
BIN
public/css/lib/font-awesome.css
vendored
BIN
public/css/lib/font-awesome.min.css
vendored
BIN
public/css/lib/jquery-ui-1.10.2.custom.css
vendored
Before Width: | Height: | Size: 845 B |
BIN
public/css/metisMenu.min.css
vendored
Before Width: | Height: | Size: 845 B |
BIN
public/css/signature-pad.min.css
vendored
Normal file
BIN
public/css/skins/_all-skins.min.css
vendored
BIN
public/css/skins/skin-blue-light.min.css
vendored
BIN
public/css/skins/skin-green-dark.min.css
vendored
Normal file
BIN
public/css/skins/skin-orange-dark.min.css
vendored
Normal file
BIN
public/css/skins/skin-red-dark.min.css
vendored
Normal file
Before Width: | Height: | Size: 434 KiB After Width: | Height: | Size: 434 KiB |
BIN
public/js/dist/all.js
vendored
|
@ -1,16 +1,20 @@
|
|||
{
|
||||
"/js/build/vue.js": "/js/build/vue.js?id=30fcbfa35e2c7c02bd8d",
|
||||
"/css/AdminLTE.css": "/css/AdminLTE.css?id=5e72463a66acbcc740d5",
|
||||
"/css/app.css": "/css/app.css?id=407edb63cc6b6dc62405",
|
||||
"/css/overrides.css": "/css/overrides.css?id=66c5fceedf2c98cc310b",
|
||||
"/js/build/vue.js.map": "/js/build/vue.js.map?id=0c3defbb09c3f1f6a581",
|
||||
"/css/AdminLTE.css.map": "/css/AdminLTE.css.map?id=0be7790b84909dca6a0a",
|
||||
"/css/app.css.map": "/css/app.css.map?id=96b5c985e860716e6a16",
|
||||
"/css/overrides.css.map": "/css/overrides.css.map?id=06e49ad87d99ddfd85d8",
|
||||
"/css/dist/all.css": "/css/dist/all.css?id=1a5af142704ac1cd4af7",
|
||||
"/js/dist/all.js": "/js/dist/all.js?id=cc4762447235ed643b40",
|
||||
"/css/build/all.css": "/css/build/all.css?id=1a5af142704ac1cd4af7",
|
||||
"/js/build/all.js": "/js/build/all.js?id=cc4762447235ed643b40",
|
||||
"/js/build/vue.js": "/js/build/vue.js?id=f89ed45026610831d45d",
|
||||
"/css/build/AdminLTE.css": "/css/build/AdminLTE.css?id=5002486f605469c322ed",
|
||||
"/css/build/app.css": "/css/build/app.css?id=0c4d55f9abe9a4efe526",
|
||||
"/js/build/vue.js.map": "/js/build/vue.js.map?id=3aae6e8f609e5cd2842a",
|
||||
"/css/build/AdminLTE.css.map": "/css/build/AdminLTE.css.map?id=fa40c591a5b361cb0761",
|
||||
"/css/build/app.css.map": "/css/build/app.css.map?id=5a1bc8c3be0d3da37d0a",
|
||||
"/css/all.css": "/css/all.css?id=d4da88a066c39e0ef7d0",
|
||||
"/css/skins/skin-green-dark.min.css": "/css/skins/skin-green-dark.min.css?id=1039ae0e198a7f3d8da7",
|
||||
"/css/skins/skin-orange-dark.min.css": "/css/skins/skin-orange-dark.min.css?id=9a461970f7ab07f40847",
|
||||
"/css/skins/skin-red-dark.min.css": "/css/skins/skin-red-dark.min.css?id=99f90bbd653d7db10795",
|
||||
"/css/signature-pad.css": "/css/signature-pad.css?id=6a89d3cd901305e66ced",
|
||||
"/css/signature-pad.min.css": "/css/signature-pad.min.css?id=6a89d3cd901305e66ced",
|
||||
"/css/blue.png": "/css/blue.png?id=e83a6c29e04fe851f212",
|
||||
"/css/blue@2x.png": "/css/blue@2x.png?id=51135dd4d24f88f5de0b",
|
||||
"/js/dist/all.js": "/js/dist/all.js?id=95ade195248bad430b49",
|
||||
"/js/build/all.js": "/js/build/all.js?id=95ade195248bad430b49",
|
||||
"/js/dist/bootstrap-table.js": "/js/dist/bootstrap-table.js?id=7223478ba9bf2c6dfb4f",
|
||||
"/js/dist/bootstrap-table-simple-view.js": "/js/dist/bootstrap-table-simple-view.js?id=3926b8f4aaad6ca20d31",
|
||||
"/css/dist/bootstrap-table.css": "/css/dist/bootstrap-table.css?id=8340c60bfbc12c34d2e6"
|
||||
|
|
2337
resources/assets/css/font-awesome/font-awesome.css
vendored
135
resources/assets/css/signature-pad.css
Executable file
|
@ -0,0 +1,135 @@
|
|||
|
||||
#signature-pad {
|
||||
padding-top: 250px;
|
||||
margin: auto;
|
||||
}
|
||||
.m-signature-pad {
|
||||
|
||||
position: relative;
|
||||
font-size: 10px;
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
border: 1px solid #e8e8e8;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.08) inset;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.m-signature-pad:before, .m-signature-pad:after {
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
content: "";
|
||||
width: 40%;
|
||||
height: 10px;
|
||||
left: 20px;
|
||||
bottom: 10px;
|
||||
background: transparent;
|
||||
-webkit-transform: skew(-3deg) rotate(-3deg);
|
||||
-moz-transform: skew(-3deg) rotate(-3deg);
|
||||
-ms-transform: skew(-3deg) rotate(-3deg);
|
||||
-o-transform: skew(-3deg) rotate(-3deg);
|
||||
transform: skew(-3deg) rotate(-3deg);
|
||||
box-shadow: 0 8px 12px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.m-signature-pad:after {
|
||||
left: auto;
|
||||
right: 20px;
|
||||
-webkit-transform: skew(3deg) rotate(3deg);
|
||||
-moz-transform: skew(3deg) rotate(3deg);
|
||||
-ms-transform: skew(3deg) rotate(3deg);
|
||||
-o-transform: skew(3deg) rotate(3deg);
|
||||
transform: skew(3deg) rotate(3deg);
|
||||
}
|
||||
|
||||
.m-signature-pad--body {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
bottom: 60px;
|
||||
border: 1px solid #f4f4f4;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.m-signature-pad--body
|
||||
canvas {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 0 5px rgba(0, 0, 0, 0.02) inset;
|
||||
}
|
||||
|
||||
.m-signature-pad--footer {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.m-signature-pad--footer
|
||||
.description {
|
||||
color: #C3C3C3;
|
||||
text-align: center;
|
||||
font-size: 1.2em;
|
||||
margin-top: 1.8em;
|
||||
}
|
||||
|
||||
.m-signature-pad--footer
|
||||
.button {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.m-signature-pad--footer
|
||||
.button.clear {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.m-signature-pad--footer
|
||||
.button.save {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
.m-signature-pad {
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: auto;
|
||||
height: auto;
|
||||
min-width: 250px;
|
||||
min-height: 140px;
|
||||
margin: 5%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-device-width: 768px) and (max-device-width: 1024px) {
|
||||
.m-signature-pad {
|
||||
margin: 10%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 320px) {
|
||||
.m-signature-pad--body {
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 32px;
|
||||
}
|
||||
.m-signature-pad--footer {
|
||||
left: 20px;
|
||||
right: 20px;
|
||||
bottom: 4px;
|
||||
height: 28px;
|
||||
}
|
||||
.m-signature-pad--footer
|
||||
.description {
|
||||
font-size: 1em;
|
||||
margin-top: 1em;
|
||||
}
|
||||
}
|
|
@ -19,6 +19,9 @@ a, a:link, a:visited, .btn-primary.hover {
|
|||
#assetsListingTable>tbody>tr.selected>td {
|
||||
background-color: var(--back-main);
|
||||
}
|
||||
body {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.box, .box.box-default {
|
||||
border-top: 3px solid var(--header);
|
||||
border-top-color: var(--header);
|
||||
|
@ -31,13 +34,17 @@ a, a:link, a:visited, .btn-primary.hover {
|
|||
background-color: var(--back-main);
|
||||
color: var(--header);
|
||||
}
|
||||
.btn-default:active, .btn-default:focus, .btn-default:hover {
|
||||
.btn-default:active, .btn-default:focus, .btn-default:hover, .btn-default.active {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.btn-primary, .btn-primary.hover, .btn-primary:active, .btn-primary:hover, .text-blue {
|
||||
.btn-primary, .btn-primary.hover, .btn-primary:active, .text-blue {
|
||||
color: var(--text-main)!important;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
background-color: var(--back-main);
|
||||
color: var(--header)!important;
|
||||
}
|
||||
#componentsTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
@ -47,14 +54,17 @@ a, a:link, a:visited, .btn-primary.hover {
|
|||
.content-wrapper {
|
||||
background-color: var(--background);
|
||||
}
|
||||
#create-form>div>div>div>span.input-group-addon {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
#create-form>div>div>div>span>i.fa {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover, .datepicker tfoot tr th:hover, .datepicker table tr td.day.focused, .datepicker table tr td.day:hover {
|
||||
background-color: var(--header);
|
||||
}
|
||||
.datepicker.dropdown-menu {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
#details>div>div>div>table {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
@ -70,7 +80,7 @@ a, a:link, a:visited, .btn-primary.hover {
|
|||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
h1 {
|
||||
h1, h2, h3, h4, h5, h6, p {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.help-block {
|
||||
|
@ -80,6 +90,10 @@ input[type=text], input[type=search] {
|
|||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.input-group, .input-group-addon {
|
||||
background-color: var(--back-sub)!important;
|
||||
color: var(--text-main);
|
||||
}
|
||||
#licensesTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
@ -87,6 +101,16 @@ input[type=text], input[type=search] {
|
|||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.main-header .navbar, .main-header .logo {
|
||||
background-color: var(--header);
|
||||
background: -webkit-linear-gradient(top, var(--header) 0%,var(--header) 100%);
|
||||
background: linear-gradient(to bottom, var(--header) 0%,var(--header) 100%);
|
||||
border-color: var(--header);
|
||||
}
|
||||
.modal-content {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.nav-tabs-custom>.nav-tabs>li>a, .nav-tabs-custom>.nav-tabs>li.active>a {
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
@ -119,13 +143,21 @@ input[type=text], input[type=search] {
|
|||
background-color: var(--back-main);
|
||||
color: var(--header);
|
||||
}
|
||||
.select2-selection--single {
|
||||
background-color: var(--back-sub)!important;
|
||||
color: var(--text-main)!important;
|
||||
.select2-container--default .select2-results__option[aria-selected=true], .select2-container--default .select2-results__option[aria-selected=true]:hover {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: var(--header);
|
||||
color: var(--back-main);
|
||||
}
|
||||
.select2-container--default .select2-selection--single .select2-selection__rendered {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.select2-selection--single {
|
||||
background-color: var(--back-sub)!important;
|
||||
color: var(--text-main)!important;
|
||||
}
|
||||
.select2-dropdown {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
|
@ -143,3 +175,6 @@ input[type=text], input[type=search] {
|
|||
.table-striped>tbody>tr:nth-of-type(odd) {
|
||||
background-color: var(--back-sub);
|
||||
}
|
||||
#webui>div>div>div>div>div>table>tbody>tr>td>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
181
resources/assets/css/skins/skin-orange-dark.css
Normal file
|
@ -0,0 +1,181 @@
|
|||
:root {
|
||||
--background: #222;
|
||||
--back-main: #333;
|
||||
--back-sub: #444;
|
||||
--header: #FF8C00; /* Use same as Header picker */
|
||||
--text-main: #FFF;
|
||||
--text-sub: #BBB;
|
||||
}
|
||||
|
||||
.main-header .navbar, .main-header .logo {
|
||||
background-color: var(--header);
|
||||
background: -webkit-linear-gradient(top, var(--header) 0%,var(--header) 100%);
|
||||
background: linear-gradient(to bottom, var(--header) 0%,var(--header) 100%);
|
||||
border-color: var(--header);
|
||||
}
|
||||
.modal-content {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
||||
a, a:link, a:visited, .btn-primary.hover {
|
||||
color: var(--header);
|
||||
}
|
||||
#accessoriesTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
#assetsListingTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
#assetsListingTable>tbody>tr.selected>td {
|
||||
background-color: var(--back-main);
|
||||
}
|
||||
body {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.box, .box.box-default {
|
||||
border-top: 3px solid var(--header);
|
||||
border-top-color: var(--header);
|
||||
}
|
||||
.box-body, .box-footer, .box-header {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.btn-default{
|
||||
background-color: var(--back-main);
|
||||
color: var(--header);
|
||||
}
|
||||
.btn-default:active, .btn-default:focus, .btn-default:hover, .btn-default.active {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.btn-primary, .btn-primary.hover, .btn-primary:active, .text-blue {
|
||||
color: var(--text-main)!important;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
background-color: var(--back-main);
|
||||
color: var(--header)!important;
|
||||
}
|
||||
#componentsTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
#consumablesTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.content-wrapper {
|
||||
background-color: var(--background);
|
||||
}
|
||||
#create-form>div>div>div>span>i.fa {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover, .datepicker tfoot tr th:hover, .datepicker table tr td.day.focused, .datepicker table tr td.day:hover {
|
||||
background-color: var(--header);
|
||||
}
|
||||
.datepicker.dropdown-menu {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
#details>div>div>div>table {
|
||||
background-color: transparent;
|
||||
}
|
||||
.dropdown-menu, .dropdown-menu>li>a {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.dropdown-menu>li>a:hover {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.form-control {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
h1, h2, h3, h4, h5, h6, p {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.help-block {
|
||||
color: var(--text-sub);
|
||||
}
|
||||
input[type=text], input[type=search] {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.input-group, .input-group-addon {
|
||||
background-color: var(--back-sub)!important;
|
||||
color: var(--text-main);
|
||||
}
|
||||
#licensesTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.main-footer {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.nav-tabs-custom>.nav-tabs>li>a, .nav-tabs-custom>.nav-tabs>li.active>a {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.nav-tabs-custom>.nav-tabs>li.active {
|
||||
border-top-color: var(--header);
|
||||
}
|
||||
.nav-tabs-custom>.nav-tabs>li.active>a {
|
||||
background-color: var(--back-main);
|
||||
}
|
||||
.nav-tabs-custom>.nav-tabs>li.active>a:hover {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.nav-tabs-custom, .nav-tabs-custom>.tab-content {
|
||||
background-color: var(--back-main);
|
||||
}
|
||||
.navbar-nav>.tasks-menu>.dropdown-menu>li.header {
|
||||
background-color: var(--back-main);
|
||||
color: var(--header);
|
||||
}
|
||||
.open>.dropdown-toggle.btn-default {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.panel {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.panel-default>.panel-heading {
|
||||
background-color: var(--back-main);
|
||||
color: var(--header);
|
||||
}
|
||||
.select2-container--default .select2-results__option[aria-selected=true], .select2-container--default .select2-results__option[aria-selected=true]:hover {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: var(--header);
|
||||
color: var(--back-main);
|
||||
}
|
||||
.select2-container--default .select2-selection--single .select2-selection__rendered {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.select2-selection--single {
|
||||
background-color: var(--back-sub)!important;
|
||||
color: var(--text-main)!important;
|
||||
}
|
||||
.select2-dropdown {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.skin-blue .main-header .navbar .dropdown-menu li a {
|
||||
color: var(--header);
|
||||
}
|
||||
.skin-blue .sidebar-menu>li.active>a, .skin-blue .sidebar-menu>li:hover>a, .sidebar-toggle:hover {
|
||||
background-color: var(--header)!important;
|
||||
}
|
||||
.tab-content, .tab-pane {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.table-striped>tbody>tr:nth-of-type(odd) {
|
||||
background-color: var(--back-sub);
|
||||
}
|
||||
#webui>div>div>div>div>div>table>tbody>tr>td>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
182
resources/assets/css/skins/skin-red-dark.css
Normal file
|
@ -0,0 +1,182 @@
|
|||
:root {
|
||||
--background: #222;
|
||||
--back-main: #333;
|
||||
--back-sub: #444;
|
||||
--header: #ad0c0c; /* Use same as Header picker */
|
||||
--text-main: #FFF;
|
||||
--text-sub: #BBB;
|
||||
}
|
||||
|
||||
.main-header .navbar, .main-header .logo {
|
||||
background-color: var(--header);
|
||||
background: -webkit-linear-gradient(top, var(--header) 0%,var(--header) 100%);
|
||||
background: linear-gradient(to bottom, var(--header) 0%,var(--header) 100%);
|
||||
border-color: var(--header);
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
||||
a, a:link, a:visited, .btn-primary.hover {
|
||||
color: var(--header);
|
||||
}
|
||||
#accessoriesTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
#assetsListingTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
#assetsListingTable>tbody>tr.selected>td {
|
||||
background-color: var(--back-main);
|
||||
}
|
||||
body {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.box, .box.box-default {
|
||||
border-top: 3px solid var(--header);
|
||||
border-top-color: var(--header);
|
||||
}
|
||||
.box-body, .box-footer, .box-header {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.btn-default{
|
||||
background-color: var(--back-main);
|
||||
color: var(--header);
|
||||
}
|
||||
.btn-default:active, .btn-default:focus, .btn-default:hover, .btn-default.active {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.btn-primary, .btn-primary.hover, .btn-primary:active, .text-blue {
|
||||
color: var(--text-main)!important;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
background-color: var(--back-main);
|
||||
color: var(--header)!important;
|
||||
}
|
||||
#componentsTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
#consumablesTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.content-wrapper {
|
||||
background-color: var(--background);
|
||||
}
|
||||
#create-form>div>div>div>span>i.fa {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover, .datepicker tfoot tr th:hover, .datepicker table tr td.day.focused, .datepicker table tr td.day:hover {
|
||||
background-color: var(--header);
|
||||
}
|
||||
.datepicker.dropdown-menu {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
#details>div>div>div>table {
|
||||
background-color: transparent;
|
||||
}
|
||||
.dropdown-menu, .dropdown-menu>li>a {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.dropdown-menu>li>a:hover {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.form-control {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
h1, h2, h3, h4, h5, h6, p {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.help-block {
|
||||
color: var(--text-sub);
|
||||
}
|
||||
input[type=text], input[type=search] {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.input-group, .input-group-addon {
|
||||
background-color: var(--back-sub)!important;
|
||||
color: var(--text-main);
|
||||
}
|
||||
#licensesTable>tbody>tr>td>nobr>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.main-footer {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.nav-tabs-custom>.nav-tabs>li>a, .nav-tabs-custom>.nav-tabs>li.active>a {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.nav-tabs-custom>.nav-tabs>li.active {
|
||||
border-top-color: var(--header);
|
||||
}
|
||||
.nav-tabs-custom>.nav-tabs>li.active>a {
|
||||
background-color: var(--back-main);
|
||||
}
|
||||
.nav-tabs-custom>.nav-tabs>li.active>a:hover {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.nav-tabs-custom, .nav-tabs-custom>.tab-content {
|
||||
background-color: var(--back-main);
|
||||
}
|
||||
.navbar-nav>.tasks-menu>.dropdown-menu>li.header {
|
||||
background-color: var(--back-main);
|
||||
color: var(--header);
|
||||
}
|
||||
.open>.dropdown-toggle.btn-default {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.panel {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.panel-default>.panel-heading {
|
||||
background-color: var(--back-main);
|
||||
color: var(--header);
|
||||
}
|
||||
.select2-container--default .select2-results__option[aria-selected=true], .select2-container--default .select2-results__option[aria-selected=true]:hover {
|
||||
background-color: var(--back-sub);
|
||||
color: var(--header);
|
||||
}
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: var(--header);
|
||||
color: var(--back-main);
|
||||
}
|
||||
.select2-container--default .select2-selection--single .select2-selection__rendered {
|
||||
color: var(--text-main);
|
||||
}
|
||||
.select2-selection--single {
|
||||
background-color: var(--back-sub)!important;
|
||||
color: var(--text-main)!important;
|
||||
}
|
||||
.select2-dropdown {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.skin-blue .main-header .navbar .dropdown-menu li a {
|
||||
color: var(--header);
|
||||
}
|
||||
.skin-blue .sidebar-menu>li.active>a, .skin-blue .sidebar-menu>li:hover>a, .sidebar-toggle:hover {
|
||||
background-color: var(--header)!important;
|
||||
}
|
||||
.tab-content, .tab-pane {
|
||||
background-color: var(--back-main);
|
||||
color: var(--text-main);
|
||||
}
|
||||
.table-striped>tbody>tr:nth-of-type(odd) {
|
||||
background-color: var(--back-sub);
|
||||
}
|
||||
#webui>div>div>div>div>div>table>tbody>tr>td>a>i.fa {
|
||||
color: var(--text-main);
|
||||
}
|
|
@ -1,23 +0,0 @@
|
|||
{
|
||||
"adjoining-classes": false,
|
||||
"box-sizing": false,
|
||||
"box-model": false,
|
||||
"compatible-vendor-prefixes": false,
|
||||
"floats": false,
|
||||
"font-sizes": false,
|
||||
"gradients": false,
|
||||
"important": false,
|
||||
"known-properties": false,
|
||||
"outline-none": false,
|
||||
"qualified-headings": false,
|
||||
"regex-selectors": false,
|
||||
"shorthand": false,
|
||||
"text-indent": false,
|
||||
"unique-headings": false,
|
||||
"universal-selector": false,
|
||||
"unqualified-attributes": false,
|
||||
"ids": false,
|
||||
"fallback-colors": false,
|
||||
"vendor-prefix": false,
|
||||
"import": false
|
||||
}
|
|
@ -1,36 +0,0 @@
|
|||
/*
|
||||
* Page: 400 and 500 error pages
|
||||
* ------------------------------
|
||||
*/
|
||||
.error-page {
|
||||
width: 600px;
|
||||
margin: 20px auto 0 auto;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
width: 100%;
|
||||
}
|
||||
//For the error number e.g: 404
|
||||
> .headline {
|
||||
float: left;
|
||||
font-size: 100px;
|
||||
font-weight: 300;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
float: none;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
//For the message
|
||||
> .error-content {
|
||||
margin-left: 190px;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
margin-left: 0;
|
||||
}
|
||||
> h3 {
|
||||
font-weight: 300;
|
||||
font-size: 25px;
|
||||
@media(max-width: @screen-sm-max) {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
display: block;
|
||||
}
|
||||
}
|
|
@ -1,61 +1,72 @@
|
|||
/*!
|
||||
* AdminLTE v2.3.0
|
||||
* AdminLTE v2.4.8
|
||||
* Author: Almsaeed Studio
|
||||
* Website: Almsaeed Studio <http://almsaeedstudio.com>
|
||||
* Website: Almsaeed Studio <https://adminlte.io>
|
||||
* License: Open source - MIT
|
||||
* Please visit http://opensource.org/licenses/MIT for more information
|
||||
!*/
|
||||
*/
|
||||
|
||||
|
||||
//Bootstrap Variables & Mixins
|
||||
//The core bootstrap code have not been modified. These files
|
||||
//are included only for reference.
|
||||
@import "../less/bootstrap-less/mixins.less";
|
||||
@import "../less/bootstrap-less/variables.less";
|
||||
// We are going to overide some settings
|
||||
|
||||
//MISC
|
||||
//----
|
||||
@import "core.less";
|
||||
@import "variables.less";
|
||||
@import "mixins.less";
|
||||
// Bootstrap
|
||||
//--------------------------------------------------------
|
||||
@import (reference) "../../../node_modules/admin-lte/build/bootstrap-less/mixins";
|
||||
@import (reference) "../../../node_modules/admin-lte/build/bootstrap-less/variables";
|
||||
|
||||
//COMPONENTS
|
||||
//-----------
|
||||
@import "header.less";
|
||||
@import "sidebar.less";
|
||||
@import "sidebar-mini.less";
|
||||
@import "control-sidebar.less";
|
||||
@import "dropdown.less";
|
||||
@import "forms.less";
|
||||
@import "progress-bars.less";
|
||||
@import "small-box.less";
|
||||
@import "boxes.less";
|
||||
@import "info-box.less";
|
||||
@import "buttons.less";
|
||||
@import "callout.less";
|
||||
@import "alerts.less";
|
||||
@import "navs.less";
|
||||
@import "table.less";
|
||||
@import "labels.less";
|
||||
@import "modal.less";
|
||||
// MISC
|
||||
//--------------------------------------------------------
|
||||
@import "../../../node_modules/admin-lte/build/less/core";
|
||||
@import "../../../node_modules/admin-lte/build/less/variables";
|
||||
@import "../../../node_modules/admin-lte/build/less/mixins";
|
||||
|
||||
//HELPERS
|
||||
//-----------
|
||||
@import "spacing.less";
|
||||
// COMPONENTS
|
||||
//--------------------------------------------------------
|
||||
@import "../../../node_modules/admin-lte/build/less/header";
|
||||
@import "../../../node_modules/admin-lte/build/less/sidebar";
|
||||
@import "../../../node_modules/admin-lte/build/less/sidebar-mini";
|
||||
@import "../../../node_modules/admin-lte/build/less/control-sidebar";
|
||||
@import "../../../node_modules/admin-lte/build/less/dropdown";
|
||||
@import "../../../node_modules/admin-lte/build/less/forms";
|
||||
@import "../../../node_modules/admin-lte/build/less/progress-bars";
|
||||
@import "../../../node_modules/admin-lte/build/less/small-box";
|
||||
@import "../../../node_modules/admin-lte/build/less/boxes";
|
||||
@import "../../../node_modules/admin-lte/build/less/info-box";
|
||||
@import "../../../node_modules/admin-lte/build/less/timeline";
|
||||
@import "../../../node_modules/admin-lte/build/less/buttons";
|
||||
@import "../../../node_modules/admin-lte/build/less/callout";
|
||||
@import "../../../node_modules/admin-lte/build/less/alerts";
|
||||
@import "../../../node_modules/admin-lte/build/less/navs";
|
||||
@import "../../../node_modules/admin-lte/build/less/products";
|
||||
@import "../../../node_modules/admin-lte/build/less/table";
|
||||
@import "../../../node_modules/admin-lte/build/less/labels";
|
||||
// @import "direct-chat";
|
||||
@import "../../../node_modules/admin-lte/build/less/users-list";
|
||||
@import "../../../node_modules/admin-lte/build/less/carousel";
|
||||
@import "../../../node_modules/admin-lte/build/less/modal";
|
||||
@import "../../../node_modules/admin-lte/build/less/social-widgets";
|
||||
@import "../../../node_modules/admin-lte/build/less/treeview";
|
||||
|
||||
//PAGES
|
||||
//------
|
||||
@import "login_and_register.less";
|
||||
// PAGES
|
||||
//--------------------------------------------------------
|
||||
@import "../../../node_modules/admin-lte/build/less/mailbox";
|
||||
@import "../../../node_modules/admin-lte/build/less/lockscreen";
|
||||
@import "../../../node_modules/admin-lte/build/less/login_and_register";
|
||||
@import "../../../node_modules/admin-lte/build/less/404_500_errors";
|
||||
@import "../../../node_modules/admin-lte/build/less/invoice";
|
||||
@import "../../../node_modules/admin-lte/build/less/profile";
|
||||
|
||||
//Plugins
|
||||
//--------
|
||||
// @import "bootstrap-social.less";
|
||||
//@import "fullcalendar.less";
|
||||
@import "select2.less";
|
||||
// Plugins - Import only the plugins we use
|
||||
//--------------------------------------------------------
|
||||
// @import "plugins";
|
||||
@import "../../../node_modules/admin-lte/build/less/select2.less"; // IMPORTANT the .less extension is needed
|
||||
@import "../../../node_modules/admin-lte/build/less/datepicker";
|
||||
|
||||
//Miscellaneous
|
||||
//-------------
|
||||
@import "miscellaneous.less";
|
||||
@import "print.less";
|
||||
// Miscellaneous
|
||||
//--------------------------------------------------------
|
||||
@import "../../../node_modules/admin-lte/build/less/miscellaneous";
|
||||
@import "../../../node_modules/admin-lte/build/less/print";
|
||||
|
||||
@import "skins/skin-blue.less";
|
||||
// Theme
|
||||
//--------------------------------------------------------
|
||||
@import "../../../node_modules/admin-lte/build/less/skins/skin-blue.less";
|
||||
|
|
|
@ -1,44 +0,0 @@
|
|||
/*
|
||||
* Component: alert
|
||||
* ----------------
|
||||
*/
|
||||
|
||||
.alert {
|
||||
.border-radius(3px);
|
||||
h4 {
|
||||
font-weight: 600;
|
||||
}
|
||||
.icon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.close {
|
||||
color: #000;
|
||||
.opacity(.2);
|
||||
&:hover {
|
||||
.opacity(.5);
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
//Alert Variants
|
||||
.alert-success {
|
||||
&:extend(.bg-green);
|
||||
border-color: darken(@green, 5%);
|
||||
}
|
||||
.alert-danger,
|
||||
.alert-error {
|
||||
&:extend(.bg-red);
|
||||
border-color: darken(@red, 5%);
|
||||
}
|
||||
.alert-warning {
|
||||
&:extend(.bg-yellow);
|
||||
border-color: darken(@yellow, 5%);
|
||||
}
|
||||
.alert-info {
|
||||
&:extend(.bg-aqua);
|
||||
border-color: darken(@aqua, 5%);
|
||||
}
|
|
@ -1,7 +1,458 @@
|
|||
@icon-font-path: "../fonts";
|
||||
|
||||
@icon-font-path: '../fonts';
|
||||
@import "../../../node_modules/bootstrap-less/bootstrap/bootstrap";
|
||||
@import "../../../node_modules/ekko-lightbox/ekko-lightbox";
|
||||
@import "../../../node_modules/bootstrap-colorpicker/src/less/colorpicker";
|
||||
|
||||
@import '../../../node_modules/bootstrap-less/bootstrap/bootstrap';
|
||||
@import '../../../node_modules/ekko-lightbox/ekko-lightbox';
|
||||
@import '../../../node_modules/bootstrap-colorpicker/src/less/colorpicker';
|
||||
@import "spacing.less";
|
||||
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
|
||||
"Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
|
||||
sans-serif;
|
||||
font-size: 13px;
|
||||
}
|
||||
// Moved from default.blade.php
|
||||
@media (max-width: 400px) {
|
||||
.navbar-left {
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.nav::after {
|
||||
clear: none;
|
||||
}
|
||||
}
|
||||
|
||||
.skin-blue .main-header .logo {
|
||||
background-color: inherit !important;
|
||||
}
|
||||
.main-header .logo {
|
||||
width: 100% !important;
|
||||
white-space: nowrap;
|
||||
text-align: left;
|
||||
display: block;
|
||||
clear: both;
|
||||
//text-overflow: hidden;
|
||||
}
|
||||
|
||||
.huge {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.btn-file {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.dropdown-menu > li > a {
|
||||
color: #354044;
|
||||
}
|
||||
|
||||
#sort tr.cansort {
|
||||
border-radius: 2px;
|
||||
padding: 10px;
|
||||
background: #f4f4f4;
|
||||
margin-bottom: 3px;
|
||||
border-left: 2px solid #e6e7e8;
|
||||
color: #444;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.user-image-inline {
|
||||
float: left;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.input-group .input-group-addon {
|
||||
background-color: #f4f4f4;
|
||||
}
|
||||
|
||||
a.accordion-header {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.dynamic-form-row {
|
||||
padding: 10px;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.handle {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.btn-file input[type="file"] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
font-size: 100px;
|
||||
text-align: right;
|
||||
filter: alpha(opacity=0);
|
||||
opacity: 0;
|
||||
outline: none;
|
||||
background: white;
|
||||
cursor: inherit;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.main-footer {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.main-header {
|
||||
max-height: 150px;
|
||||
}
|
||||
|
||||
.navbar-nav > .user-menu > .dropdown-menu {
|
||||
width: inherit;
|
||||
}
|
||||
|
||||
.main-header .logo {
|
||||
padding: 0px 5px 0px 15px;
|
||||
}
|
||||
|
||||
.sidebar-toggle {
|
||||
margin-left: -48px;
|
||||
z-index: 100;
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
.sidebar-toggle-mobile {
|
||||
z-index: 100;
|
||||
width: 50px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
// .skin-blue .main-header .navbar .dropdown-menu li a {
|
||||
// //color: inherit;
|
||||
// }
|
||||
|
||||
.main-header .sidebar-toggle:before {
|
||||
content: "\f0c9";
|
||||
}
|
||||
|
||||
.direct-chat-contacts {
|
||||
padding: 10px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.select2-container {
|
||||
width: 100%;
|
||||
}
|
||||
.error input {
|
||||
color: #dd4b39;
|
||||
border: 2px solid #dd4b39 !important;
|
||||
}
|
||||
|
||||
.error label,
|
||||
.alert-msg {
|
||||
color: #dd4b39;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.input-group[class*="col-"] {
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.control-label.multiline {
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.btn-outline {
|
||||
color: inherit;
|
||||
background-color: transparent;
|
||||
transition: all 0.5s;
|
||||
}
|
||||
|
||||
.btn-primary.btn-outline {
|
||||
color: #428bca;
|
||||
}
|
||||
|
||||
.btn-success.btn-outline {
|
||||
color: #5cb85c;
|
||||
}
|
||||
|
||||
.btn-info.btn-outline {
|
||||
color: #5bc0de;
|
||||
}
|
||||
|
||||
.btn-warning.btn-outline {
|
||||
color: #f0ad4e;
|
||||
}
|
||||
|
||||
.btn-danger.btn-outline {
|
||||
color: #d9534f;
|
||||
}
|
||||
|
||||
.btn-primary.btn-outline:hover,
|
||||
.btn-success.btn-outline:hover,
|
||||
.btn-info.btn-outline:hover,
|
||||
.btn-warning.btn-outline:hover,
|
||||
.btn-danger.btn-outline:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.slideout-menu {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: -250px;
|
||||
width: 250px;
|
||||
height: 100%;
|
||||
background: #333;
|
||||
z-index: 100;
|
||||
margin-top: 100px;
|
||||
color: white;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.slideout-menu h3 {
|
||||
position: relative;
|
||||
padding: 5px 5px;
|
||||
color: #fff;
|
||||
font-size: 1.2em;
|
||||
font-weight: 400;
|
||||
border-bottom: 4px solid #222;
|
||||
}
|
||||
|
||||
.slideout-menu .slideout-menu-toggle {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
right: 10px;
|
||||
display: inline-block;
|
||||
padding: 6px 9px 5px;
|
||||
font-family: Arial, sans-serif;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
background: #222;
|
||||
color: #999;
|
||||
text-decoration: none;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.slideout-menu .slideout-menu-toggle:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.slideout-menu ul {
|
||||
list-style: none;
|
||||
font-weight: 300;
|
||||
border-top: 1px solid #151515;
|
||||
border-bottom: 1px solid #454545;
|
||||
}
|
||||
|
||||
.slideout-menu ul li {
|
||||
border-top: 1px solid #454545;
|
||||
border-bottom: 1px solid #151515;
|
||||
}
|
||||
|
||||
.slideout-menu ul li a {
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 10px;
|
||||
color: #999;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.slideout-menu ul li a:hover {
|
||||
background: #000;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.slideout-menu ul li a i {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 10px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.btn-box-tool-lg {
|
||||
font-size: 16px;
|
||||
color: orange;
|
||||
}
|
||||
|
||||
/*Form Wizard*/
|
||||
.bs-wizard {
|
||||
margin-top: 20px;
|
||||
border-bottom: solid 1px #e0e0e0;
|
||||
padding: 0 0 10px 0;
|
||||
}
|
||||
.bs-wizard > .bs-wizard-step {
|
||||
padding: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// .bs-wizard > .bs-wizard-step + .bs-wizard-step {}
|
||||
|
||||
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum {
|
||||
color: #595959;
|
||||
font-size: 16px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step .bs-wizard-info {
|
||||
color: #999;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step > .bs-wizard-dot {
|
||||
position: absolute;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
display: block;
|
||||
background: #fbe8aa;
|
||||
top: 45px;
|
||||
left: 50%;
|
||||
margin-top: -15px;
|
||||
margin-left: -15px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {
|
||||
content: " ";
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
background: #fbbd19;
|
||||
border-radius: 50px;
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 8px;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step > .progress {
|
||||
position: relative;
|
||||
border-radius: 0px;
|
||||
height: 8px;
|
||||
box-shadow: none;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step > .progress > .progress-bar {
|
||||
width: 0px;
|
||||
box-shadow: none;
|
||||
background: #fbe8aa;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {
|
||||
width: 0%;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step:first-child > .progress {
|
||||
left: 50%;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step:last-child > .progress {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot {
|
||||
pointer-events: none;
|
||||
}
|
||||
/*END Form Wizard*/
|
||||
|
||||
.left-navblock {
|
||||
display: inline-block;
|
||||
// float: left;
|
||||
text-align: left;
|
||||
color: white;
|
||||
padding: 0px;
|
||||
/* adjust based on your layout */
|
||||
}
|
||||
|
||||
.skin-blue .main-header .navbar .dropdown-menu li a {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
a.logo.no-hover a:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.required {
|
||||
border-right: 6px solid orange;
|
||||
}
|
||||
|
||||
.sidebar-menu {
|
||||
font-size: 14px;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
@media print {
|
||||
a[href]:after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.tab-content > .tab-pane {
|
||||
display: block !important;
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
}
|
||||
}
|
||||
|
||||
img.navbar-brand-img,
|
||||
.navbar-brand > img {
|
||||
float: left;
|
||||
padding: 5px 5px 5px 0;
|
||||
max-height: 50px;
|
||||
}
|
||||
|
||||
.input-daterange {
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
.btn.bg-maroon,
|
||||
.btn.bg-purple {
|
||||
min-width: 90px;
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#toolbar {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
#uploadPreview {
|
||||
border-color: grey;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.icon-med {
|
||||
font-size: 20px;
|
||||
color: #889195;
|
||||
}
|
||||
|
||||
#login-logo {
|
||||
padding-top: 20px;
|
||||
padding-bottom: 10px;
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
.left-navblock {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
|
|
@ -1,39 +0,0 @@
|
|||
// Mixins
|
||||
// --------------------------------------------------
|
||||
|
||||
// Utilities
|
||||
@import "mixins/hide-text.less";
|
||||
@import "mixins/opacity.less";
|
||||
@import "mixins/image.less";
|
||||
@import "mixins/labels.less";
|
||||
@import "mixins/reset-filter.less";
|
||||
@import "mixins/resize.less";
|
||||
@import "mixins/responsive-visibility.less";
|
||||
@import "mixins/size.less";
|
||||
@import "mixins/tab-focus.less";
|
||||
@import "mixins/text-emphasis.less";
|
||||
@import "mixins/text-overflow.less";
|
||||
@import "mixins/vendor-prefixes.less";
|
||||
|
||||
// Components
|
||||
@import "mixins/alerts.less";
|
||||
@import "mixins/buttons.less";
|
||||
@import "mixins/panels.less";
|
||||
@import "mixins/pagination.less";
|
||||
@import "mixins/list-group.less";
|
||||
@import "mixins/nav-divider.less";
|
||||
@import "mixins/forms.less";
|
||||
@import "mixins/progress-bar.less";
|
||||
@import "mixins/table-row.less";
|
||||
|
||||
// Skins
|
||||
@import "mixins/background-variant.less";
|
||||
@import "mixins/border-radius.less";
|
||||
@import "mixins/gradients.less";
|
||||
|
||||
// Layout
|
||||
@import "mixins/clearfix.less";
|
||||
@import "mixins/center-block.less";
|
||||
@import "mixins/nav-vertical-align.less";
|
||||
@import "mixins/grid-framework.less";
|
||||
@import "mixins/grid.less";
|
|
@ -1,14 +0,0 @@
|
|||
// Alerts
|
||||
|
||||
.alert-variant(@background; @border; @text-color) {
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
color: @text-color;
|
||||
|
||||
hr {
|
||||
border-top-color: darken(@border, 5%);
|
||||
}
|
||||
.alert-link {
|
||||
color: darken(@text-color, 10%);
|
||||
}
|
||||
}
|
|
@ -1,8 +0,0 @@
|
|||
// Contextual backgrounds
|
||||
|
||||
.bg-variant(@color) {
|
||||
background-color: @color;
|
||||
a&:hover {
|
||||
background-color: darken(@color, 10%);
|
||||
}
|
||||
}
|
|
@ -1,18 +0,0 @@
|
|||
// Single side border-radius
|
||||
|
||||
.border-top-radius(@radius) {
|
||||
border-top-right-radius: @radius;
|
||||
border-top-left-radius: @radius;
|
||||
}
|
||||
.border-right-radius(@radius) {
|
||||
border-bottom-right-radius: @radius;
|
||||
border-top-right-radius: @radius;
|
||||
}
|
||||
.border-bottom-radius(@radius) {
|
||||
border-bottom-right-radius: @radius;
|
||||
border-bottom-left-radius: @radius;
|
||||
}
|
||||
.border-left-radius(@radius) {
|
||||
border-bottom-left-radius: @radius;
|
||||
border-top-left-radius: @radius;
|
||||
}
|
|
@ -1,52 +0,0 @@
|
|||
// Button variants
|
||||
//
|
||||
// Easily pump out default styles, as well as :hover, :focus, :active,
|
||||
// and disabled options for all buttons
|
||||
|
||||
.button-variant(@color; @background; @border) {
|
||||
color: @color;
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus,
|
||||
&:active,
|
||||
&.active,
|
||||
.open > .dropdown-toggle& {
|
||||
color: @color;
|
||||
background-color: darken(@background, 10%);
|
||||
border-color: darken(@border, 12%);
|
||||
}
|
||||
&:active,
|
||||
&.active,
|
||||
.open > .dropdown-toggle& {
|
||||
background-image: none;
|
||||
}
|
||||
&.disabled,
|
||||
&[disabled],
|
||||
fieldset[disabled] & {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus,
|
||||
&:active,
|
||||
&.active {
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
}
|
||||
}
|
||||
|
||||
.badge {
|
||||
color: @background;
|
||||
background-color: @color;
|
||||
}
|
||||
}
|
||||
|
||||
// Button sizes
|
||||
.button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
|
||||
padding: @padding-vertical @padding-horizontal;
|
||||
font-size: @font-size;
|
||||
line-height: @line-height;
|
||||
border-radius: @border-radius;
|
||||
}
|
|
@ -1,7 +0,0 @@
|
|||
// Center-align a block level element
|
||||
|
||||
.center-block() {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
|
@ -1,22 +0,0 @@
|
|||
// Clearfix
|
||||
//
|
||||
// For modern browsers
|
||||
// 1. The space content is one way to avoid an Opera bug when the
|
||||
// contenteditable attribute is included anywhere else in the document.
|
||||
// Otherwise it causes space to appear at the top and bottom of elements
|
||||
// that are clearfixed.
|
||||
// 2. The use of `table` rather than `block` is only necessary if using
|
||||
// `:before` to contain the top-margins of child elements.
|
||||
//
|
||||
// Source: http://nicolasgallagher.com/micro-clearfix-hack/
|
||||
|
||||
.clearfix() {
|
||||
&:before,
|
||||
&:after {
|
||||
content: " "; // 1
|
||||
display: table; // 2
|
||||
}
|
||||
&:after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
|
@ -1,85 +0,0 @@
|
|||
// Form validation states
|
||||
//
|
||||
// Used in forms.less to generate the form validation CSS for warnings, errors,
|
||||
// and successes.
|
||||
|
||||
.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) {
|
||||
// Color the label and help text
|
||||
.help-block,
|
||||
.control-label,
|
||||
.radio,
|
||||
.checkbox,
|
||||
.radio-inline,
|
||||
.checkbox-inline,
|
||||
&.radio label,
|
||||
&.checkbox label,
|
||||
&.radio-inline label,
|
||||
&.checkbox-inline label {
|
||||
color: @text-color;
|
||||
}
|
||||
// Set the border and box shadow on specific inputs to match
|
||||
.form-control {
|
||||
border-color: @border-color;
|
||||
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
|
||||
&:focus {
|
||||
border-color: darken(@border-color, 10%);
|
||||
@shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%);
|
||||
.box-shadow(@shadow);
|
||||
}
|
||||
}
|
||||
// Set validation states also for addons
|
||||
.input-group-addon {
|
||||
color: @text-color;
|
||||
border-color: @border-color;
|
||||
background-color: @background-color;
|
||||
}
|
||||
// Optional feedback icon
|
||||
.form-control-feedback {
|
||||
color: @text-color;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Form control focus state
|
||||
//
|
||||
// Generate a customized focus state and for any input with the specified color,
|
||||
// which defaults to the `@input-border-focus` variable.
|
||||
//
|
||||
// We highly encourage you to not customize the default value, but instead use
|
||||
// this to tweak colors on an as-needed basis. This aesthetic change is based on
|
||||
// WebKit's default styles, but applicable to a wider range of browsers. Its
|
||||
// usability and accessibility should be taken into account with any change.
|
||||
//
|
||||
// Example usage: change the default blue border and shadow to white for better
|
||||
// contrast against a dark gray background.
|
||||
.form-control-focus(@color: @input-border-focus) {
|
||||
@color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
|
||||
&:focus {
|
||||
border-color: @color;
|
||||
outline: 0;
|
||||
.box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}");
|
||||
}
|
||||
}
|
||||
|
||||
// Form control sizing
|
||||
//
|
||||
// Relative text size, padding, and border-radii changes for form controls. For
|
||||
// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
|
||||
// element gets special love because it's special, and that's a fact!
|
||||
.input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
|
||||
height: @input-height;
|
||||
padding: @padding-vertical @padding-horizontal;
|
||||
font-size: @font-size;
|
||||
line-height: @line-height;
|
||||
border-radius: @border-radius;
|
||||
|
||||
select& {
|
||||
height: @input-height;
|
||||
line-height: @input-height;
|
||||
}
|
||||
|
||||
textarea&,
|
||||
select[multiple]& {
|
||||
height: auto;
|
||||
}
|
||||
}
|
|
@ -1,59 +0,0 @@
|
|||
// Gradients
|
||||
|
||||
#gradient {
|
||||
|
||||
// Horizontal gradient, from left to right
|
||||
//
|
||||
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
||||
// Color stops are not available in IE9 and below.
|
||||
.horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
|
||||
background-image: -webkit-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // Safari 5.1-6, Chrome 10+
|
||||
background-image: -o-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // Opera 12
|
||||
background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
|
||||
background-repeat: repeat-x;
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down
|
||||
}
|
||||
|
||||
// Vertical gradient, from top to bottom
|
||||
//
|
||||
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
||||
// Color stops are not available in IE9 and below.
|
||||
.vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
|
||||
background-image: -webkit-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Safari 5.1-6, Chrome 10+
|
||||
background-image: -o-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Opera 12
|
||||
background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
|
||||
background-repeat: repeat-x;
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down
|
||||
}
|
||||
|
||||
.directional(@start-color: #555; @end-color: #333; @deg: 45deg) {
|
||||
background-repeat: repeat-x;
|
||||
background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1-6, Chrome 10+
|
||||
background-image: -o-linear-gradient(@deg, @start-color, @end-color); // Opera 12
|
||||
background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
|
||||
}
|
||||
.horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
|
||||
background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
|
||||
background-image: -o-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
|
||||
background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color);
|
||||
background-repeat: no-repeat;
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
|
||||
}
|
||||
.vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
|
||||
background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color);
|
||||
background-image: -o-linear-gradient(@start-color, @mid-color @color-stop, @end-color);
|
||||
background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color);
|
||||
background-repeat: no-repeat;
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
|
||||
}
|
||||
.radial(@inner-color: #555; @outer-color: #333) {
|
||||
background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color);
|
||||
background-image: radial-gradient(circle, @inner-color, @outer-color);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.striped(@color: rgba(255,255,255,.15); @angle: 45deg) {
|
||||
background-image: -webkit-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);
|
||||
background-image: -o-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);
|
||||
background-image: linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);
|
||||
}
|
||||
}
|
|
@ -1,91 +0,0 @@
|
|||
// Framework grid generation
|
||||
//
|
||||
// Used only by Bootstrap to generate the correct number of grid classes given
|
||||
// any value of `@grid-columns`.
|
||||
|
||||
.make-grid-columns() {
|
||||
// Common styles for all sizes of grid columns, widths 1-12
|
||||
.col(@index) { // initial
|
||||
@item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
|
||||
.col((@index + 1), @item);
|
||||
}
|
||||
.col(@index, @list) when (@index =< @grid-columns) { // general; "=<" isn't a typo
|
||||
@item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
|
||||
.col((@index + 1), ~"@{list}, @{item}");
|
||||
}
|
||||
.col(@index, @list) when (@index > @grid-columns) { // terminal
|
||||
@{list} {
|
||||
position: relative;
|
||||
// Prevent columns from collapsing when empty
|
||||
min-height: 1px;
|
||||
// Inner gutter via padding
|
||||
padding-left: (@grid-gutter-width / 2);
|
||||
padding-right: (@grid-gutter-width / 2);
|
||||
}
|
||||
}
|
||||
.col(1); // kickstart it
|
||||
}
|
||||
|
||||
.float-grid-columns(@class) {
|
||||
.col(@index) { // initial
|
||||
@item: ~".col-@{class}-@{index}";
|
||||
.col((@index + 1), @item);
|
||||
}
|
||||
.col(@index, @list) when (@index =< @grid-columns) { // general
|
||||
@item: ~".col-@{class}-@{index}";
|
||||
.col((@index + 1), ~"@{list}, @{item}");
|
||||
}
|
||||
.col(@index, @list) when (@index > @grid-columns) { // terminal
|
||||
@{list} {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
.col(1); // kickstart it
|
||||
}
|
||||
|
||||
.calc-grid-column(@index, @class, @type) when (@type = width) and (@index > 0) {
|
||||
.col-@{class}-@{index} {
|
||||
width: percentage((@index / @grid-columns));
|
||||
}
|
||||
}
|
||||
.calc-grid-column(@index, @class, @type) when (@type = push) and (@index > 0) {
|
||||
.col-@{class}-push-@{index} {
|
||||
left: percentage((@index / @grid-columns));
|
||||
}
|
||||
}
|
||||
.calc-grid-column(@index, @class, @type) when (@type = push) and (@index = 0) {
|
||||
.col-@{class}-push-0 {
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
.calc-grid-column(@index, @class, @type) when (@type = pull) and (@index > 0) {
|
||||
.col-@{class}-pull-@{index} {
|
||||
right: percentage((@index / @grid-columns));
|
||||
}
|
||||
}
|
||||
.calc-grid-column(@index, @class, @type) when (@type = pull) and (@index = 0) {
|
||||
.col-@{class}-pull-0 {
|
||||
right: auto;
|
||||
}
|
||||
}
|
||||
.calc-grid-column(@index, @class, @type) when (@type = offset) {
|
||||
.col-@{class}-offset-@{index} {
|
||||
margin-left: percentage((@index / @grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
// Basic looping in LESS
|
||||
.loop-grid-columns(@index, @class, @type) when (@index >= 0) {
|
||||
.calc-grid-column(@index, @class, @type);
|
||||
// next iteration
|
||||
.loop-grid-columns((@index - 1), @class, @type);
|
||||
}
|
||||
|
||||
// Create grid for specific class
|
||||
.make-grid(@class) {
|
||||
.float-grid-columns(@class);
|
||||
.loop-grid-columns(@grid-columns, @class, width);
|
||||
.loop-grid-columns(@grid-columns, @class, pull);
|
||||
.loop-grid-columns(@grid-columns, @class, push);
|
||||
.loop-grid-columns(@grid-columns, @class, offset);
|
||||
}
|
|
@ -1,122 +0,0 @@
|
|||
// Grid system
|
||||
//
|
||||
// Generate semantic grid columns with these mixins.
|
||||
|
||||
// Centered container element
|
||||
.container-fixed(@gutter: @grid-gutter-width) {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
padding-left: (@gutter / 2);
|
||||
padding-right: (@gutter / 2);
|
||||
&:extend(.clearfix all);
|
||||
}
|
||||
|
||||
// Creates a wrapper for a series of columns
|
||||
.make-row(@gutter: @grid-gutter-width) {
|
||||
margin-left: (@gutter / -2);
|
||||
margin-right: (@gutter / -2);
|
||||
&:extend(.clearfix all);
|
||||
}
|
||||
|
||||
// Generate the extra small columns
|
||||
.make-xs-column(@columns; @gutter: @grid-gutter-width) {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: percentage((@columns / @grid-columns));
|
||||
min-height: 1px;
|
||||
padding-left: (@gutter / 2);
|
||||
padding-right: (@gutter / 2);
|
||||
}
|
||||
.make-xs-column-offset(@columns) {
|
||||
margin-left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
.make-xs-column-push(@columns) {
|
||||
left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
.make-xs-column-pull(@columns) {
|
||||
right: percentage((@columns / @grid-columns));
|
||||
}
|
||||
|
||||
// Generate the small columns
|
||||
.make-sm-column(@columns; @gutter: @grid-gutter-width) {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-left: (@gutter / 2);
|
||||
padding-right: (@gutter / 2);
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
float: left;
|
||||
width: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-sm-column-offset(@columns) {
|
||||
@media (min-width: @screen-sm-min) {
|
||||
margin-left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-sm-column-push(@columns) {
|
||||
@media (min-width: @screen-sm-min) {
|
||||
left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-sm-column-pull(@columns) {
|
||||
@media (min-width: @screen-sm-min) {
|
||||
right: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
// Generate the medium columns
|
||||
.make-md-column(@columns; @gutter: @grid-gutter-width) {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-left: (@gutter / 2);
|
||||
padding-right: (@gutter / 2);
|
||||
|
||||
@media (min-width: @screen-md-min) {
|
||||
float: left;
|
||||
width: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-md-column-offset(@columns) {
|
||||
@media (min-width: @screen-md-min) {
|
||||
margin-left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-md-column-push(@columns) {
|
||||
@media (min-width: @screen-md-min) {
|
||||
left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-md-column-pull(@columns) {
|
||||
@media (min-width: @screen-md-min) {
|
||||
right: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
|
||||
// Generate the large columns
|
||||
.make-lg-column(@columns; @gutter: @grid-gutter-width) {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-left: (@gutter / 2);
|
||||
padding-right: (@gutter / 2);
|
||||
|
||||
@media (min-width: @screen-lg-min) {
|
||||
float: left;
|
||||
width: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-lg-column-offset(@columns) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
margin-left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-lg-column-push(@columns) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
left: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
||||
.make-lg-column-pull(@columns) {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
right: percentage((@columns / @grid-columns));
|
||||
}
|
||||
}
|
|
@ -1,21 +0,0 @@
|
|||
// CSS image replacement
|
||||
//
|
||||
// Heads up! v3 launched with with only `.hide-text()`, but per our pattern for
|
||||
// mixins being reused as classes with the same name, this doesn't hold up. As
|
||||
// of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`.
|
||||
//
|
||||
// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
|
||||
|
||||
// Deprecated as of v3.0.1 (will be removed in v4)
|
||||
.hide-text() {
|
||||
font: ~"0/0" a;
|
||||
color: transparent;
|
||||
text-shadow: none;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
// New mixin to use as of v3.0.1
|
||||
.text-hide() {
|
||||
.hide-text();
|
||||
}
|
|
@ -1,33 +0,0 @@
|
|||
// Image Mixins
|
||||
// - Responsive image
|
||||
// - Retina image
|
||||
|
||||
|
||||
// Responsive image
|
||||
//
|
||||
// Keep images from scaling beyond the width of their parents.
|
||||
.img-responsive(@display: block) {
|
||||
display: @display;
|
||||
max-width: 100%; // Part 1: Set a maximum relative to the parent
|
||||
height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
|
||||
}
|
||||
|
||||
|
||||
// Retina image
|
||||
//
|
||||
// Short retina mixin for setting background-image and -size. Note that the
|
||||
// spelling of `min--moz-device-pixel-ratio` is intentional.
|
||||
.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) {
|
||||
background-image: url("@{file-1x}");
|
||||
|
||||
@media
|
||||
only screen and (-webkit-min-device-pixel-ratio: 2),
|
||||
only screen and ( min--moz-device-pixel-ratio: 2),
|
||||
only screen and ( -o-min-device-pixel-ratio: 2/1),
|
||||
only screen and ( min-device-pixel-ratio: 2),
|
||||
only screen and ( min-resolution: 192dpi),
|
||||
only screen and ( min-resolution: 2dppx) {
|
||||
background-image: url("@{file-2x}");
|
||||
background-size: @width-1x @height-1x;
|
||||
}
|
||||
}
|