mirror of
https://github.com/checktheroads/hyperglass
synced 2024-05-11 05:55:08 +00:00
443 lines
8.9 KiB
Sass
443 lines
8.9 KiB
Sass
// Custom Utility Classes
|
|
|
|
@media (min-width: 576px)
|
|
.mw-sm-25
|
|
max-width: 25% !important
|
|
|
|
.mw-sm-50
|
|
max-width: 50% !important
|
|
|
|
.mw-sm-75
|
|
max-width: 75% !important
|
|
|
|
.mw-sm-100
|
|
max-width: 100% !important
|
|
|
|
.mw-sm-none
|
|
max-width: none !important
|
|
|
|
.mh-sm-25
|
|
max-height: 25% !important
|
|
|
|
.mh-sm-50
|
|
max-height: 50% !important
|
|
|
|
.mh-sm-75
|
|
max-height: 75% !important
|
|
|
|
.mh-sm-100
|
|
max-height: 100% !important
|
|
|
|
.mh-sm-none
|
|
max-height: none !important
|
|
|
|
@media (min-width: 768px)
|
|
.mw-md-25
|
|
max-width: 25% !important
|
|
|
|
.mw-md-50
|
|
max-width: 50% !important
|
|
|
|
.mw-md-75
|
|
max-width: 75% !important
|
|
|
|
.mw-md-100
|
|
max-width: 100% !important
|
|
|
|
.mw-md-none
|
|
max-width: none !important
|
|
|
|
.mh-md-25
|
|
max-height: 25% !important
|
|
|
|
.mh-md-50
|
|
max-height: 50% !important
|
|
|
|
.mh-md-75
|
|
max-height: 75% !important
|
|
|
|
.mh-md-100
|
|
max-height: 100% !important
|
|
|
|
.mh-md-none
|
|
max-height: none !important
|
|
|
|
@media (min-width: 992px)
|
|
.mw-lg-25
|
|
max-width: 25% !important
|
|
|
|
.mw-lg-50
|
|
max-width: 50% !important
|
|
|
|
.mw-lg-75
|
|
max-width: 75% !important
|
|
|
|
.mw-lg-100
|
|
max-width: 100% !important
|
|
|
|
.mw-lg-none
|
|
max-width: none !important
|
|
|
|
.mh-lg-25
|
|
max-height: 25% !important
|
|
|
|
.mh-lg-50
|
|
max-height: 50% !important
|
|
|
|
.mh-lg-75
|
|
max-height: 75% !important
|
|
|
|
.mh-lg-100
|
|
max-height: 100% !important
|
|
|
|
.mh-lg-none
|
|
max-height: none !important
|
|
|
|
@media (min-width: 1200px)
|
|
.mw-xl-25
|
|
max-width: 25% !important
|
|
|
|
.mw-xl-50
|
|
max-width: 50% !important
|
|
|
|
.mw-xl-75
|
|
max-width: 75% !important
|
|
|
|
.mw-xl-100
|
|
max-width: 100% !important
|
|
|
|
.mw-xl-none
|
|
max-width: none !important
|
|
|
|
.mh-xl-25
|
|
max-height: 25% !important
|
|
|
|
.mh-xl-50
|
|
max-height: 50% !important
|
|
|
|
.mh-xl-75
|
|
max-height: 75% !important
|
|
|
|
.mh-xl-100
|
|
max-height: 100% !important
|
|
|
|
.mh-xl-none
|
|
max-height: none !important
|
|
@media (min-width: 576px)
|
|
.mw-sm-25
|
|
max-width: 25% !important
|
|
|
|
.mw-sm-50
|
|
max-width: 50% !important
|
|
|
|
.mw-sm-75
|
|
max-width: 75% !important
|
|
|
|
.mw-sm-100
|
|
max-width: 100% !important
|
|
|
|
.mw-sm-none
|
|
max-width: none !important
|
|
|
|
.mh-sm-25
|
|
max-height: 25% !important
|
|
|
|
.mh-sm-50
|
|
max-height: 50% !important
|
|
|
|
.mh-sm-75
|
|
max-height: 75% !important
|
|
|
|
.mh-sm-100
|
|
max-height: 100% !important
|
|
|
|
.mh-sm-none
|
|
max-height: none !important
|
|
|
|
@media (min-width: 768px)
|
|
.mw-md-25
|
|
max-width: 25% !important
|
|
|
|
.mw-md-50
|
|
max-width: 50% !important
|
|
|
|
.mw-md-75
|
|
max-width: 75% !important
|
|
|
|
.mw-md-100
|
|
max-width: 100% !important
|
|
|
|
.mw-md-none
|
|
max-width: none !important
|
|
|
|
.mh-md-25
|
|
max-height: 25% !important
|
|
|
|
.mh-md-50
|
|
max-height: 50% !important
|
|
|
|
.mh-md-75
|
|
max-height: 75% !important
|
|
|
|
.mh-md-100
|
|
max-height: 100% !important
|
|
|
|
.mh-md-none
|
|
max-height: none !important
|
|
|
|
@media (min-width: 992px)
|
|
.mw-lg-25
|
|
max-width: 25% !important
|
|
|
|
.mw-lg-50
|
|
max-width: 50% !important
|
|
|
|
.mw-lg-75
|
|
max-width: 75% !important
|
|
|
|
.mw-lg-100
|
|
max-width: 100% !important
|
|
|
|
.mw-lg-none
|
|
max-width: none !important
|
|
|
|
.mh-lg-25
|
|
max-height: 25% !important
|
|
|
|
.mh-lg-50
|
|
max-height: 50% !important
|
|
|
|
.mh-lg-75
|
|
max-height: 75% !important
|
|
|
|
.mh-lg-100
|
|
max-height: 100% !important
|
|
|
|
.mh-lg-none
|
|
max-height: none !important
|
|
|
|
@media (min-width: 1200px)
|
|
.mw-xl-25
|
|
max-width: 25% !important
|
|
|
|
.mw-xl-50
|
|
max-width: 50% !important
|
|
|
|
.mw-xl-75
|
|
max-width: 75% !important
|
|
|
|
.mw-xl-100
|
|
max-width: 100% !important
|
|
|
|
.mw-xl-none
|
|
max-width: none !important
|
|
|
|
.mh-xl-25
|
|
max-height: 25% !important
|
|
|
|
.mh-xl-50
|
|
max-height: 50% !important
|
|
|
|
.mh-xl-75
|
|
max-height: 75% !important
|
|
|
|
.mh-xl-100
|
|
max-height: 100% !important
|
|
|
|
.mh-xl-none
|
|
max-height: none !important
|
|
|
|
// hyperglass overrides
|
|
#hg-form
|
|
margin-top: 15% !important
|
|
margin-bottom: 10% !important
|
|
padding: unset
|
|
|
|
#hg-results
|
|
margin-top: 5% !important
|
|
margin-bottom: 5% !important
|
|
padding: unset
|
|
|
|
#hg-results-title
|
|
line-height: unset
|
|
|
|
.nav-masthead
|
|
.nav-link
|
|
& + .nav-link
|
|
margin-left: 1rem
|
|
|
|
// Fixes input group issue where button is 1px taller than the input element (default is 2px)
|
|
|
|
#hg-submit-button
|
|
border-top-right-radius: $border-radius-lg
|
|
border-bottom-right-radius: $border-radius-lg
|
|
|
|
.input-group-lg > .form-control:not(textarea),
|
|
.input-group-lg > .custom-select,
|
|
.bootstrap-select.form-control-lg .dropdown-toggle
|
|
height: calc(1.5em + 1rem + 3px) !important
|
|
|
|
.hg-back:hover
|
|
text-decoration: none
|
|
border: 1px solid $hg-primary !important
|
|
|
|
.hg-back:focus
|
|
text-decoration: none
|
|
|
|
.hg-back
|
|
position: fixed !important
|
|
width: 3rem !important
|
|
height: 3rem !important
|
|
left: 2rem !important
|
|
bottom: 5rem !important
|
|
border-radius: 50rem !important
|
|
border: 1px solid $card-border-color !important
|
|
background-color: $hg-loading
|
|
transition: all .3s !important
|
|
font-weight: 200 !important
|
|
font-size: 1.4rem !important
|
|
opacity: 1 !important
|
|
pointer-events: auto !important
|
|
|
|
#hg-accordion
|
|
.btn-link
|
|
font-weight: 200
|
|
font-size: 1.4rem
|
|
|
|
#hg-accordion
|
|
.card-body
|
|
word-wrap: normal !important
|
|
|
|
.hg-menu-btn
|
|
-webkit-transition: none
|
|
-moz-transition: none
|
|
-o-transition: none
|
|
transition: none
|
|
|
|
.hg-menu-icon
|
|
-webkit-transition: all 0.5s ease
|
|
-moz-transition: all 0.5s ease
|
|
-o-transition: all 0.5s ease
|
|
transition: all 0.5s ease
|
|
|
|
.tab-content
|
|
overflow: hidden
|
|
|
|
.tab-pane
|
|
& > pre
|
|
min-height: 45vh
|
|
max-height: 60vh
|
|
-ms-overflow-style: none
|
|
scrollbar-width: none
|
|
|
|
::-webkit-scrollbar
|
|
width: 0px
|
|
background: transparent
|
|
|
|
.hg-status-container
|
|
display: inline-block
|
|
text-align: center
|
|
vertical-align: middle
|
|
line-height: 1.5
|
|
|
|
.hg-loading
|
|
animation: spinner-border .75s linear infinite
|
|
|
|
.accordion > .card:only-of-type
|
|
border-bottom: $card-border-width solid $card-border-color
|
|
border-top-left-radius: $border-radius !important
|
|
border-top-right-radius: $border-radius !important
|
|
border-bottom-left-radius: $border-radius !important
|
|
border-bottom-right-radius: $border-radius !important
|
|
|
|
.btn:focus,.btn:active
|
|
outline: none !important
|
|
box-shadow: none
|
|
|
|
.bg-primary
|
|
.btn-primary:hover
|
|
color: findTextColor($hg-primary) !important
|
|
background-color: darken($hg-primary, 10%) !important
|
|
border-color: $hg-primary !important
|
|
|
|
.bg-warning
|
|
.btn-warning:hover
|
|
color: findTextColor($hg-warning) !important
|
|
background-color: darken($hg-warning, 10%) !important
|
|
border-color: $hg-warning !important
|
|
|
|
.bg-danger
|
|
.btn-danger:hover
|
|
color: findTextColor($hg-danger) !important
|
|
background-color: darken($hg-danger, 10%) !important
|
|
border-color: $hg-danger !important
|
|
|
|
.bg-loading
|
|
.btn-loading:hover
|
|
color: findTextColor($hg-loading) !important
|
|
background-color: darken($hg-loading, 10%) !important
|
|
border-color: $hg-loading !important
|
|
|
|
.bg-primary
|
|
*
|
|
color: findTextColor($hg-primary) !important
|
|
|
|
.bg-danger
|
|
*
|
|
color: findTextColor($hg-danger) !important
|
|
|
|
.bg-warning
|
|
*
|
|
color: findTextColor($hg-warning) !important
|
|
|
|
.bg-loading
|
|
*
|
|
color: findTextColor($hg-loading) !important
|
|
|
|
.bg-footer
|
|
*
|
|
color: findTextColor($hg-footer) !important
|
|
|
|
.bg-primary
|
|
::selection, ::-moz-selection
|
|
background-color: findTextColor($hg-primary) !important
|
|
color: $hg-primary !important
|
|
|
|
.bg-danger
|
|
::selection, ::-moz-selection
|
|
background-color: findTextColor($hg-danger) !important
|
|
color: $hg-danger !important
|
|
|
|
.bg-warning
|
|
::selection, ::-moz-selection
|
|
background-color: findTextColor($hg-warning) !important
|
|
color: $hg-warning !important
|
|
|
|
.bg-loading
|
|
::selection, ::-moz-selection
|
|
background-color: findTextColor($hg-loading) !important
|
|
color: $hg-loading !important
|
|
|
|
.bg-loading
|
|
::selection, ::-moz-selection
|
|
background-color: findTextColor($hg-footer) !important
|
|
color: $hg-footer !important
|
|
|
|
.bg-danger
|
|
.btn-outline-danger
|
|
border-color: findTextColor($hg-danger) !important
|
|
|
|
.bg-danger
|
|
.btn-outline-danger:hover
|
|
background-color: findTextColor($hg-danger) !important
|
|
color: $hg-danger !important
|
|
|
|
.bg-danger
|
|
hr
|
|
background-color: darken($hg-danger, 10%)
|
|
|
|
.modal-body > p
|
|
padding-left: 0.3rem !important
|
|
|
|
.modal-title
|
|
padding-bottom: 1rem !important |