mirror of
https://github.com/Kornstalx/5etools-mirror-2.github.io.git
synced 2025-10-28 20:45:35 -05:00
v1.198.1
This commit is contained in:
509
scss/includes/util-mobile.scss
Normal file
509
scss/includes/util-mobile.scss
Normal file
@@ -0,0 +1,509 @@
|
||||
@import "vars";
|
||||
|
||||
// If it's anything less than full desktop size, enable these styles
|
||||
.mobile-ish__ {
|
||||
@media only screen and (min-width: $width-screen-lg--min) {
|
||||
&visible {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $width-screen-lg) {
|
||||
&hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
&ve-flex-col {
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
}
|
||||
|
||||
&ve-flex-ai-start {
|
||||
align-items: flex-start !important;
|
||||
}
|
||||
|
||||
&w-100 {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
&mr-0 {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
&mb-2 {
|
||||
margin-bottom: ($spacer * 0.5) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mobile__ {
|
||||
@media only screen and (min-width: $width-screen-sm--min) {
|
||||
&visible {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $width-screen-sm) {
|
||||
&hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
&text-center {
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
&text-clip-ellipsis {
|
||||
white-space: nowrap !important;
|
||||
text-overflow: ellipsis !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
&ve-flex-col {
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
}
|
||||
|
||||
&ve-flex-row {
|
||||
display: flex !important;
|
||||
flex-direction: row !important;
|
||||
}
|
||||
|
||||
&ve-flex-col-reverse {
|
||||
display: flex !important;
|
||||
flex-direction: column-reverse !important;
|
||||
}
|
||||
|
||||
&ve-flex-ai-start {
|
||||
align-items: flex-start !important;
|
||||
}
|
||||
|
||||
&w-100 {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
&max-w-100 {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
&h-initial {
|
||||
height: initial !important;
|
||||
}
|
||||
|
||||
// region util-spacing port
|
||||
&m-auto {
|
||||
margin: auto !important;
|
||||
}
|
||||
|
||||
&m-0 {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
&m-1 {
|
||||
margin: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&m-2 {
|
||||
margin: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&m-3 {
|
||||
margin: $spacer !important;
|
||||
}
|
||||
|
||||
&m-4 {
|
||||
margin: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&m-5 {
|
||||
margin: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&mt-auto {
|
||||
margin-top: auto !important;
|
||||
}
|
||||
|
||||
&mt-0 {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
&mt-1 {
|
||||
margin-top: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&mt-2 {
|
||||
margin-top: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&mt-3 {
|
||||
margin-top: $spacer !important;
|
||||
}
|
||||
|
||||
&mt-4 {
|
||||
margin-top: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&mt-5 {
|
||||
margin-top: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&mr-auto {
|
||||
margin-right: auto !important;
|
||||
}
|
||||
|
||||
&mr-0 {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
&mr-1 {
|
||||
margin-right: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&mr-2 {
|
||||
margin-right: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&mr-3 {
|
||||
margin-right: $spacer !important;
|
||||
}
|
||||
|
||||
&mr-4 {
|
||||
margin-right: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&mr-5 {
|
||||
margin-right: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&mb-auto {
|
||||
margin-bottom: auto !important;
|
||||
}
|
||||
|
||||
&mb-0 {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
&mb-1 {
|
||||
margin-bottom: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&mb-2 {
|
||||
margin-bottom: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&mb-3 {
|
||||
margin-bottom: $spacer !important;
|
||||
}
|
||||
|
||||
&mb-4 {
|
||||
margin-bottom: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&mb-5 {
|
||||
margin-bottom: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&ml-auto {
|
||||
margin-left: auto !important;
|
||||
}
|
||||
|
||||
&ml-0 {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
&ml-1 {
|
||||
margin-left: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&ml-2 {
|
||||
margin-left: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&ml-3 {
|
||||
margin-left: $spacer !important;
|
||||
}
|
||||
|
||||
&ml-4 {
|
||||
margin-left: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&ml-5 {
|
||||
margin-left: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&my-auto {
|
||||
margin-top: auto !important;
|
||||
margin-bottom: auto !important;
|
||||
}
|
||||
|
||||
&my-0 {
|
||||
margin-top: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
&my-1 {
|
||||
margin-top: ($spacer * 0.25) !important;
|
||||
margin-bottom: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&my-2 {
|
||||
margin-top: ($spacer * 0.5) !important;
|
||||
margin-bottom: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&my-3 {
|
||||
margin-top: $spacer !important;
|
||||
margin-bottom: $spacer !important;
|
||||
}
|
||||
|
||||
&my-4 {
|
||||
margin-top: ($spacer * 1.5) !important;
|
||||
margin-bottom: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&my-5 {
|
||||
margin-top: ($spacer * 3) !important;
|
||||
margin-bottom: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&mx-auto {
|
||||
margin-right: auto !important;
|
||||
margin-left: auto !important;
|
||||
}
|
||||
|
||||
&mx-0 {
|
||||
margin-right: 0 !important;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
&mx-1 {
|
||||
margin-right: ($spacer * 0.25) !important;
|
||||
margin-left: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&mx-2 {
|
||||
margin-right: ($spacer * 0.5) !important;
|
||||
margin-left: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&mx-3 {
|
||||
margin-right: $spacer !important;
|
||||
margin-left: $spacer !important;
|
||||
}
|
||||
|
||||
&mx-4 {
|
||||
margin-right: ($spacer * 1.5) !important;
|
||||
margin-left: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&mx-5 {
|
||||
margin-right: ($spacer * 3) !important;
|
||||
margin-left: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&p-0 {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
&p-1 {
|
||||
padding: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&p-2 {
|
||||
padding: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&p-3 {
|
||||
padding: $spacer !important;
|
||||
}
|
||||
|
||||
&p-4 {
|
||||
padding: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&p-5 {
|
||||
padding: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&p-1p {
|
||||
padding: 1px !important;
|
||||
}
|
||||
|
||||
&pt-0 {
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
|
||||
&pt-1 {
|
||||
padding-top: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&pt-2 {
|
||||
padding-top: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&pt-3 {
|
||||
padding-top: $spacer !important;
|
||||
}
|
||||
|
||||
&pt-4 {
|
||||
padding-top: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&pt-5 {
|
||||
padding-top: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&pt-1p {
|
||||
padding-top: 1px !important;
|
||||
}
|
||||
|
||||
&pr-0 {
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
|
||||
&pr-1 {
|
||||
padding-right: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&pr-2 {
|
||||
padding-right: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&pr-3 {
|
||||
padding-right: $spacer !important;
|
||||
}
|
||||
|
||||
&pr-4 {
|
||||
padding-right: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&pr-5 {
|
||||
padding-right: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&pr-1p {
|
||||
padding-right: 1px !important;
|
||||
}
|
||||
|
||||
&pb-0 {
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
|
||||
&pb-1 {
|
||||
padding-bottom: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&pb-2 {
|
||||
padding-bottom: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&pb-3 {
|
||||
padding-bottom: $spacer !important;
|
||||
}
|
||||
|
||||
&pb-4 {
|
||||
padding-bottom: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&pb-5 {
|
||||
padding-bottom: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&pb-1p {
|
||||
padding-bottom: 1px !important;
|
||||
}
|
||||
|
||||
&pl-0 {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
&pl-1 {
|
||||
padding-left: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&pl-2 {
|
||||
padding-left: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&pl-3 {
|
||||
padding-left: $spacer !important;
|
||||
}
|
||||
|
||||
&pl-4 {
|
||||
padding-left: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&pl-5 {
|
||||
padding-left: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&pl-1p {
|
||||
padding-left: 1px !important;
|
||||
}
|
||||
|
||||
&py-0 {
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
|
||||
&py-1 {
|
||||
padding-top: ($spacer * 0.25) !important;
|
||||
padding-bottom: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&py-2 {
|
||||
padding-top: ($spacer * 0.5) !important;
|
||||
padding-bottom: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&py-3 {
|
||||
padding-top: $spacer !important;
|
||||
padding-bottom: $spacer !important;
|
||||
}
|
||||
|
||||
&py-4 {
|
||||
padding-top: ($spacer * 1.5) !important;
|
||||
padding-bottom: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&py-5 {
|
||||
padding-top: ($spacer * 3) !important;
|
||||
padding-bottom: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&px-0 {
|
||||
padding-right: 0 !important;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
&px-1 {
|
||||
padding-right: ($spacer * 0.25) !important;
|
||||
padding-left: ($spacer * 0.25) !important;
|
||||
}
|
||||
|
||||
&px-2 {
|
||||
padding-right: ($spacer * 0.5) !important;
|
||||
padding-left: ($spacer * 0.5) !important;
|
||||
}
|
||||
|
||||
&px-3 {
|
||||
padding-right: $spacer !important;
|
||||
padding-left: $spacer !important;
|
||||
}
|
||||
|
||||
&px-4 {
|
||||
padding-right: ($spacer * 1.5) !important;
|
||||
padding-left: ($spacer * 1.5) !important;
|
||||
}
|
||||
|
||||
&px-5 {
|
||||
padding-right: ($spacer * 3) !important;
|
||||
padding-left: ($spacer * 3) !important;
|
||||
}
|
||||
|
||||
&py-1p {
|
||||
padding-top: 1px !important;
|
||||
padding-bottom: 1px !important;
|
||||
}
|
||||
// endregion
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user