diff options
Diffstat (limited to 'www/lib/ionic/scss')
40 files changed, 10196 insertions, 0 deletions
diff --git a/www/lib/ionic/scss/_action-sheet.scss b/www/lib/ionic/scss/_action-sheet.scss new file mode 100644 index 00000000..7537f733 --- /dev/null +++ b/www/lib/ionic/scss/_action-sheet.scss @@ -0,0 +1,170 @@ +/** + * Action Sheets + * -------------------------------------------------- + */ + +.action-sheet-backdrop { + @include transition(background-color 150ms ease-in-out); + position: fixed; + top: 0; + left: 0; + z-index: $z-index-action-sheet; + width: 100%; + height: 100%; + background-color: rgba(0,0,0,0); + + &.active { + background-color: rgba(0,0,0,0.4); + } +} + +.action-sheet-wrapper { + @include translate3d(0, 100%, 0); + @include transition(all cubic-bezier(.36, .66, .04, 1) 500ms); + position: absolute; + bottom: 0; + left: 0; + right: 0; + width: 100%; + max-width: 500px; + margin: auto; +} + +.action-sheet-up { + @include translate3d(0, 0, 0); +} + +.action-sheet { + margin-left: $sheet-margin; + margin-right: $sheet-margin; + width: auto; + z-index: $z-index-action-sheet; + overflow: hidden; + + .button { + display: block; + padding: 1px; + width: 100%; + border-radius: 0; + border-color: $sheet-options-border-color; + background-color: transparent; + + color: $sheet-options-text-color; + font-size: 21px; + + &:hover { + color: $sheet-options-text-color; + } + &.destructive { + color: #ff3b30; + &:hover { + color: #ff3b30; + } + } + } + + .button.active, .button.activated { + box-shadow: none; + border-color: $sheet-options-border-color; + color: $sheet-options-text-color; + background: $sheet-options-bg-active-color; + } +} + +.action-sheet-has-icons .icon { + position: absolute; + left: 16px; +} + +.action-sheet-title { + padding: $sheet-margin * 2; + color: #8f8f8f; + text-align: center; + font-size: 13px; +} + +.action-sheet-group { + margin-bottom: $sheet-margin; + border-radius: $sheet-border-radius; + background-color: #fff; + overflow: hidden; + + .button { + border-width: 1px 0px 0px 0px; + } + .button:first-child:last-child { + border-width: 0; + } +} + +.action-sheet-options { + background: $sheet-options-bg-color; +} + +.action-sheet-cancel { + .button { + font-weight: 500; + } +} + +.action-sheet-open { + pointer-events: none; + + &.modal-open .modal { + pointer-events: none; + } + + .action-sheet-backdrop { + pointer-events: auto; + } +} + + +.platform-android { + + .action-sheet-backdrop.active { + background-color: rgba(0,0,0,0.2); + } + + .action-sheet { + margin: 0; + + .action-sheet-title, + .button { + text-align: left; + border-color: transparent; + font-size: 16px; + color: inherit; + } + + .action-sheet-title { + font-size: 14px; + padding: 16px; + color: #666; + } + + .button.active, + .button.activated { + background: #e8e8e8; + } + } + + .action-sheet-group { + margin: 0; + border-radius: 0; + background-color: #fafafa; + } + + .action-sheet-cancel { + display: none; + } + + .action-sheet-has-icons { + + .button { + padding-left: 56px; + } + + } + +} diff --git a/www/lib/ionic/scss/_animations.scss b/www/lib/ionic/scss/_animations.scss new file mode 100644 index 00000000..67e0e184 --- /dev/null +++ b/www/lib/ionic/scss/_animations.scss @@ -0,0 +1,48 @@ + +// Slide up from the bottom, used for modals +// ------------------------------- + +.slide-in-up { + @include translate3d(0, 100%, 0); +} +.slide-in-up.ng-enter, +.slide-in-up > .ng-enter { + @include transition(all cubic-bezier(.1, .7, .1, 1) 400ms); +} +.slide-in-up.ng-enter-active, +.slide-in-up > .ng-enter-active { + @include translate3d(0, 0, 0); +} + +.slide-in-up.ng-leave, +.slide-in-up > .ng-leave { + @include transition(all ease-in-out 250ms); +} + + +// Scale Out +// Scale from hero (1 in this case) to zero +// ------------------------------- + +@-webkit-keyframes scaleOut { + from { -webkit-transform: scale(1); opacity: 1; } + to { -webkit-transform: scale(0.8); opacity: 0; } +} +@keyframes scaleOut { + from { transform: scale(1); opacity: 1; } + to { transform: scale(0.8); opacity: 0; } +} + + +// Super Scale In +// Scale from super (1.x) to duper (1 in this case) +// ------------------------------- + +@-webkit-keyframes superScaleIn { + from { -webkit-transform: scale(1.2); opacity: 0; } + to { -webkit-transform: scale(1); opacity: 1 } +} +@keyframes superScaleIn { + from { transform: scale(1.2); opacity: 0; } + to { transform: scale(1); opacity: 1; } +} diff --git a/www/lib/ionic/scss/_backdrop.scss b/www/lib/ionic/scss/_backdrop.scss new file mode 100644 index 00000000..cc8efd8b --- /dev/null +++ b/www/lib/ionic/scss/_backdrop.scss @@ -0,0 +1,24 @@ + +.backdrop { + position: fixed; + top: 0; + left: 0; + z-index: $z-index-backdrop; + + width: 100%; + height: 100%; + + background-color: $loading-backdrop-bg-color; + + visibility: hidden; + opacity: 0; + + &.visible { + visibility: visible; + } + &.active { + opacity: 1; + } + + @include transition($loading-backdrop-fadein-duration opacity linear); +} diff --git a/www/lib/ionic/scss/_badge.scss b/www/lib/ionic/scss/_badge.scss new file mode 100644 index 00000000..37298be2 --- /dev/null +++ b/www/lib/ionic/scss/_badge.scss @@ -0,0 +1,62 @@ + +/** + * Badges + * -------------------------------------------------- + */ + +.badge { + @include badge-style($badge-default-bg, $badge-default-text); + z-index: $z-index-badge; + display: inline-block; + padding: 3px 8px; + min-width: 10px; + border-radius: $badge-border-radius; + vertical-align: baseline; + text-align: center; + white-space: nowrap; + font-weight: $badge-font-weight; + font-size: $badge-font-size; + line-height: $badge-line-height; + + &:empty { + display: none; + } +} + +//Be sure to override specificity of rule that 'badge color matches tab color by default' +.tabs .tab-item .badge, +.badge { + &.badge-light { + @include badge-style($badge-light-bg, $badge-light-text); + } + &.badge-stable { + @include badge-style($badge-stable-bg, $badge-stable-text); + } + &.badge-positive { + @include badge-style($badge-positive-bg, $badge-positive-text); + } + &.badge-calm { + @include badge-style($badge-calm-bg, $badge-calm-text); + } + &.badge-assertive { + @include badge-style($badge-assertive-bg, $badge-assertive-text); + } + &.badge-balanced { + @include badge-style($badge-balanced-bg, $badge-balanced-text); + } + &.badge-energized { + @include badge-style($badge-energized-bg, $badge-energized-text); + } + &.badge-royal { + @include badge-style($badge-royal-bg, $badge-royal-text); + } + &.badge-dark { + @include badge-style($badge-dark-bg, $badge-dark-text); + } +} + +// Quick fix for labels/badges in buttons +.button .badge { + position: relative; + top: -1px; +} diff --git a/www/lib/ionic/scss/_bar.scss b/www/lib/ionic/scss/_bar.scss new file mode 100644 index 00000000..c8d11a95 --- /dev/null +++ b/www/lib/ionic/scss/_bar.scss @@ -0,0 +1,417 @@ + +/** + * Bar (Headers and Footers) + * -------------------------------------------------- + */ + +.bar { + @include display-flex(); + @include translate3d(0,0,0); + @include user-select(none); + position: absolute; + right: 0; + left: 0; + z-index: $z-index-bar; + + @include box-sizing(border-box); + padding: $bar-padding-portrait; + + width: 100%; + height: $bar-height; + border-width: 0; + border-style: solid; + border-top: 1px solid transparent; + border-bottom: 1px solid $bar-default-border; + + background-color: $bar-default-bg; + + /* border-width: 1px will actually create 2 device pixels on retina */ + /* this nifty trick sets an actual 1px border on hi-res displays */ + background-size: 0; + @media (min--moz-device-pixel-ratio: 1.5), + (-webkit-min-device-pixel-ratio: 1.5), + (min-device-pixel-ratio: 1.5), + (min-resolution: 144dpi), + (min-resolution: 1.5dppx) { + border: none; + background-image: linear-gradient(0deg, $bar-default-border, $bar-default-border 50%, transparent 50%); + background-position: bottom; + background-size: 100% 1px; + background-repeat: no-repeat; + } + + &.bar-clear { + border: none; + background: none; + color: #fff; + + .button { + color: #fff; + } + .title { + color: #fff; + } + } + + &.item-input-inset { + .item-input-wrapper { + margin-top: -1px; + + input { + padding-left: 8px; + width: 94%; + height: 28px; + background: transparent; + } + } + } + + &.bar-light { + @include bar-style($bar-light-bg, $bar-light-border, $bar-light-text); + &.bar-footer{ + background-image: linear-gradient(180deg, $bar-light-border, $bar-light-border 50%, transparent 50%); + } + } + &.bar-stable { + @include bar-style($bar-stable-bg, $bar-stable-border, $bar-stable-text); + &.bar-footer{ + background-image: linear-gradient(180deg, $bar-stable-border, $bar-stable-border 50%, transparent 50%); + } + } + &.bar-positive { + @include bar-style($bar-positive-bg, $bar-positive-border, $bar-positive-text); + &.bar-footer{ + background-image: linear-gradient(180deg, $bar-positive-border, $bar-positive-border 50%, transparent 50%); + } + } + &.bar-calm { + @include bar-style($bar-calm-bg, $bar-calm-border, $bar-calm-text); + &.bar-footer{ + background-image: linear-gradient(180deg, $bar-calm-border, $bar-calm-border 50%, transparent 50%); + } + } + &.bar-assertive { + @include bar-style($bar-assertive-bg, $bar-assertive-border, $bar-assertive-text); + &.bar-footer{ + background-image: linear-gradient(180deg, $bar-assertive-border, $bar-assertive-border 50%, transparent 50%); + } + } + &.bar-balanced { + @include bar-style($bar-balanced-bg, $bar-balanced-border, $bar-balanced-text); + &.bar-footer{ + background-image: linear-gradient(180deg, $bar-balanced-border, $bar-balanced-border 50%, transparent 50%); + } + } + &.bar-energized { + @include bar-style($bar-energized-bg, $bar-energized-border, $bar-energized-text); + &.bar-footer{ + background-image: linear-gradient(180deg, $bar-energized-border, $bar-energized-border 50%, transparent 50%); + } + } + &.bar-royal { + @include bar-style($bar-royal-bg, $bar-royal-border, $bar-royal-text); + &.bar-footer{ + background-image: linear-gradient(180deg, $bar-royal-border, $bar-royal-border 50%, transparent 50%); + } + } + &.bar-dark { + @include bar-style($bar-dark-bg, $bar-dark-border, $bar-dark-text); + &.bar-footer{ + background-image: linear-gradient(180deg, $bar-dark-border, $bar-dark-border 50%, transparent 50%); + } + } + + // Title inside of a bar is centered + .title { + display: block; + position: absolute; + + top: 0; + right: 0; + left: 0; + z-index: $z-index-bar-title; + overflow: hidden; + + margin: 0 10px; + + min-width: 30px; + height: $bar-height - 1; + + text-align: center; + + // Go into ellipsis if too small + text-overflow: ellipsis; + white-space: nowrap; + + font-size: $bar-title-font-size; + font-weight: $headings-font-weight; + + line-height: $bar-height; + + &.title-left { + text-align: left; + } + &.title-right { + text-align: right; + } + } + + .title a { + color: inherit; + } + + .button, button { + z-index: $z-index-bar-button; + padding: 0 $button-bar-button-padding; + min-width: initial; + min-height: $button-bar-button-height - 1; + font-weight: 400; + font-size: $button-bar-button-font-size; + line-height: $button-bar-button-height; + + &.button-icon:before, + .icon:before, + &.icon:before, + &.icon-left:before, + &.icon-right:before { + padding-right: 2px; + padding-left: 2px; + font-size: $button-bar-button-icon-size; + line-height: $button-bar-button-height; + } + + &.button-icon { + font-size: $bar-title-font-size; + .icon:before, + &:before, + &.icon-left:before, + &.icon-right:before { + vertical-align: top; + font-size: $button-large-icon-size; + line-height: $button-bar-button-height; + } + } + &.button-clear { + padding-right: 2px; + padding-left: 2px; + font-weight: 300; + font-size: $bar-title-font-size; + + .icon:before, + &.icon:before, + &.icon-left:before, + &.icon-right:before { + font-size: $button-large-icon-size; + line-height: $button-bar-button-height; + } + } + + &.back-button { + display: block; + margin-right: 5px; + padding: 0; + white-space: nowrap; + font-weight: 400; + } + + &.back-button.active, + &.back-button.activated { + opacity: 0.2; + } + } + + .button-bar > .button, + .buttons > .button { + min-height: $button-bar-button-height - 1; + line-height: $button-bar-button-height; + } + + .button-bar + .button, + .button + .button-bar { + margin-left: 5px; + } + + // Android 4.4 messes with the display property + .buttons, + .buttons.primary-buttons, + .buttons.secondary-buttons { + display: inherit; + } + .buttons span { + display: inline-block; + } + .buttons-left span { + margin-right: 5px; + display: inherit; + } + .buttons-right span { + margin-left: 5px; + display: inherit; + } + + // Place the last button in a bar on the right of the bar + .title + .button:last-child, + > .button + .button:last-child, + > .button.pull-right, + .buttons.pull-right, + .title + .buttons { + position: absolute; + top: 5px; + right: 5px; + bottom: 5px; + } + +} + +.platform-android { + + .nav-bar-has-subheader .bar { + background-image: none; + } + + .bar { + + .back-button .icon:before { + font-size: 24px; + } + + .title { + font-size: 19px; + line-height: $bar-height; + } + } + +} + +// Default styles for buttons inside of styled bars +.bar-light { + .button { + @include button-style($bar-light-bg, $bar-light-border, $bar-light-active-bg, $bar-light-active-border, $bar-light-text); + @include button-clear($bar-light-text, $bar-title-font-size); + } +} +.bar-stable { + .button { + @include button-style($bar-stable-bg, $bar-stable-border, $bar-stable-active-bg, $bar-stable-active-border, $bar-stable-text); + @include button-clear($bar-stable-text, $bar-title-font-size); + } +} +.bar-positive { + .button { + @include button-style($bar-positive-bg, $bar-positive-border, $bar-positive-active-bg, $bar-positive-active-border, $bar-positive-text); + @include button-clear(#fff, $bar-title-font-size); + } +} +.bar-calm { + .button { + @include button-style($bar-calm-bg, $bar-calm-border, $bar-calm-active-bg, $bar-calm-active-border, $bar-calm-text); + @include button-clear(#fff, $bar-title-font-size); + } +} +.bar-assertive { + .button { + @include button-style($bar-assertive-bg, $bar-assertive-border, $bar-assertive-active-bg, $bar-assertive-active-border, $bar-assertive-text); + @include button-clear(#fff, $bar-title-font-size); + } +} +.bar-balanced { + .button { + @include button-style($bar-balanced-bg, $bar-balanced-border, $bar-balanced-active-bg, $bar-balanced-active-border, $bar-balanced-text); + @include button-clear(#fff, $bar-title-font-size); + } +} +.bar-energized { + .button { + @include button-style($bar-energized-bg, $bar-energized-border, $bar-energized-active-bg, $bar-energized-active-border, $bar-energized-text); + @include button-clear(#fff, $bar-title-font-size); + } +} +.bar-royal { + .button { + @include button-style($bar-royal-bg, $bar-royal-border, $bar-royal-active-bg, $bar-royal-active-border, $bar-royal-text); + @include button-clear(#fff, $bar-title-font-size); + } +} +.bar-dark { + .button { + @include button-style($bar-dark-bg, $bar-dark-border, $bar-dark-active-bg, $bar-dark-active-border, $bar-dark-text); + @include button-clear(#fff, $bar-title-font-size); + } +} + +// Header at top +.bar-header { + top: 0; + border-top-width: 0; + border-bottom-width: 1px; + &.has-tabs-top{ + border-bottom-width: 0px; + background-image: none; + } +} +.tabs-top .bar-header{ + border-bottom-width: 0px; + background-image: none; +} + +// Footer at bottom +.bar-footer { + bottom: 0; + border-top-width: 1px; + border-bottom-width: 0; + background-position: top; + + height: $bar-footer-height; + + &.item-input-inset { + position: absolute; + } + + .title { + height: $bar-footer-height - 1; + line-height: $bar-footer-height; + } +} + +// Don't render padding if the bar is just for tabs +.bar-tabs { + padding: 0; +} + +.bar-subheader { + top: $bar-height; + + height: $bar-subheader-height; + + .title { + height: $bar-subheader-height - 1; + line-height: $bar-subheader-height; + } +} +.bar-subfooter { + bottom: $bar-footer-height; + + height: $bar-subfooter-height; + + .title { + height: $bar-subfooter-height - 1; + line-height: $bar-subfooter-height; + } +} + +.nav-bar-block { + position: absolute; + top: 0; + right: 0; + left: 0; + z-index: $z-index-bar; +} + +.bar .back-button.hide, +.bar .buttons .hide { + display: none; +} + +.nav-bar-tabs-top .bar { + background-image: none; +} diff --git a/www/lib/ionic/scss/_button-bar.scss b/www/lib/ionic/scss/_button-bar.scss new file mode 100644 index 00000000..da809d15 --- /dev/null +++ b/www/lib/ionic/scss/_button-bar.scss @@ -0,0 +1,92 @@ + +/** + * Button Bar + * -------------------------------------------------- + */ + +.button-bar { + @include display-flex(); + @include flex(1); + width: 100%; + + &.button-bar-inline { + display: block; + width: auto; + + @include clearfix(); + + > .button { + width: auto; + display: inline-block; + float: left; + } + } + + &.bar-light > .button { + border-color: $button-light-border; + } + &.bar-stable > .button { + border-color: $button-stable-border; + } + &.bar-positive > .button { + border-color: $button-positive-border; + } + &.bar-calm > .button { + border-color: $button-calm-border; + } + &.bar-assertive > .button { + border-color: $button-assertive-border; + } + &.bar-balanced > .button { + border-color: $button-balanced-border; + } + &.bar-energized > .button { + border-color: $button-energized-border; + } + &.bar-royal > .button { + border-color: $button-royal-border; + } + &.bar-dark > .button { + border-color: $button-dark-border; + } +} + +.button-bar > .button { + @include flex(1); + display: block; + + overflow: hidden; + + padding: 0 16px; + + width: 0; + + border-width: 1px 0px 1px 1px; + border-radius: 0; + text-align: center; + text-overflow: ellipsis; + white-space: nowrap; + + &:before, + .icon:before { + line-height: 44px; + } + + &:first-child { + border-radius: $button-border-radius 0px 0px $button-border-radius; + } + &:last-child { + border-right-width: 1px; + border-radius: 0px $button-border-radius $button-border-radius 0px; + } + &:only-child { + border-radius: $button-border-radius; + } +} + +.button-bar > .button-small { + &:before, + .icon:before { + line-height: 28px; + } +} diff --git a/www/lib/ionic/scss/_button.scss b/www/lib/ionic/scss/_button.scss new file mode 100644 index 00000000..93a47c6a --- /dev/null +++ b/www/lib/ionic/scss/_button.scss @@ -0,0 +1,252 @@ + +/** + * Buttons + * -------------------------------------------------- + */ + +.button { + // set the color defaults + @include button-style($button-default-bg, $button-default-border, $button-default-active-bg, $button-default-active-border, $button-default-text); + + position: relative; + display: inline-block; + margin: 0; + padding: 0 $button-padding; + + min-width: ($button-padding * 3) + $button-font-size; + min-height: $button-height + 5px; + + border-width: $button-border-width; + border-style: solid; + border-radius: $button-border-radius; + + vertical-align: top; + text-align: center; + + text-overflow: ellipsis; + font-size: $button-font-size; + line-height: $button-height - $button-border-width + 1px; + + cursor: pointer; + + &:after { + // used to create a larger button "hit" area + position: absolute; + top: -6px; + right: -6px; + bottom: -6px; + left: -6px; + content: ' '; + } + + .icon { + vertical-align: top; + pointer-events: none; + } + + .icon:before, + &.icon:before, + &.icon-left:before, + &.icon-right:before { + display: inline-block; + padding: 0 0 $button-border-width 0; + vertical-align: inherit; + font-size: $button-icon-size; + line-height: $button-height - $button-border-width; + pointer-events: none; + } + &.icon-left:before { + float: left; + padding-right: .2em; + padding-left: 0; + } + &.icon-right:before { + float: right; + padding-right: 0; + padding-left: .2em; + } + + &.button-block, &.button-full { + margin-top: $button-block-margin; + margin-bottom: $button-block-margin; + } + + &.button-light { + @include button-style($button-light-bg, $button-default-border, $button-light-active-bg, $button-default-active-border, $button-light-text); + @include button-clear($button-light-border); + @include button-outline($button-light-border); + } + + &.button-stable { + @include button-style($button-stable-bg, $button-default-border, $button-stable-active-bg, $button-default-active-border, $button-stable-text); + @include button-clear($button-stable-border); + @include button-outline($button-stable-border); + } + + &.button-positive { + @include button-style($button-positive-bg, $button-default-border, $button-positive-active-bg, $button-default-active-border, $button-positive-text); + @include button-clear($button-positive-bg); + @include button-outline($button-positive-bg); + } + + &.button-calm { + @include button-style($button-calm-bg, $button-default-border, $button-calm-active-bg, $button-default-active-border, $button-calm-text); + @include button-clear($button-calm-bg); + @include button-outline($button-calm-bg); + } + + &.button-assertive { + @include button-style($button-assertive-bg, $button-default-border, $button-assertive-active-bg, $button-default-active-border, $button-assertive-text); + @include button-clear($button-assertive-bg); + @include button-outline($button-assertive-bg); + } + + &.button-balanced { + @include button-style($button-balanced-bg, $button-default-border, $button-balanced-active-bg, $button-default-active-border, $button-balanced-text); + @include button-clear($button-balanced-bg); + @include button-outline($button-balanced-bg); + } + + &.button-energized { + @include button-style($button-energized-bg, $button-default-border, $button-energized-active-bg, $button-default-active-border, $button-energized-text); + @include button-clear($button-energized-bg); + @include button-outline($button-energized-bg); + } + + &.button-royal { + @include button-style($button-royal-bg, $button-default-border, $button-royal-active-bg, $button-default-active-border, $button-royal-text); + @include button-clear($button-royal-bg); + @include button-outline($button-royal-bg); + } + + &.button-dark { + @include button-style($button-dark-bg, $button-default-border, $button-dark-active-bg, $button-default-active-border, $button-dark-text); + @include button-clear($button-dark-bg); + @include button-outline($button-dark-bg); + } +} + +.button-small { + padding: 2px $button-small-padding 1px; + min-width: $button-small-height; + min-height: $button-small-height + 2; + font-size: $button-small-font-size; + line-height: $button-small-height - $button-border-width - 1; + + .icon:before, + &.icon:before, + &.icon-left:before, + &.icon-right:before { + font-size: $button-small-icon-size; + line-height: $button-small-icon-size + 3; + margin-top: 3px; + } +} + +.button-large { + padding: 0 $button-large-padding; + min-width: ($button-large-padding * 3) + $button-large-font-size; + min-height: $button-large-height + 5; + font-size: $button-large-font-size; + line-height: $button-large-height - $button-border-width; + + .icon:before, + &.icon:before, + &.icon-left:before, + &.icon-right:before { + padding-bottom: ($button-border-width * 2); + font-size: $button-large-icon-size; + line-height: $button-large-height - ($button-border-width * 2) - 1; + } +} + +.button-icon { + @include transition(opacity .1s); + padding: 0 6px; + min-width: initial; + border-color: transparent; + background: none; + + &.button.active, + &.button.activated { + border-color: transparent; + background: none; + box-shadow: none; + opacity: 0.3; + } + + .icon:before, + &.icon:before { + font-size: $button-large-icon-size; + } +} + +.button-clear { + @include button-clear($button-default-border); + @include transition(opacity .1s); + padding: 0 $button-clear-padding; + max-height: $button-height; + border-color: transparent; + background: none; + box-shadow: none; + + &.active, + &.activated { + opacity: 0.3; + } +} + +.button-outline { + @include button-outline($button-default-border); + @include transition(opacity .1s); + background: none; + box-shadow: none; +} + +.padding > .button.button-block:first-child { + margin-top: 0; +} + +.button-block { + display: block; + clear: both; + + &:after { + clear: both; + } +} + +.button-full, +.button-full > .button { + display: block; + margin-right: 0; + margin-left: 0; + border-right-width: 0; + border-left-width: 0; + border-radius: 0; +} + +button.button-block, +button.button-full, +.button-full > button.button, +input.button.button-block { + width: 100%; +} + +a.button { + text-decoration: none; + + .icon:before, + &.icon:before, + &.icon-left:before, + &.icon-right:before { + margin-top: 2px; + } +} + +.button.disabled, +.button[disabled] { + opacity: .4; + cursor: default !important; + pointer-events: none; +} diff --git a/www/lib/ionic/scss/_checkbox.scss b/www/lib/ionic/scss/_checkbox.scss new file mode 100644 index 00000000..8321195a --- /dev/null +++ b/www/lib/ionic/scss/_checkbox.scss @@ -0,0 +1,180 @@ + +/** + * Checkbox + * -------------------------------------------------- + */ + +.checkbox { + // set the color defaults + @include checkbox-style($checkbox-off-border-default, $checkbox-on-bg-default, $checkbox-on-border-default); + + position: relative; + display: inline-block; + padding: ($checkbox-height / 4) ($checkbox-width / 4); + cursor: pointer; +} +.checkbox-light { + @include checkbox-style($checkbox-off-border-light, $checkbox-on-bg-light, $checkbox-off-border-light); +} +.checkbox-stable { + @include checkbox-style($checkbox-off-border-stable, $checkbox-on-bg-stable, $checkbox-off-border-stable); +} +.checkbox-positive { + @include checkbox-style($checkbox-off-border-positive, $checkbox-on-bg-positive, $checkbox-off-border-positive); +} +.checkbox-calm { + @include checkbox-style($checkbox-off-border-calm, $checkbox-on-bg-calm, $checkbox-off-border-calm); +} +.checkbox-assertive { + @include checkbox-style($checkbox-off-border-assertive, $checkbox-on-bg-assertive, $checkbox-off-border-assertive); +} +.checkbox-balanced { + @include checkbox-style($checkbox-off-border-balanced, $checkbox-on-bg-balanced, $checkbox-off-border-balanced); +} +.checkbox-energized{ + @include checkbox-style($checkbox-off-border-energized, $checkbox-on-bg-energized, $checkbox-off-border-energized); +} +.checkbox-royal { + @include checkbox-style($checkbox-off-border-royal, $checkbox-on-bg-royal, $checkbox-off-border-royal); +} +.checkbox-dark { + @include checkbox-style($checkbox-off-border-dark, $checkbox-on-bg-dark, $checkbox-off-border-dark); +} + +.checkbox input:disabled:before, +.checkbox input:disabled + .checkbox-icon:before { + border-color: $checkbox-off-border-light; +} + +.checkbox input:disabled:checked:before, +.checkbox input:disabled:checked + .checkbox-icon:before { + background: $checkbox-on-bg-light; +} + + +.checkbox.checkbox-input-hidden input { + display: none !important; +} + +.checkbox input, +.checkbox-icon { + position: relative; + width: $checkbox-width; + height: $checkbox-height; + display: block; + border: 0; + background: transparent; + cursor: pointer; + -webkit-appearance: none; + + &:before { + // what the checkbox looks like when its not checked + display: table; + width: 100%; + height: 100%; + border-width: $checkbox-border-width; + border-style: solid; + border-radius: $checkbox-border-radius; + background: $checkbox-off-bg-color; + content: ' '; + @include transition(background-color 20ms ease-in-out); + } +} + +.checkbox input:checked:before, +input:checked + .checkbox-icon:before { + border-width: $checkbox-border-width + 1; +} + +// the checkmark within the box +.checkbox input:after, +.checkbox-icon:after { + @include transition(opacity .05s ease-in-out); + @include rotate(-45deg); + position: absolute; + top: 33%; + left: 25%; + display: table; + width: ($checkbox-width / 2); + height: ($checkbox-width / 4) - 1; + border: $checkbox-check-width solid $checkbox-check-color; + border-top: 0; + border-right: 0; + content: ' '; + opacity: 0; +} + +.platform-android .checkbox-platform input:before, +.platform-android .checkbox-platform .checkbox-icon:before, +.checkbox-square input:before, +.checkbox-square .checkbox-icon:before { + border-radius: 2px; + width: 72%; + height: 72%; + margin-top: 14%; + margin-left: 14%; + border-width: 2px; +} + +.platform-android .checkbox-platform input:after, +.platform-android .checkbox-platform .checkbox-icon:after, +.checkbox-square input:after, +.checkbox-square .checkbox-icon:after { + border-width: 2px; + top: 19%; + left: 25%; + width: ($checkbox-width / 2) - 1; + height: 7px; +} + +.platform-android .item-checkbox-right .checkbox-square .checkbox-icon::after { + top: 31%; +} + +.grade-c .checkbox input:after, +.grade-c .checkbox-icon:after { + @include rotate(0); + top: 3px; + left: 4px; + border: none; + color: $checkbox-check-color; + content: '\2713'; + font-weight: bold; + font-size: 20px; +} + +// what the checkmark looks like when its checked +.checkbox input:checked:after, +input:checked + .checkbox-icon:after { + opacity: 1; +} + +// make sure item content have enough padding on left to fit the checkbox +.item-checkbox { + padding-left: ($item-padding * 2) + $checkbox-width; + + &.active { + box-shadow: none; + } +} + +// position the checkbox to the left within an item +.item-checkbox .checkbox { + position: absolute; + top: 50%; + right: $item-padding / 2; + left: $item-padding / 2; + z-index: $z-index-item-checkbox; + margin-top: (($checkbox-height + ($checkbox-height / 2)) / 2) * -1; +} + + +.item-checkbox.item-checkbox-right { + padding-right: ($item-padding * 2) + $checkbox-width; + padding-left: $item-padding; +} + +.item-checkbox-right .checkbox input, +.item-checkbox-right .checkbox-icon { + float: right; +} diff --git a/www/lib/ionic/scss/_form.scss b/www/lib/ionic/scss/_form.scss new file mode 100644 index 00000000..288f633d --- /dev/null +++ b/www/lib/ionic/scss/_form.scss @@ -0,0 +1,327 @@ +/** + * Forms + * -------------------------------------------------- + */ + +// Make all forms have space below them +form { + margin: 0 0 $line-height-base; +} + +// Groups of fields with labels on top (legends) +legend { + display: block; + margin-bottom: $line-height-base; + padding: 0; + width: 100%; + border: $input-border-width solid $input-border; + color: $dark; + font-size: $font-size-base * 1.5; + line-height: $line-height-base * 2; + + small { + color: $stable; + font-size: $line-height-base * .75; + } +} + +// Set font for forms +label, +input, +button, +select, +textarea { + @include font-shorthand($font-size-base, normal, $line-height-base); // Set size, weight, line-height here +} +input, +button, +select, +textarea { + font-family: $font-family-base; // And only set font-family here for those that need it (note the missing label element) +} + + +// Input List +// ------------------------------- + +.item-input { + @include display-flex(); + @include align-items(center); + position: relative; + overflow: hidden; + padding: 6px 0 5px 16px; + + input { + @include border-radius(0); + @include flex(1, 220px); + @include appearance(none); + margin: 0; + padding-right: 24px; + background-color: transparent; + } + + .button .icon { + @include flex(0, 0, 24px); + position: static; + display: inline-block; + height: auto; + text-align: center; + font-size: 16px; + } + + .button-bar { + @include border-radius(0); + @include flex(1, 0, 220px); + @include appearance(none); + } + + .icon { + min-width: 14px; + } +} +// prevent flex-shrink on WP +.platform-windowsphone .item-input input{ + flex-shrink: 1; +} + +.item-input-inset { + @include display-flex(); + @include align-items(center); + position: relative; + overflow: hidden; + padding: ($item-padding / 3) * 2; +} + +.item-input-wrapper { + @include display-flex(); + @include flex(1, 0); + @include align-items(center); + @include border-radius(4px); + padding-right: 8px; + padding-left: 8px; + background: #eee; +} + +.item-input-inset .item-input-wrapper input { + padding-left: 4px; + height: 29px; + background: transparent; + line-height: 18px; +} + +.item-input-wrapper ~ .button { + margin-left: ($item-padding / 3) * 2; +} + +.input-label { + display: table; + padding: 7px 10px 7px 0px; + max-width: 200px; + width: 35%; + color: $input-label-color; + font-size: 16px; +} + +.placeholder-icon { + color: #aaa; + &:first-child { + padding-right: 6px; + } + &:last-child { + padding-left: 6px; + } +} + +.item-stacked-label { + display: block; + background-color: transparent; + box-shadow: none; + + .input-label, .icon { + display: inline-block; + padding: 4px 0 0 0px; + vertical-align: middle; + } +} + +.item-stacked-label input, +.item-stacked-label textarea { + @include border-radius(2px); + padding: 4px 8px 3px 0; + border: none; + background-color: $input-bg; +} +.item-stacked-label input { + overflow: hidden; + height: $line-height-computed + $font-size-base + 12px; +} + +.item-select.item-stacked-label select { + position: relative; + padding: 0px; + max-width: 90%; + direction:ltr; + white-space: pre-wrap; + margin: -3px; +} + +.item-floating-label { + display: block; + background-color: transparent; + box-shadow: none; + + .input-label { + position: relative; + padding: 5px 0 0 0; + opacity: 0; + top: 10px; + @include transition(opacity .15s ease-in, top .2s linear); + + &.has-input { + opacity: 1; + top: 0; + @include transition(opacity .15s ease-in, top .2s linear); + } + } +} + + +// Form Controls +// ------------------------------- + +// Shared size and type resets +textarea, +input[type="text"], +input[type="password"], +input[type="datetime"], +input[type="datetime-local"], +input[type="date"], +input[type="month"], +input[type="time"], +input[type="week"], +input[type="number"], +input[type="email"], +input[type="url"], +input[type="search"], +input[type="tel"], +input[type="color"] { + display: block; + padding-top: 2px; + padding-left: 0; + height: $line-height-computed + $font-size-base; + color: $input-color; + vertical-align: middle; + font-size: $font-size-base; + line-height: $font-size-base + 2; +} + +.platform-ios, +.platform-android { + input[type="datetime-local"], + input[type="date"], + input[type="month"], + input[type="time"], + input[type="week"] { + padding-top: 8px; + } +} + +.item-input { + input, + textarea { + width: 100%; + } +} + +textarea { + padding-left: 0; + @include placeholder($input-color-placeholder, -3px); +} + +// Reset height since textareas have rows +textarea { + height: auto; +} + +// Everything else +textarea, +input[type="text"], +input[type="password"], +input[type="datetime"], +input[type="datetime-local"], +input[type="date"], +input[type="month"], +input[type="time"], +input[type="week"], +input[type="number"], +input[type="email"], +input[type="url"], +input[type="search"], +input[type="tel"], +input[type="color"] { + border: 0; +} + +// Position radios and checkboxes better +input[type="radio"], +input[type="checkbox"] { + margin: 0; + line-height: normal; +} + +// Reset width of input images, buttons, radios, checkboxes +.item-input { + input[type="file"], + input[type="image"], + input[type="submit"], + input[type="reset"], + input[type="button"], + input[type="radio"], + input[type="checkbox"] { + width: auto; // Override of generic input selector + } +} + +// Set the height of file to match text inputs +input[type="file"] { + line-height: $input-height-base; +} + +// Text input classes to hide text caret during scroll +.previous-input-focus, +.cloned-text-input + input, +.cloned-text-input + textarea { + position: absolute !important; + left: -9999px; + width: 200px; +} + + +// Placeholder +// ------------------------------- +input, +textarea { + @include placeholder(); +} + + +// DISABLED STATE +// ------------------------------- + +// Disabled and read-only inputs +input[disabled], +select[disabled], +textarea[disabled], +input[readonly]:not(.cloned-text-input), +textarea[readonly]:not(.cloned-text-input), +select[readonly] { + background-color: $input-bg-disabled; + cursor: not-allowed; +} +// Explicitly reset the colors here +input[type="radio"][disabled], +input[type="checkbox"][disabled], +input[type="radio"][readonly], +input[type="checkbox"][readonly] { + background-color: transparent; +} diff --git a/www/lib/ionic/scss/_grid.scss b/www/lib/ionic/scss/_grid.scss new file mode 100644 index 00000000..cb3a97b5 --- /dev/null +++ b/www/lib/ionic/scss/_grid.scss @@ -0,0 +1,159 @@ +/** + * Grid + * -------------------------------------------------- + * Using flexbox for the grid, inspired by Philip Walton: + * http://philipwalton.github.io/solved-by-flexbox/demos/grids/ + * By default each .col within a .row will evenly take up + * available width, and the height of each .col with take + * up the height of the tallest .col in the same .row. + */ + +.row { + @include display-flex(); + padding: ($grid-padding-width / 2); + width: 100%; +} + +.row-wrap { + @include flex-wrap(wrap); +} + +.row-no-padding { + padding: 0; + + > .col { + padding: 0; + } +} + +.row + .row { + margin-top: ($grid-padding-width / 2) * -1; + padding-top: 0; +} + +.col { + @include flex(1); + display: block; + padding: ($grid-padding-width / 2); + width: 100%; +} + + +/* Vertically Align Columns */ +/* .row-* vertically aligns every .col in the .row */ +.row-top { + @include align-items(flex-start); +} +.row-bottom { + @include align-items(flex-end); +} +.row-center { + @include align-items(center); +} +.row-stretch { + @include align-items(stretch); +} +.row-baseline { + @include align-items(baseline); +} + +/* .col-* vertically aligns an individual .col */ +.col-top { + @include align-self(flex-start); +} +.col-bottom { + @include align-self(flex-end); +} +.col-center { + @include align-self(center); +} + +/* Column Offsets */ +.col-offset-10 { + margin-left: 10%; +} +.col-offset-20 { + margin-left: 20%; +} +.col-offset-25 { + margin-left: 25%; +} +.col-offset-33, .col-offset-34 { + margin-left: 33.3333%; +} +.col-offset-50 { + margin-left: 50%; +} +.col-offset-66, .col-offset-67 { + margin-left: 66.6666%; +} +.col-offset-75 { + margin-left: 75%; +} +.col-offset-80 { + margin-left: 80%; +} +.col-offset-90 { + margin-left: 90%; +} + + +/* Explicit Column Percent Sizes */ +/* By default each grid column will evenly distribute */ +/* across the grid. However, you can specify individual */ +/* columns to take up a certain size of the available area */ +.col-10 { + @include flex(0, 0, 10%); + max-width: 10%; +} +.col-20 { + @include flex(0, 0, 20%); + max-width: 20%; +} +.col-25 { + @include flex(0, 0, 25%); + max-width: 25%; +} +.col-33, .col-34 { + @include flex(0, 0, 33.3333%); + max-width: 33.3333%; +} +.col-40 { + @include flex(0, 0, 40%); + max-width: 40%; +} +.col-50 { + @include flex(0, 0, 50%); + max-width: 50%; +} +.col-60 { + @include flex(0, 0, 60%); + max-width: 60%; +} +.col-66, .col-67 { + @include flex(0, 0, 66.6666%); + max-width: 66.6666%; +} +.col-75 { + @include flex(0, 0, 75%); + max-width: 75%; +} +.col-80 { + @include flex(0, 0, 80%); + max-width: 80%; +} +.col-90 { + @include flex(0, 0, 90%); + max-width: 90%; +} + + +/* Responsive Grid Classes */ +/* Adding a class of responsive-X to a row */ +/* will trigger the flex-direction to */ +/* change to column and add some margin */ +/* to any columns in the row for clearity */ + +@include responsive-grid-break('.responsive-sm', $grid-responsive-sm-break); +@include responsive-grid-break('.responsive-md', $grid-responsive-md-break); +@include responsive-grid-break('.responsive-lg', $grid-responsive-lg-break); diff --git a/www/lib/ionic/scss/_items.scss b/www/lib/ionic/scss/_items.scss new file mode 100644 index 00000000..d545e644 --- /dev/null +++ b/www/lib/ionic/scss/_items.scss @@ -0,0 +1,825 @@ +/** + * Items + * -------------------------------------------------- + */ + +.item { + @include item-style($item-default-bg, $item-default-border, $item-default-text); + + position: relative; + z-index: $z-index-item; // Make sure the borders and stuff don't get hidden by children + display: block; + + margin: $item-border-width * -1; + padding: $item-padding; + + border-width: $item-border-width; + border-style: solid; + font-size: $item-font-size; + + h2 { + margin: 0 0 2px 0; + font-size: 16px; + font-weight: normal; + } + h3 { + margin: 0 0 4px 0; + font-size: 14px; + } + h4 { + margin: 0 0 4px 0; + font-size: 12px; + } + h5, h6 { + margin: 0 0 3px 0; + font-size: 10px; + } + p { + color: #666; + font-size: 14px; + margin-bottom: 2px; + } + + h1:last-child, + h2:last-child, + h3:last-child, + h4:last-child, + h5:last-child, + h6:last-child, + p:last-child { + margin-bottom: 0; + } + + // Align badges within items + .badge { + @include display-flex(); + position: absolute; + top: $item-padding; + right: ($item-padding * 2); + } + &.item-button-right .badge { + right: ($item-padding * 2) + 35; + } + &.item-divider .badge { + top: ceil($item-padding / 2); + } + .badge + .badge { + margin-right: 5px; + } + + // Different themes for items + &.item-light { + @include item-style($item-light-bg, $item-light-border, $item-light-text); + } + &.item-stable { + @include item-style($item-stable-bg, $item-stable-border, $item-stable-text); + } + &.item-positive { + @include item-style($item-positive-bg, $item-positive-border, $item-positive-text); + } + &.item-calm { + @include item-style($item-calm-bg, $item-calm-border, $item-calm-text); + } + &.item-assertive { + @include item-style($item-assertive-bg, $item-assertive-border, $item-assertive-text); + } + &.item-balanced { + @include item-style($item-balanced-bg, $item-balanced-border, $item-balanced-text); + } + &.item-energized { + @include item-style($item-energized-bg, $item-energized-border, $item-energized-text); + } + &.item-royal { + @include item-style($item-royal-bg, $item-royal-border, $item-royal-text); + } + &.item-dark { + @include item-style($item-dark-bg, $item-dark-border, $item-dark-text); + } + + &[ng-click]:hover { + cursor: pointer; + } + +} + +.list-borderless .item, +.item-borderless { + border-width: 0; +} + +// Link and Button Active States +.item.active, +.item.activated, +.item-complex.active .item-content, +.item-complex.activated .item-content, +.item .item-content.active, +.item .item-content.activated { + @include item-active-style($item-default-active-bg, $item-default-active-border); + + // Different active themes for <a> and <button> items + &.item-light { + @include item-active-style($item-light-active-bg, $item-light-active-border); + } + &.item-stable { + @include item-active-style($item-stable-active-bg, $item-stable-active-border); + } + &.item-positive { + @include item-active-style($item-positive-active-bg, $item-positive-active-border); + } + &.item-calm { + @include item-active-style($item-calm-active-bg, $item-calm-active-border); + } + &.item-assertive { + @include item-active-style($item-assertive-active-bg, $item-assertive-active-border); + } + &.item-balanced { + @include item-active-style($item-balanced-active-bg, $item-balanced-active-border); + } + &.item-energized { + @include item-active-style($item-energized-active-bg, $item-energized-active-border); + } + &.item-royal { + @include item-active-style($item-royal-active-bg, $item-royal-active-border); + } + &.item-dark { + @include item-active-style($item-dark-active-bg, $item-dark-active-border); + } +} + +// Handle text overflow +.item, +.item h1, +.item h2, +.item h3, +.item h4, +.item h5, +.item h6, +.item p, +.item-content, +.item-content h1, +.item-content h2, +.item-content h3, +.item-content h4, +.item-content h5, +.item-content h6, +.item-content p { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +// Linked list items +a.item { + color: inherit; + text-decoration: none; + + &:hover, + &:focus { + text-decoration: none; + } +} + + +/** + * Complex Items + * -------------------------------------------------- + * Adding .item-complex allows the .item to be slidable and + * have options underneath the button, but also requires an + * additional .item-content element inside .item. + * Basically .item-complex removes any default settings which + * .item added, so that .item-content looks them as just .item. + */ + +.item-complex, +a.item.item-complex, +button.item.item-complex { + padding: 0; +} +.item-complex .item-content, +.item-radio .item-content { + position: relative; + z-index: $z-index-item; + padding: $item-padding (ceil( ($item-padding * 3) + ($item-padding / 3) ) - 5) $item-padding $item-padding; + border: none; + background-color: $item-default-bg; +} + +a.item-content { + display: block; + color: inherit; + text-decoration: none; +} + +.item-text-wrap .item, +.item-text-wrap .item-content, +.item-text-wrap, +.item-text-wrap h1, +.item-text-wrap h2, +.item-text-wrap h3, +.item-text-wrap h4, +.item-text-wrap h5, +.item-text-wrap h6, +.item-text-wrap p, +.item-complex.item-text-wrap .item-content, +.item-body h1, +.item-body h2, +.item-body h3, +.item-body h4, +.item-body h5, +.item-body h6, +.item-body p { + overflow: visible; + white-space: normal; +} +.item-complex.item-text-wrap, +.item-complex.item-text-wrap h1, +.item-complex.item-text-wrap h2, +.item-complex.item-text-wrap h3, +.item-complex.item-text-wrap h4, +.item-complex.item-text-wrap h5, +.item-complex.item-text-wrap h6, +.item-complex.item-text-wrap p { + overflow: visible; + white-space: normal; +} + +// Link and Button Active States + +.item-complex{ + // Stylized items + &.item-light > .item-content{ + @include item-style($item-light-bg, $item-light-border, $item-light-text); + &.active, &:active { + @include item-active-style($item-light-active-bg, $item-light-active-border); + } + } + &.item-stable > .item-content{ + @include item-style($item-stable-bg, $item-stable-border, $item-stable-text); + &.active, &:active { + @include item-active-style($item-stable-active-bg, $item-stable-active-border); + } + } + &.item-positive > .item-content{ + @include item-style($item-positive-bg, $item-positive-border, $item-positive-text); + &.active, &:active { + @include item-active-style($item-positive-active-bg, $item-positive-active-border); + } + } + &.item-calm > .item-content{ + @include item-style($item-calm-bg, $item-calm-border, $item-calm-text); + &.active, &:active { + @include item-active-style($item-calm-active-bg, $item-calm-active-border); + } + } + &.item-assertive > .item-content{ + @include item-style($item-assertive-bg, $item-assertive-border, $item-assertive-text); + &.active, &:active { + @include item-active-style($item-assertive-active-bg, $item-assertive-active-border); + } + } + &.item-balanced > .item-content{ + @include item-style($item-balanced-bg, $item-balanced-border, $item-balanced-text); + &.active, &:active { + @include item-active-style($item-balanced-active-bg, $item-balanced-active-border); + } + } + &.item-energized > .item-content{ + @include item-style($item-energized-bg, $item-energized-border, $item-energized-text); + &.active, &:active { + @include item-active-style($item-energized-active-bg, $item-energized-active-border); + } + } + &.item-royal > .item-content{ + @include item-style($item-royal-bg, $item-royal-border, $item-royal-text); + &.active, &:active { + @include item-active-style($item-royal-active-bg, $item-royal-active-border); + } + } + &.item-dark > .item-content{ + @include item-style($item-dark-bg, $item-dark-border, $item-dark-text); + &.active, &:active { + @include item-active-style($item-dark-active-bg, $item-dark-active-border); + } + } +} + + +/** + * Item Icons + * -------------------------------------------------- + */ + +.item-icon-left .icon, +.item-icon-right .icon { + @include display-flex(); + @include align-items(center); + position: absolute; + top: 0; + height: 100%; + font-size: $item-icon-font-size; + + &:before { + display: block; + width: $item-icon-font-size; + text-align: center; + } +} + +.item .fill-icon { + min-width: $item-icon-fill-font-size + 2; + min-height: $item-icon-fill-font-size + 2; + font-size: $item-icon-fill-font-size; +} + +.item-icon-left { + padding-left: ceil( ($item-padding * 3) + ($item-padding / 3) ); + + .icon { + left: ceil( ($item-padding / 3) * 2); + } +} +.item-complex.item-icon-left { + padding-left: 0; + + .item-content { + padding-left: ceil( ($item-padding * 3) + ($item-padding / 3) ); + } +} + +.item-icon-right { + padding-right: ceil( ($item-padding * 3) + ($item-padding / 3) ); + + .icon { + right: ceil( ($item-padding / 3) * 2); + } +} +.item-complex.item-icon-right { + padding-right: 0; + + .item-content { + padding-right: ceil( ($item-padding * 3) + ($item-padding / 3) ); + } +} + +.item-icon-left.item-icon-right .icon:first-child { + right: auto; +} +.item-icon-left.item-icon-right .icon:last-child, +.item-icon-left .item-delete .icon { + left: auto; +} + +.item-icon-left .icon-accessory, +.item-icon-right .icon-accessory { + color: $item-icon-accessory-color; + font-size: $item-icon-accessory-font-size; +} +.item-icon-left .icon-accessory { + left: floor($item-padding / 5); +} +.item-icon-right .icon-accessory { + right: floor($item-padding / 5); +} + + +/** + * Item Button + * -------------------------------------------------- + * An item button is a child button inside an .item (not the entire .item) + */ + +.item-button-left { + padding-left: ceil($item-padding * 4.5); +} + +.item-button-left > .button, +.item-button-left .item-content > .button { + @include display-flex(); + @include align-items(center); + position: absolute; + top: ceil($item-padding / 2); + left: ceil( ($item-padding / 3) * 2); + min-width: $item-icon-font-size + ($button-border-width * 2); + min-height: $item-icon-font-size + ($button-border-width * 2); + font-size: $item-button-font-size; + line-height: $item-button-line-height; + + .icon:before { + position: relative; + left: auto; + width: auto; + line-height: $item-icon-font-size - 1; + } + + > .button { + margin: 0px 2px; + min-height: $item-icon-font-size + ($button-border-width * 2); + font-size: $item-button-font-size; + line-height: $item-button-line-height; + } +} + +.item-button-right, +a.item.item-button-right, +button.item.item-button-right { + padding-right: $item-padding * 5; +} + +.item-button-right > .button, +.item-button-right .item-content > .button, +.item-button-right > .buttons, +.item-button-right .item-content > .buttons { + @include display-flex(); + @include align-items(center); + position: absolute; + top: ceil($item-padding / 2); + right: $item-padding; + min-width: $item-icon-font-size + ($button-border-width * 2); + min-height: $item-icon-font-size + ($button-border-width * 2); + font-size: $item-button-font-size; + line-height: $item-button-line-height; + + .icon:before { + position: relative; + left: auto; + width: auto; + line-height: $item-icon-font-size - 1; + } + + > .button { + margin: 0px 2px; + min-width: $item-icon-font-size + ($button-border-width * 2); + min-height: $item-icon-font-size + ($button-border-width * 2); + font-size: $item-button-font-size; + line-height: $item-button-line-height; + } +} + +.item-button-left.item-button-right{ + .button{ + &:first-child { + right: auto; + } + &:last-child { + left: auto; + } + } +} + +// Item Avatar +// ------------------------------- + +.item-avatar, +.item-avatar .item-content, +.item-avatar-left, +.item-avatar-left .item-content { + padding-left: $item-avatar-width + ($item-padding * 2); + min-height: $item-avatar-width + ($item-padding * 2); + + > img:first-child, + .item-image { + position: absolute; + top: $item-padding; + left: $item-padding; + max-width: $item-avatar-width; + max-height: $item-avatar-height; + width: 100%; + height: 100%; + border-radius: $item-avatar-border-radius; + } +} + +.item-avatar-right, +.item-avatar-right .item-content { + padding-right: $item-avatar-width + ($item-padding * 2); + min-height: $item-avatar-width + ($item-padding * 2); + + > img:first-child, + .item-image { + position: absolute; + top: $item-padding; + right: $item-padding; + max-width: $item-avatar-width; + max-height: $item-avatar-height; + width: 100%; + height: 100%; + border-radius: $item-avatar-border-radius; + } +} + + +// Item Thumbnails +// ------------------------------- + +.item-thumbnail-left, +.item-thumbnail-left .item-content { + padding-top: $item-padding / 2; + padding-left: $item-thumbnail-width + $item-thumbnail-margin + $item-padding; + min-height: $item-thumbnail-height + ($item-thumbnail-margin * 2); + + > img:first-child, + .item-image { + position: absolute; + top: $item-thumbnail-margin; + left: $item-thumbnail-margin; + max-width: $item-thumbnail-width; + max-height: $item-thumbnail-height; + width: 100%; + height: 100%; + } +} +.item-avatar.item-complex, +.item-avatar-left.item-complex, +.item-thumbnail-left.item-complex { + padding-top: 0; + padding-left: 0; +} + +.item-thumbnail-right, +.item-thumbnail-right .item-content { + padding-top: $item-padding / 2; + padding-right: $item-thumbnail-width + $item-thumbnail-margin + $item-padding; + min-height: $item-thumbnail-height + ($item-thumbnail-margin * 2); + + > img:first-child, + .item-image { + position: absolute; + top: $item-thumbnail-margin; + right: $item-thumbnail-margin; + max-width: $item-thumbnail-width; + max-height: $item-thumbnail-height; + width: 100%; + height: 100%; + } +} +.item-avatar-right.item-complex, +.item-thumbnail-right.item-complex { + padding-top: 0; + padding-right: 0; +} + + +// Item Image +// ------------------------------- + +.item-image { + padding: 0; + text-align: center; + + img:first-child, .list-img { + width: 100%; + vertical-align: middle; + } +} + + +// Item Body +// ------------------------------- + +.item-body { + overflow: auto; + padding: $item-padding; + text-overflow: inherit; + white-space: normal; + + h1, h2, h3, h4, h5, h6, p { + margin-top: $item-padding; + margin-bottom: $item-padding; + } +} + + +// Item Divider +// ------------------------------- + +.item-divider { + padding-top: ceil($item-padding / 2); + padding-bottom: ceil($item-padding / 2); + min-height: 30px; + background-color: $item-divider-bg; + color: $item-divider-color; + font-weight: 500; +} + +.platform-ios .item-divider-platform, +.item-divider-ios { + padding-top: 26px; + text-transform: uppercase; + font-weight: 300; + font-size: 13px; + background-color: #efeff4; + color: #555; +} + +.platform-android .item-divider-platform, +.item-divider-android { + font-weight: 300; + font-size: 13px; +} + + +// Item Note +// ------------------------------- + +.item-note { + float: right; + color: #aaa; + font-size: 14px; +} + + +// Item Editing +// ------------------------------- + +.item-left-editable .item-content, +.item-right-editable .item-content { + // setup standard transition settings + @include transition-duration( $item-edit-transition-duration ); + @include transition-timing-function( $item-edit-transition-function ); + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + transition-property: transform; +} + +.list-left-editing .item-left-editable .item-content, +.item-left-editing.item-left-editable .item-content { + // actively editing the left side of the item + @include translate3d($item-left-edit-open-width, 0, 0); +} + +.item-remove-animate { + &.ng-leave { + @include transition-duration( $item-remove-transition-duration ); + } + &.ng-leave .item-content, + &.ng-leave:last-of-type { + @include transition-duration( $item-remove-transition-duration ); + @include transition-timing-function( $item-remove-transition-function ); + @include transition-property( all ); + } + + &.ng-leave.ng-leave-active .item-content { + opacity:0; + -webkit-transform: translate3d(-100%, 0, 0) !important; + transform: translate3d(-100%, 0, 0) !important; + } + &.ng-leave.ng-leave-active:last-of-type { + opacity: 0; + } + + &.ng-leave.ng-leave-active ~ ion-item:not(.ng-leave) { + -webkit-transform: translate3d(0, unquote('-webkit-calc(-100% + 1px)'), 0); + transform: translate3d(0, calc(-100% + 1px), 0); + @include transition-duration( $item-remove-transition-duration ); + @include transition-timing-function( $item-remove-descendents-transition-function ); + @include transition-property( all ); + } +} + + + +// Item Left Edit Button +// ------------------------------- + +.item-left-edit { + @include transition(all $item-edit-transition-function $item-edit-transition-duration / 2); + position: absolute; + top: 0; + left: 0; + z-index: $z-index-item-edit; + width: $item-left-edit-open-width; + height: 100%; + line-height: 100%; + + .button { + height: 100%; + + &.icon { + @include display-flex(); + @include align-items(center); + position: absolute; + top: 0; + height: 100%; + } + } + + display: none; + opacity: 0; + @include translate3d( ($item-left-edit-left - $item-left-edit-open-width) / 2, 0, 0); + &.visible { + display: block; + &.active { + opacity: 1; + @include translate3d($item-left-edit-left, 0, 0); + } + } +} +.list-left-editing .item-left-edit { + @include transition-delay($item-edit-transition-duration / 2); +} + +// Item Delete (Left side edit button) +// ------------------------------- + +.item-delete .button.icon { + color: $item-delete-icon-color; + font-size: $item-delete-icon-size; + + &:hover { + opacity: .7; + } +} + + +// Item Right Edit Button +// ------------------------------- + +.item-right-edit { + @include transition(all $item-edit-transition-function $item-edit-transition-duration); + position: absolute; + top: 0; + right: 0; + z-index: $z-index-item-reorder; + width: $item-right-edit-open-width * 1.5; + height: 100%; + background: inherit; + padding-left: 20px; + + .button { + min-width: $item-right-edit-open-width; + height: 100%; + + &.icon { + @include display-flex(); + @include align-items(center); + position: absolute; + top: 0; + height: 100%; + font-size: $item-reorder-icon-size; + } + } + + display: block; + opacity: 0; + @include translate3d($item-right-edit-open-width * 1.5, 0, 0); + &.visible { + display: block; + &.active { + opacity: 1; + @include translate3d(0, 0, 0); + } + } +} + + +// Item Reordering (Right side edit button) +// ------------------------------- + +.item-reorder .button.icon { + color: $item-reorder-icon-color; + font-size: $item-reorder-icon-size; +} + +.item-reordering { + // item is actively being reordered + position: absolute; + left: 0; + top: 0; + z-index: $z-index-item-reordering; + width: 100%; + box-shadow: 0px 0px 10px 0px #aaa; + + .item-reorder { + z-index: $z-index-item-reordering; + } +} + +.item-placeholder { + // placeholder for the item that's being reordered + opacity: 0.7; +} + + +/** + * The hidden right-side buttons that can be exposed under a list item + * with dragging. + */ +.item-options { + position: absolute; + top: 0; + right: 0; + z-index: $z-index-item-options; + height: 100%; + + .button { + height: 100%; + border: none; + border-radius: 0; + @include display-inline-flex(); + @include align-items(center); + + &:before{ + margin: 0 auto; + } + } +} diff --git a/www/lib/ionic/scss/_list.scss b/www/lib/ionic/scss/_list.scss new file mode 100644 index 00000000..309741e3 --- /dev/null +++ b/www/lib/ionic/scss/_list.scss @@ -0,0 +1,125 @@ + +/** + * Lists + * -------------------------------------------------- + */ + +.list { + position: relative; + padding-top: $item-border-width; + padding-bottom: $item-border-width; + padding-left: 0; // reset padding because ul and ol + margin-bottom: 20px; +} +.list:last-child { + margin-bottom: 0px; + &.card{ + margin-bottom:40px; + } +} + + +/** + * List Header + * -------------------------------------------------- + */ + +.list-header { + margin-top: $list-header-margin-top; + padding: $list-header-padding; + background-color: $list-header-bg; + color: $list-header-color; + font-weight: bold; +} + +// when its a card make sure it doesn't duplicate top and bottom borders +.card.list .list-item { + padding-right: 1px; + padding-left: 1px; +} + + +/** + * Cards and Inset Lists + * -------------------------------------------------- + * A card and list-inset are close to the same thing, except a card as a box shadow. + */ + +.card, +.list-inset { + overflow: hidden; + margin: ($content-padding * 2) $content-padding; + border-radius: $card-border-radius; + background-color: $card-body-bg; +} + +.card { + padding-top: $item-border-width; + padding-bottom: $item-border-width; + box-shadow: $card-box-shadow; + + .item { + border-left: 0; + border-right: 0; + } + .item:first-child { + border-top: 0; + } + .item:last-child { + border-bottom: 0; + } +} + +.padding { + .card, .list-inset { + margin-left: 0; + margin-right: 0; + } +} + +.card .item, +.list-inset .item, +.padding > .list .item +{ + &:first-child { + border-top-left-radius: $card-border-radius; + border-top-right-radius: $card-border-radius; + + .item-content { + border-top-left-radius: $card-border-radius; + border-top-right-radius: $card-border-radius; + } + } + &:last-child { + border-bottom-right-radius: $card-border-radius; + border-bottom-left-radius: $card-border-radius; + + .item-content { + border-bottom-right-radius: $card-border-radius; + border-bottom-left-radius: $card-border-radius; + } + } +} + +.card .item:last-child, +.list-inset .item:last-child { + margin-bottom: $item-border-width * -1; +} + +.card .item, +.list-inset .item, +.padding > .list .item, +.padding-horizontal > .list .item { + margin-right: 0; + margin-left: 0; + + &.item-input input { + padding-right: 44px; + } +} +.padding-left > .list .item { + margin-left: 0; +} +.padding-right > .list .item { + margin-right: 0; +} diff --git a/www/lib/ionic/scss/_loading.scss b/www/lib/ionic/scss/_loading.scss new file mode 100644 index 00000000..71b819a5 --- /dev/null +++ b/www/lib/ionic/scss/_loading.scss @@ -0,0 +1,51 @@ + +/** + * Loading + * -------------------------------------------------- + */ + +.loading-container { + position: absolute; + left: 0; + top: 0; + right: 0; + bottom: 0; + + z-index: $z-index-loading; + + @include display-flex(); + @include justify-content(center); + @include align-items(center); + + @include transition(0.2s opacity linear); + visibility: hidden; + opacity: 0; + + &:not(.visible) .icon, + &:not(.visible) .spinner{ + display: none; + } + &.visible { + visibility: visible; + } + &.active { + opacity: 1; + } + + .loading { + padding: $loading-padding; + + border-radius: $loading-border-radius; + background-color: $loading-bg-color; + + color: $loading-text-color; + + text-align: center; + text-overflow: ellipsis; + font-size: $loading-font-size; + + h1, h2, h3, h4, h5, h6 { + color: $loading-text-color; + } + } +} diff --git a/www/lib/ionic/scss/_menu.scss b/www/lib/ionic/scss/_menu.scss new file mode 100644 index 00000000..17466758 --- /dev/null +++ b/www/lib/ionic/scss/_menu.scss @@ -0,0 +1,70 @@ + +/** + * Menus + * -------------------------------------------------- + * Side panel structure + */ + +.menu { + position: absolute; + top: 0; + bottom: 0; + z-index: $z-index-menu; + overflow: hidden; + + min-height: 100%; + max-height: 100%; + width: $menu-width; + + background-color: $menu-bg; + + .scroll-content { + z-index: $z-index-menu-scroll-content; + } + + .bar-header { + z-index: $z-index-menu-bar-header; + } +} + +.menu-content { + @include transform(none); + box-shadow: $menu-side-shadow; +} + +.menu-open .menu-content .pane, +.menu-open .menu-content .scroll-content { + pointer-events: none; +} +.menu-open .menu-content .scroll-content .scroll { + pointer-events: none; +} +.menu-open .menu-content .scroll-content:not(.overflow-scroll) { + overflow: hidden; +} + +.grade-b .menu-content, +.grade-c .menu-content { + @include box-sizing(content-box); + right: -1px; + left: -1px; + border-right: 1px solid #ccc; + border-left: 1px solid #ccc; + box-shadow: none; +} + +.menu-left { + left: 0; +} + +.menu-right { + right: 0; +} + +.aside-open.aside-resizing .menu-right { + display: none; +} + +.menu-animated { + @include transition-transform($menu-animation-speed ease); +} diff --git a/www/lib/ionic/scss/_mixins.scss b/www/lib/ionic/scss/_mixins.scss new file mode 100644 index 00000000..ac5df7f4 --- /dev/null +++ b/www/lib/ionic/scss/_mixins.scss @@ -0,0 +1,642 @@ + +// Button Mixins +// -------------------------------------------------- + +@mixin button-style($bg-color, $border-color, $active-bg-color, $active-border-color, $color) { + border-color: $border-color; + background-color: $bg-color; + color: $color; + + // Give desktop users something to play with + &:hover { + color: $color; + text-decoration: none; + } + &.active, + &.activated { + @if $active-border-color != ""{ + border-color: $active-border-color; + } + background-color: $active-bg-color; + //box-shadow: inset 0 1px 4px rgba(0,0,0,0.1); + } +} + +@mixin button-clear($color, $font-size:"") { + &.button-clear { + border-color: transparent; + background: none; + box-shadow: none; + color: $color; + + @if $font-size != "" { + font-size: $font-size; + } + } + &.button-icon { + border-color: transparent; + background: none; + } +} + +@mixin button-outline($color, $text-color:"") { + &.button-outline { + border-color: $color; + background: transparent; + @if $text-color == "" { + $text-color: $color; + } + color: $text-color; + &.active, + &.activated { + background-color: $color; + box-shadow: none; + color: #fff; + } + } +} + + +// Bar Mixins +// -------------------------------------------------- + +@mixin bar-style($bg-color, $border-color, $color) { + border-color: $border-color; + background-color: $bg-color; + background-image: linear-gradient(0deg, $border-color, $border-color 50%, transparent 50%); + color: $color; + + .title { + color: $color; + } +} + + +// Tab Mixins +// -------------------------------------------------- + +@mixin tab-style($bg-color, $border-color, $color) { + border-color: $border-color; + background-color: $bg-color; + background-image: linear-gradient(0deg, $border-color, $border-color 50%, transparent 50%); + color: $color; +} + +@mixin tab-badge-style($bg-color, $color) { + .tab-item .badge { + background-color: $bg-color; + color: $color; + } +} + + +// Item Mixins +// -------------------------------------------------- + +@mixin item-style($bg-color, $border-color, $color) { + border-color: $border-color; + background-color: $bg-color; + color: $color; +} + +@mixin item-active-style($active-bg-color, $active-border-color) { + border-color: $active-border-color; + background-color: $active-bg-color; + &.item-complex > .item-content { + border-color: $active-border-color; + background-color: $active-bg-color; + } +} + + +// Badge Mixins +// -------------------------------------------------- + +@mixin badge-style($bg-color, $color) { + background-color: $bg-color; + color: $color; +} + + +// Range Mixins +// -------------------------------------------------- + +@mixin range-style($track-bg-color) { + &::-webkit-slider-thumb:before { + background: $track-bg-color; + } + &::-ms-fill-lower{ + background: $track-bg-color; + } +} + + +// Checkbox Mixins +// -------------------------------------------------- + +@mixin checkbox-style($off-border-color, $on-bg-color, $on-border-color) { + & input:before, + & .checkbox-icon:before { + border-color: $off-border-color; + } + + // what the background looks like when its checked + & input:checked:before, + & input:checked + .checkbox-icon:before { + background: $on-bg-color; + border-color: $on-border-color; + } +} + + +// Toggle Mixins +// -------------------------------------------------- + +@mixin toggle-style($on-border-color, $on-bg-color) { + // the track when the toggle is "on" + & input:checked + .track { + border-color: $on-border-color; + background-color: $on-bg-color; + } +} +@mixin toggle-small-style($on-bg-color) { + // the track when the toggle is "on" + & input:checked + .track { + background-color: rgba($on-bg-color, .5); + } + & input:checked + .track .handle { + background-color: $on-bg-color; + } +} + + +// Clearfix +// -------------------------------------------------- + +@mixin clearfix { + *zoom: 1; + &:before, + &:after { + display: table; + content: ""; + line-height: 0; + } + &:after { + clear: both; + } +} + + +// Placeholder text +// -------------------------------------------------- + +@mixin placeholder($color: $input-color-placeholder, $text-indent: 0) { + &::-moz-placeholder { // Firefox 19+ + color: $color; + } + &:-ms-input-placeholder { + color: $color; + } + &::-webkit-input-placeholder { + color: $color; + // Safari placeholder margin issue + text-indent: $text-indent; + } +} + + +// Text Mixins +// -------------------------------------------------- + +@mixin text-size-adjust($value: none) { + -webkit-text-size-adjust: $value; + -moz-text-size-adjust: $value; + text-size-adjust: $value; +} +@mixin tap-highlight-transparent() { + -webkit-tap-highlight-color: rgba(0,0,0,0); + -webkit-tap-highlight-color: transparent; // For some Androids +} +@mixin touch-callout($value: none) { + -webkit-touch-callout: $value; +} + + +// Font Mixins +// -------------------------------------------------- + +@mixin font-family-serif() { + font-family: $serif-font-family; +} +@mixin font-family-sans-serif() { + font-family: $sans-font-family; +} +@mixin font-family-monospace() { + font-family: $mono-font-family; +} +@mixin font-shorthand($size: $base-font-size, $weight: normal, $line-height: $base-line-height) { + font-weight: $weight; + font-size: $size; + line-height: $line-height; +} +@mixin font-serif($size: $base-font-size, $weight: normal, $line-height: $base-line-height) { + @include font-family-serif(); + @include font-shorthand($size, $weight, $line-height); +} +@mixin font-sans-serif($size: $base-font-size, $weight: normal, $line-height: $base-line-height) { + @include font-family-sans-serif(); + @include font-shorthand($size, $weight, $line-height); +} +@mixin font-monospace($size: $base-font-size, $weight: normal, $line-height: $base-line-height) { + @include font-family-monospace(); + @include font-shorthand($size, $weight, $line-height); +} +@mixin font-smoothing($font-smoothing) { + -webkit-font-smoothing: $font-smoothing; + font-smoothing: $font-smoothing; +} + + +// Appearance +// -------------------------------------------------- + +@mixin appearance($val) { + -webkit-appearance: $val; + -moz-appearance: $val; + appearance: $val; +} + + +// Border Radius Mixins +// -------------------------------------------------- + +@mixin border-radius($radius) { + -webkit-border-radius: $radius; + border-radius: $radius; +} + +// Single Corner Border Radius +@mixin border-top-left-radius($radius) { + -webkit-border-top-left-radius: $radius; + border-top-left-radius: $radius; +} +@mixin border-top-right-radius($radius) { + -webkit-border-top-right-radius: $radius; + border-top-right-radius: $radius; +} +@mixin border-bottom-right-radius($radius) { + -webkit-border-bottom-right-radius: $radius; + border-bottom-right-radius: $radius; +} +@mixin border-bottom-left-radius($radius) { + -webkit-border-bottom-left-radius: $radius; + border-bottom-left-radius: $radius; +} + +// Single Side Border Radius +@mixin border-top-radius($radius) { + @include border-top-right-radius($radius); + @include border-top-left-radius($radius); +} +@mixin border-right-radius($radius) { + @include border-top-right-radius($radius); + @include border-bottom-right-radius($radius); +} +@mixin border-bottom-radius($radius) { + @include border-bottom-right-radius($radius); + @include border-bottom-left-radius($radius); +} +@mixin border-left-radius($radius) { + @include border-top-left-radius($radius); + @include border-bottom-left-radius($radius); +} + + +// Box shadows +// -------------------------------------------------- + +@mixin box-shadow($shadow...) { + -webkit-box-shadow: $shadow; + box-shadow: $shadow; +} + + +// Transition Mixins +// -------------------------------------------------- + +@mixin transition($transition...) { + -webkit-transition: $transition; + transition: $transition; +} +@mixin transition-delay($transition-delay) { + -webkit-transition-delay: $transition-delay; + transition-delay: $transition-delay; +} +@mixin transition-duration($transition-duration) { + -webkit-transition-duration: $transition-duration; + transition-duration: $transition-duration; +} +@mixin transition-timing-function($transition-timing) { + -webkit-transition-timing-function: $transition-timing; + transition-timing-function: $transition-timing; + } + @mixin transition-property($property) { + -webkit-transition-property: $property; + transition-property: $property; +} +@mixin transition-transform($properties...) { + // special case cuz of transform vendor prefixes + -webkit-transition: -webkit-transform $properties; + transition: transform $properties; +} + + +// Animation Mixins +// -------------------------------------------------- + +@mixin animation($animation) { + -webkit-animation: $animation; + animation: $animation; +} +@mixin animation-duration($duration) { + -webkit-animation-duration: $duration; + animation-duration: $duration; +} +@mixin animation-direction($direction) { + -webkit-animation-direction: $direction; + animation-direction: $direction; +} +@mixin animation-timing-function($animation-timing) { + -webkit-animation-timing-function: $animation-timing; + animation-timing-function: $animation-timing; +} +@mixin animation-fill-mode($fill-mode) { + -webkit-animation-fill-mode: $fill-mode; + animation-fill-mode: $fill-mode; +} +@mixin animation-name($name...) { + -webkit-animation-name: $name; + animation-name: $name; +} +@mixin animation-iteration-count($count) { + -webkit-animation-iteration-count: $count; + animation-iteration-count: $count; +} + + +// Transformation Mixins +// -------------------------------------------------- + +@mixin rotate($degrees) { + @include transform( rotate($degrees) ); +} +@mixin scale($ratio) { + @include transform( scale($ratio) ); +} +@mixin translate($x, $y) { + @include transform( translate($x, $y) ); +} +@mixin skew($x, $y) { + @include transform( skew($x, $y) ); + -webkit-backface-visibility: hidden; +} +@mixin translate3d($x, $y, $z) { + @include transform( translate3d($x, $y, $z) ); +} +@mixin translateZ($z) { + @include transform( translateZ($z) ); +} +@mixin transform($val) { + -webkit-transform: $val; + transform: $val; +} + +@mixin transform-origin($left, $top) { + -webkit-transform-origin: $left $top; + transform-origin: $left $top; +} + + +// Backface visibility +// -------------------------------------------------- +// Prevent browsers from flickering when using CSS 3D transforms. +// Default value is `visible`, but can be changed to `hidden + +@mixin backface-visibility($visibility){ + -webkit-backface-visibility: $visibility; + backface-visibility: $visibility; +} + + +// Background clipping +// -------------------------------------------------- + +@mixin background-clip($clip) { + -webkit-background-clip: $clip; + background-clip: $clip; +} + + +// Background sizing +// -------------------------------------------------- + +@mixin background-size($size) { + -webkit-background-size: $size; + background-size: $size; +} + + +// Box sizing +// -------------------------------------------------- + +@mixin box-sizing($boxmodel) { + -webkit-box-sizing: $boxmodel; + -moz-box-sizing: $boxmodel; + box-sizing: $boxmodel; +} + + +// User select +// -------------------------------------------------- + +@mixin user-select($select) { + -webkit-user-select: $select; + -moz-user-select: $select; + -ms-user-select: $select; + user-select: $select; +} + + +// Content Columns +// -------------------------------------------------- + +@mixin content-columns($columnCount, $columnGap: $grid-gutter-width) { + -webkit-column-count: $columnCount; + -moz-column-count: $columnCount; + column-count: $columnCount; + -webkit-column-gap: $columnGap; + -moz-column-gap: $columnGap; + column-gap: $columnGap; +} + + +// Flexbox Mixins +// -------------------------------------------------- +// http://philipwalton.github.io/solved-by-flexbox/ +// https://github.com/philipwalton/solved-by-flexbox + +@mixin display-flex { + display: -webkit-box; + display: -webkit-flex; + display: -moz-box; + display: -moz-flex; + display: -ms-flexbox; + display: flex; +} + +@mixin display-inline-flex { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -moz-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; +} + +@mixin flex-direction($value: row) { + @if $value == row-reverse { + -webkit-box-direction: reverse; + -webkit-box-orient: horizontal; + } @else if $value == column { + -webkit-box-direction: normal; + -webkit-box-orient: vertical; + } @else if $value == column-reverse { + -webkit-box-direction: reverse; + -webkit-box-orient: vertical; + } @else { + -webkit-box-direction: normal; + -webkit-box-orient: horizontal; + } + -webkit-flex-direction: $value; + -moz-flex-direction: $value; + -ms-flex-direction: $value; + flex-direction: $value; +} + +@mixin flex-wrap($value: nowrap) { + // No Webkit Box fallback. + -webkit-flex-wrap: $value; + -moz-flex-wrap: $value; + @if $value == nowrap { + -ms-flex-wrap: none; + } @else { + -ms-flex-wrap: $value; + } + flex-wrap: $value; +} + +@mixin flex($fg: 1, $fs: null, $fb: null) { + -webkit-box-flex: $fg; + -webkit-flex: $fg $fs $fb; + -moz-box-flex: $fg; + -moz-flex: $fg $fs $fb; + -ms-flex: $fg $fs $fb; + flex: $fg $fs $fb; +} + +@mixin flex-flow($values: (row nowrap)) { + // No Webkit Box fallback. + -webkit-flex-flow: $values; + -moz-flex-flow: $values; + -ms-flex-flow: $values; + flex-flow: $values; +} + +@mixin align-items($value: stretch) { + @if $value == flex-start { + -webkit-box-align: start; + -ms-flex-align: start; + } @else if $value == flex-end { + -webkit-box-align: end; + -ms-flex-align: end; + } @else { + -webkit-box-align: $value; + -ms-flex-align: $value; + } + -webkit-align-items: $value; + -moz-align-items: $value; + align-items: $value; +} + +@mixin align-self($value: auto) { + -webkit-align-self: $value; + -moz-align-self: $value; + @if $value == flex-start { + -ms-flex-item-align: start; + } @else if $value == flex-end { + -ms-flex-item-align: end; + } @else { + -ms-flex-item-align: $value; + } + align-self: $value; +} + +@mixin align-content($value: stretch) { + -webkit-align-content: $value; + -moz-align-content: $value; + @if $value == flex-start { + -ms-flex-line-pack: start; + } @else if $value == flex-end { + -ms-flex-line-pack: end; + } @else { + -ms-flex-line-pack: $value; + } + align-content: $value; +} + +@mixin justify-content($value: stretch) { + @if $value == flex-start { + -webkit-box-pack: start; + -ms-flex-pack: start; + } @else if $value == flex-end { + -webkit-box-pack: end; + -ms-flex-pack: end; + } @else if $value == space-between { + -webkit-box-pack: justify; + -ms-flex-pack: justify; + } @else { + -webkit-box-pack: $value; + -ms-flex-pack: $value; + } + -webkit-justify-content: $value; + -moz-justify-content: $value; + justify-content: $value; +} + +@mixin flex-order($n) { + -webkit-order: $n; + -ms-flex-order: $n; + order: $n; + -webkit-box-ordinal-group: $n; +} + +@mixin responsive-grid-break($selector, $max-width) { + @media (max-width: $max-width) { + #{$selector} { + -webkit-box-direction: normal; + -moz-box-direction: normal; + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + + .col, .col-10, .col-20, .col-25, .col-33, .col-34, .col-50, .col-66, .col-67, .col-75, .col-80, .col-90 { + @include flex(1); + margin-bottom: ($grid-padding-width * 3) / 2; + margin-left: 0; + max-width: 100%; + width: 100%; + } + } + } +} diff --git a/www/lib/ionic/scss/_modal.scss b/www/lib/ionic/scss/_modal.scss new file mode 100644 index 00000000..7450fe9a --- /dev/null +++ b/www/lib/ionic/scss/_modal.scss @@ -0,0 +1,102 @@ + +/** + * Modals + * -------------------------------------------------- + * Modals are independent windows that slide in from off-screen. + */ + +.modal-backdrop, +.modal-backdrop-bg { + position: fixed; + top: 0; + left: 0; + z-index: $z-index-modal; + width: 100%; + height: 100%; +} + +.modal-backdrop-bg { + pointer-events: none; +} + +.modal { + display: block; + position: absolute; + top: 0; + z-index: $z-index-modal; + overflow: hidden; + min-height: 100%; + width: 100%; + background-color: $modal-bg-color; +} + +@media (min-width: $modal-inset-mode-break-point) { + // inset mode is when the modal doesn't fill the entire + // display but instead is centered within a large display + .modal { + top: $modal-inset-mode-top; + right: $modal-inset-mode-right; + bottom: $modal-inset-mode-bottom; + left: $modal-inset-mode-left; + min-height: $modal-inset-mode-min-height; + width: (100% - $modal-inset-mode-left - $modal-inset-mode-right); + } + + .modal.ng-leave-active { + bottom: 0; + } + + // remove ios header padding from inset header + .platform-ios.platform-cordova .modal-wrapper .modal { + .bar-header:not(.bar-subheader) { + height: $bar-height; + > * { + margin-top: 0; + } + } + .tabs-top > .tabs, + .tabs.tabs-top { + top: $bar-height; + } + .has-header, + .bar-subheader { + top: $bar-height; + } + .has-subheader { + top: $bar-height + $bar-subheader-height; + } + .has-header.has-tabs-top { + top: $bar-height + $tabs-height; + } + .has-header.has-subheader.has-tabs-top { + top: $bar-height + $bar-subheader-height + $tabs-height; + } + } + + .modal-backdrop-bg { + @include transition(opacity 300ms ease-in-out); + background-color: $modal-backdrop-bg-active; + opacity: 0; + } + + .active .modal-backdrop-bg { + opacity: 0.5; + } +} + +// disable clicks on all but the modal +.modal-open { + pointer-events: none; + + .modal, + .modal-backdrop { + pointer-events: auto; + } + // prevent clicks on modal when loading overlay is active though + &.loading-active { + .modal, + .modal-backdrop { + pointer-events: none; + } + } +} diff --git a/www/lib/ionic/scss/_platform.scss b/www/lib/ionic/scss/_platform.scss new file mode 100644 index 00000000..163994e8 --- /dev/null +++ b/www/lib/ionic/scss/_platform.scss @@ -0,0 +1,77 @@ + +/** + * Platform + * -------------------------------------------------- + * Platform specific tweaks + */ + +.platform-ios.platform-cordova { + // iOS has a status bar which sits on top of the header. + // Bump down everything to make room for it. However, if + // if its in Cordova, and set to fullscreen, then disregard the bump. + &:not(.fullscreen) { + .bar-header:not(.bar-subheader) { + height: $bar-height + $ios-statusbar-height; + + &.item-input-inset .item-input-wrapper { + margin-top: 19px !important; + } + + > * { + margin-top: $ios-statusbar-height; + } + } + .tabs-top > .tabs, + .tabs.tabs-top { + top: $bar-height + $ios-statusbar-height; + } + + .has-header, + .bar-subheader { + top: $bar-height + $ios-statusbar-height; + } + .has-subheader { + top: $bar-height + $bar-subheader-height + $ios-statusbar-height; + } + .has-header.has-tabs-top { + top: $bar-height + $tabs-height + $ios-statusbar-height; + } + .has-header.has-subheader.has-tabs-top { + top: $bar-height + $bar-subheader-height + $tabs-height + $ios-statusbar-height; + } + } + .popover{ + .bar-header:not(.bar-subheader) { + height: $bar-height; + &.item-input-inset .item-input-wrapper { + margin-top: -1px; + } + > * { + margin-top: 0; + } + } + .has-header, + .bar-subheader { + top: $bar-height; + } + .has-subheader { + top: $bar-height + $bar-subheader-height; + } + } + &.status-bar-hide { + // Cordova doesn't adjust the body height correctly, this makes up for it + margin-bottom: 20px; + } +} + +@media (orientation:landscape) { + .platform-ios.platform-browser.platform-ipad { + position: fixed; // required for iPad 7 Safari + } +} + +.platform-c:not(.enable-transitions) * { + // disable transitions on grade-c devices (Android 2) + -webkit-transition: none !important; + transition: none !important; +} diff --git a/www/lib/ionic/scss/_popover.scss b/www/lib/ionic/scss/_popover.scss new file mode 100644 index 00000000..00c15086 --- /dev/null +++ b/www/lib/ionic/scss/_popover.scss @@ -0,0 +1,168 @@ + +/** + * Popovers + * -------------------------------------------------- + * Popovers are independent views which float over content + */ + +.popover-backdrop { + position: fixed; + top: 0; + left: 0; + z-index: $z-index-popover; + width: 100%; + height: 100%; + background-color: $popover-backdrop-bg-inactive; + + &.active { + background-color: $popover-backdrop-bg-active; + } +} + +.popover { + position: absolute; + top: 25%; + left: 50%; + z-index: $z-index-popover; + display: block; + margin-top: 12px; + margin-left: -$popover-width / 2; + height: $popover-height; + width: $popover-width; + background-color: $popover-bg-color; + box-shadow: $popover-box-shadow; + opacity: 0; + + .item:first-child { + border-top: 0; + } + + .item:last-child { + border-bottom: 0; + } + + &.popover-bottom { + margin-top: -12px; + } +} + + +// Set popover border-radius +.popover, +.popover .bar-header { + border-radius: $popover-border-radius; +} +.popover .scroll-content { + z-index: 1; + margin: 2px 0; +} +.popover .bar-header { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +.popover .has-header { + border-top-right-radius: 0; + border-top-left-radius: 0; +} +.popover-arrow { + display: none; +} + + +// iOS Popover +.platform-ios { + + .popover { + box-shadow: $popover-box-shadow-ios; + border-radius: $popover-border-radius-ios; + } + .popover .bar-header { + @include border-top-radius($popover-border-radius-ios); + } + .popover .scroll-content { + margin: 8px 0; + border-radius: $popover-border-radius-ios; + } + .popover .scroll-content.has-header { + margin-top: 0; + } + .popover-arrow { + position: absolute; + display: block; + top: -17px; + width: 30px; + height: 19px; + overflow: hidden; + + &:after { + position: absolute; + top: 12px; + left: 5px; + width: 20px; + height: 20px; + background-color: $popover-bg-color; + border-radius: 3px; + content: ''; + @include rotate(-45deg); + } + } + .popover-bottom .popover-arrow { + top: auto; + bottom: -10px; + &:after { + top: -6px; + } + } +} + + +// Android Popover +.platform-android { + + .popover { + margin-top: -32px; + background-color: $popover-bg-color-android; + box-shadow: $popover-box-shadow-android; + + .item { + border-color: $popover-bg-color-android; + background-color: $popover-bg-color-android; + color: #4d4d4d; + } + &.popover-bottom { + margin-top: 32px; + } + } + + .popover-backdrop, + .popover-backdrop.active { + background-color: transparent; + } +} + + +// disable clicks on all but the popover +.popover-open { + pointer-events: none; + + .popover, + .popover-backdrop { + pointer-events: auto; + } + // prevent clicks on popover when loading overlay is active though + &.loading-active { + .popover, + .popover-backdrop { + pointer-events: none; + } + } +} + + +// wider popover on larger viewports +@media (min-width: $popover-large-break-point) { + .popover { + width: $popover-large-width; + margin-left: -$popover-large-width / 2; + } +} diff --git a/www/lib/ionic/scss/_popup.scss b/www/lib/ionic/scss/_popup.scss new file mode 100644 index 00000000..a3e521a6 --- /dev/null +++ b/www/lib/ionic/scss/_popup.scss @@ -0,0 +1,110 @@ + +/** + * Popups + * -------------------------------------------------- + */ + +.popup-container { + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0; + background: rgba(0,0,0,0); + + @include display-flex(); + @include justify-content(center); + @include align-items(center); + + z-index: $z-index-popup; + + // Start hidden + visibility: hidden; + &.popup-showing { + visibility: visible; + } + + &.popup-hidden .popup { + @include animation-name(scaleOut); + @include animation-duration($popup-leave-animation-duration); + @include animation-timing-function(ease-in-out); + @include animation-fill-mode(both); + } + + &.active .popup { + @include animation-name(superScaleIn); + @include animation-duration($popup-enter-animation-duration); + @include animation-timing-function(ease-in-out); + @include animation-fill-mode(both); + } + + .popup { + width: $popup-width; + max-width: 100%; + max-height: 90%; + + border-radius: $popup-border-radius; + background-color: $popup-background-color; + + @include display-flex(); + @include flex-direction(column); + } + + input, + textarea { + width: 100%; + } +} + +.popup-head { + padding: 15px 10px; + border-bottom: 1px solid #eee; + text-align: center; +} +.popup-title { + margin: 0; + padding: 0; + font-size: 15px; +} +.popup-sub-title { + margin: 5px 0 0 0; + padding: 0; + font-weight: normal; + font-size: 11px; +} +.popup-body { + padding: 10px; + overflow: auto; +} + +.popup-buttons { + @include display-flex(); + @include flex-direction(row); + padding: 10px; + min-height: $popup-button-min-height + 20; + + .button { + @include flex(1); + display: block; + min-height: $popup-button-min-height; + border-radius: $popup-button-border-radius; + line-height: $popup-button-line-height; + + margin-right: 5px; + &:last-child { + margin-right: 0px; + } + } +} + +.popup-open { + pointer-events: none; + + &.modal-open .modal { + pointer-events: none; + } + + .popup-backdrop, .popup { + pointer-events: auto; + } +} diff --git a/www/lib/ionic/scss/_progress.scss b/www/lib/ionic/scss/_progress.scss new file mode 100644 index 00000000..5defdcbb --- /dev/null +++ b/www/lib/ionic/scss/_progress.scss @@ -0,0 +1,11 @@ + +/** + * Progress + * -------------------------------------------------- + */ + +progress { + display: block; + margin: $progress-margin; + width: $progress-width; +} diff --git a/www/lib/ionic/scss/_radio.scss b/www/lib/ionic/scss/_radio.scss new file mode 100644 index 00000000..fa401c06 --- /dev/null +++ b/www/lib/ionic/scss/_radio.scss @@ -0,0 +1,47 @@ + +/** + * Radio Button Inputs + * -------------------------------------------------- + */ + +.item-radio { + padding: 0; + + &:hover { + cursor: pointer; + } +} + +.item-radio .item-content { + /* give some room to the right for the checkmark icon */ + padding-right: $item-padding * 4; +} + +.item-radio .radio-icon { + /* checkmark icon will be hidden by default */ + position: absolute; + top: 0; + right: 0; + z-index: $z-index-item-radio; + visibility: hidden; + padding: $item-padding - 2; + height: 100%; + font-size: 24px; +} + +.item-radio input { + /* hide any radio button inputs elements (the ugly circles) */ + position: absolute; + left: -9999px; + + &:checked + .radio-content .item-content { + /* style the item content when its checked */ + background: #f7f7f7; + } + + &:checked + .radio-content .radio-icon { + /* show the checkmark icon when its checked */ + visibility: visible; + } +} + diff --git a/www/lib/ionic/scss/_range.scss b/www/lib/ionic/scss/_range.scss new file mode 100644 index 00000000..54d4e187 --- /dev/null +++ b/www/lib/ionic/scss/_range.scss @@ -0,0 +1,160 @@ + +/** + * Range + * -------------------------------------------------- + */ + + .range input{ + display: inline-block; + overflow: hidden; + margin-top: 5px; + margin-bottom: 5px; + padding-right: 2px; + padding-left: 1px; + width: auto; + height: $range-slider-height + 15; + outline: none; + background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, $range-default-track-bg), color-stop(100%, $range-default-track-bg)); + background: linear-gradient(to right, $range-default-track-bg 0%, $range-default-track-bg 100%); + background-position: center; + background-size: 99% $range-track-height; + background-repeat: no-repeat; + -webkit-appearance: none; + + &::-moz-focus-outer { + /* hide the focus outline in Firefox */ + border: 0; + } + + &::-webkit-slider-thumb { + position: relative; + width: $range-slider-width; + height: $range-slider-height; + border-radius: $range-slider-border-radius; + background-color: $toggle-handle-off-bg-color; + box-shadow: $range-slider-box-shadow; + cursor: pointer; + -webkit-appearance: none; + border: 0; + } + + &::-webkit-slider-thumb:before{ + /* what creates the colorful line on the left side of the slider */ + position: absolute; + top: ($range-slider-height / 2) - ($range-track-height / 2); + left: -2001px; + width: 2000px; + height: $range-track-height; + background: $dark; + content: ' '; + } + + &::-webkit-slider-thumb:after { + /* create a larger (but hidden) hit area */ + position: absolute; + top: -15px; + left: -15px; + padding: 30px; + content: ' '; + //background: red; + //opacity: .5; + } + &::-ms-fill-lower{ + height: $range-track-height; + background:$dark; + } + /* + &::-ms-track{ + background: transparent; + border-color: transparent; + border-width: 11px 0 16px; + color:transparent; + margin-top:20px; + } + &::-ms-thumb { + width: $range-slider-width; + height: $range-slider-height; + border-radius: $range-slider-border-radius; + background-color: $toggle-handle-off-bg-color; + border-color:$toggle-handle-off-bg-color; + box-shadow: $range-slider-box-shadow; + margin-left:1px; + margin-right:1px; + outline:none; + } + &::-ms-fill-upper { + height: $range-track-height; + background:$range-default-track-bg; + } + */ +} + +.range { + @include display-flex(); + @include align-items(center); + padding: 2px 11px; + + &.range-light { + input { @include range-style($range-light-track-bg); } + } + &.range-stable { + input { @include range-style($range-stable-track-bg); } + } + &.range-positive { + input { @include range-style($range-positive-track-bg); } + } + &.range-calm { + input { @include range-style($range-calm-track-bg); } + } + &.range-balanced { + input { @include range-style($range-balanced-track-bg); } + } + &.range-assertive { + input { @include range-style($range-assertive-track-bg); } + } + &.range-energized { + input { @include range-style($range-energized-track-bg); } + } + &.range-royal { + input { @include range-style($range-royal-track-bg); } + } + &.range-dark { + input { @include range-style($range-dark-track-bg); } + } +} + +.range .icon { + @include flex(0); + display: block; + min-width: $range-icon-size; + text-align: center; + font-size: $range-icon-size; +} + +.range input { + @include flex(1); + display: block; + margin-right: 10px; + margin-left: 10px; +} + +.range-label { + @include flex(0, 0, auto); + display: block; + white-space: nowrap; +} + +.range-label:first-child { + padding-left: 5px; +} +.range input + .range-label { + padding-right: 5px; + padding-left: 0; +} + +// WP range height must be auto +.platform-windowsphone{ + .range input{ + height:auto; + } +} diff --git a/www/lib/ionic/scss/_refresher.scss b/www/lib/ionic/scss/_refresher.scss new file mode 100644 index 00000000..a3bfd185 --- /dev/null +++ b/www/lib/ionic/scss/_refresher.scss @@ -0,0 +1,113 @@ + +// Scroll refresher (for pull to refresh) +.scroll-refresher { + position: absolute; + top: -60px; + right: 0; + left: 0; + overflow: hidden; + margin: auto; + height: 60px; + .ionic-refresher-content { + position: absolute; + bottom: 15px; + left: 0; + width: 100%; + color: $scroll-refresh-icon-color; + text-align: center; + + font-size: 30px; + + .text-refreshing, + .text-pulling { + font-size: 16px; + line-height: 16px; + } + &.ionic-refresher-with-text { + bottom: 10px; + } + } + + .icon-refreshing, + .icon-pulling { + width: 100%; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; + } + .icon-pulling { + @include animation-name(refresh-spin-back); + @include animation-duration(200ms); + @include animation-timing-function(linear); + @include animation-fill-mode(none); + -webkit-transform: translate3d(0,0,0) rotate(0deg); + transform: translate3d(0,0,0) rotate(0deg); + } + .icon-refreshing, + .text-refreshing { + display: none; + } + .icon-refreshing { + @include animation-duration(1.5s); + } + + &.active { + .icon-pulling:not(.pulling-rotation-disabled) { + @include animation-name(refresh-spin); + -webkit-transform: translate3d(0,0,0) rotate(-180deg); + transform: translate3d(0,0,0) rotate(-180deg); + } + &.refreshing { + @include transition(-webkit-transform .2s); + @include transition(transform .2s); + -webkit-transform: scale(1,1); + transform: scale(1,1); + + .icon-pulling, + .text-pulling { + display: none; + } + .icon-refreshing, + .text-refreshing { + display: block; + } + &.refreshing-tail { + -webkit-transform: scale(0,0); + transform: scale(0,0); + } + } + } +} +.overflow-scroll > .scroll{ + &.overscroll{ + position:fixed; + right: 0; + left: 0; + } + -webkit-overflow-scrolling:touch; + width:100%; +} + +.overflow-scroll.padding > .scroll.overscroll{ + padding: 10px; +} +@-webkit-keyframes refresh-spin { + 0% { -webkit-transform: translate3d(0,0,0) rotate(0); } + 100% { -webkit-transform: translate3d(0,0,0) rotate(180deg); } +} + +@keyframes refresh-spin { + 0% { transform: translate3d(0,0,0) rotate(0); } + 100% { transform: translate3d(0,0,0) rotate(180deg); } +} + +@-webkit-keyframes refresh-spin-back { + 0% { -webkit-transform: translate3d(0,0,0) rotate(180deg); } + 100% { -webkit-transform: translate3d(0,0,0) rotate(0); } +} + +@keyframes refresh-spin-back { + 0% { transform: translate3d(0,0,0) rotate(180deg); } + 100% { transform: translate3d(0,0,0) rotate(0); } +} diff --git a/www/lib/ionic/scss/_reset.scss b/www/lib/ionic/scss/_reset.scss new file mode 100755 index 00000000..49e706aa --- /dev/null +++ b/www/lib/ionic/scss/_reset.scss @@ -0,0 +1,365 @@ + +/** + * Resets + * -------------------------------------------------- + * Adapted from normalize.css and some reset.css. We don't care even one + * bit about old IE, so we don't need any hacks for that in here. + * + * There are probably other things we could remove here, as well. + * + * normalize.css v2.1.2 | MIT License | git.io/normalize + + * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) + * http://cssreset.com + */ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, i, u, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, fieldset, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + vertical-align: baseline; + font: inherit; + font-size: 100%; +} + +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} + +/** + * Prevent modern browsers from displaying `audio` without controls. + * Remove excess height in iOS 5 devices. + */ + +audio:not([controls]) { + display: none; + height: 0; +} + +/** + * Hide the `template` element in IE, Safari, and Firefox < 22. + */ + +[hidden], +template { + display: none; +} + +script { + display: none !important; +} + +/* ========================================================================== + Base + ========================================================================== */ + +/** + * 1. Set default font family to sans-serif. + * 2. Prevent iOS text size adjust after orientation change, without disabling + * user zoom. + */ + +html { + @include user-select(none); + font-family: sans-serif; /* 1 */ + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/** + * Remove default margin. + */ + +body { + margin: 0; + line-height: 1; +} + + +/** + * Remove default outlines. + */ +a, +button, +:focus, +a:focus, +button:focus, +a:active, +a:hover { + outline: 0; +} + +/* * + * Remove tap highlight color + */ + +a { + -webkit-user-drag: none; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + -webkit-tap-highlight-color: transparent; + + &[href]:hover { + cursor: pointer; + } +} + +/* ========================================================================== + Typography + ========================================================================== */ + + +/** + * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. + */ + +b, +strong { + font-weight: bold; +} + +/** + * Address styling not present in Safari 5 and Chrome. + */ + +dfn { + font-style: italic; +} + +/** + * Address differences between Firefox and other browsers. + */ + +hr { + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; +} + + +/** + * Correct font family set oddly in Safari 5 and Chrome. + */ + +code, +kbd, +pre, +samp { + font-size: 1em; + font-family: monospace, serif; +} + +/** + * Improve readability of pre-formatted text in all browsers. + */ + +pre { + white-space: pre-wrap; +} + +/** + * Set consistent quote types. + */ + +q { + quotes: "\201C" "\201D" "\2018" "\2019"; +} + +/** + * Address inconsistent and variable font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` affecting `line-height` in all browsers. + */ + +sub, +sup { + position: relative; + vertical-align: baseline; + font-size: 75%; + line-height: 0; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +/** + * Define consistent border, margin, and padding. + */ + +fieldset { + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; + border: 1px solid #c0c0c0; +} + +/** + * 1. Correct `color` not being inherited in IE 8/9. + * 2. Remove padding so people aren't caught out if they zero out fieldsets. + */ + +legend { + padding: 0; /* 2 */ + border: 0; /* 1 */ +} + +/** + * 1. Correct font family not being inherited in all browsers. + * 2. Correct font size not being inherited in all browsers. + * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. + * 4. Remove any default :focus styles + * 5. Make sure webkit font smoothing is being inherited + * 6. Remove default gradient in Android Firefox / FirefoxOS + */ + +button, +input, +select, +textarea { + margin: 0; /* 3 */ + font-size: 100%; /* 2 */ + font-family: inherit; /* 1 */ + outline-offset: 0; /* 4 */ + outline-style: none; /* 4 */ + outline-width: 0; /* 4 */ + -webkit-font-smoothing: inherit; /* 5 */ + background-image: none; /* 6 */ +} + +/** + * Address Firefox 4+ setting `line-height` on `input` using `importnt` in + * the UA stylesheet. + */ + +button, +input { + line-height: normal; +} + +/** + * Address inconsistent `text-transform` inheritance for `button` and `select`. + * All other form control elements do not inherit `text-transform` values. + * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+. + * Correct `select` style inheritance in Firefox 4+ and Opera. + */ + +button, +select { + text-transform: none; +} + +/** + * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` + * and `video` controls. + * 2. Correct inability to style clickable `input` types in iOS. + * 3. Improve usability and consistency of cursor style between image-type + * `input` and others. + */ + +button, +html input[type="button"], /* 1 */ +input[type="reset"], +input[type="submit"] { + cursor: pointer; /* 3 */ + -webkit-appearance: button; /* 2 */ +} + +/** + * Re-set default cursor for disabled elements. + */ + +button[disabled], +html input[disabled] { + cursor: default; +} + +/** + * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. + * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome + * (include `-moz` to future-proof). + */ + +input[type="search"] { + -webkit-box-sizing: content-box; /* 2 */ + -moz-box-sizing: content-box; + box-sizing: content-box; + -webkit-appearance: textfield; /* 1 */ +} + +/** + * Remove inner padding and search cancel button in Safari 5 and Chrome + * on OS X. + */ + +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * Remove inner padding and border in Firefox 4+. + */ + +button::-moz-focus-inner, +input::-moz-focus-inner { + padding: 0; + border: 0; +} + +/** + * 1. Remove default vertical scrollbar in IE 8/9. + * 2. Improve readability and alignment in all browsers. + */ + +textarea { + overflow: auto; /* 1 */ + vertical-align: top; /* 2 */ +} + + +img { + -webkit-user-drag: none; +} + +/* ========================================================================== + Tables + ========================================================================== */ + +/** + * Remove most spacing between table cells. + */ + +table { + border-spacing: 0; + border-collapse: collapse; +} diff --git a/www/lib/ionic/scss/_scaffolding.scss b/www/lib/ionic/scss/_scaffolding.scss new file mode 100644 index 00000000..2dbff54f --- /dev/null +++ b/www/lib/ionic/scss/_scaffolding.scss @@ -0,0 +1,291 @@ + +/** + * Scaffolding + * -------------------------------------------------- + */ + +*, +*:before, +*:after { + @include box-sizing(border-box); +} + +html { + overflow: hidden; + -ms-touch-action: pan-y; + touch-action: pan-y; +} + +body, +.ionic-body { + @include touch-callout(none); + @include font-smoothing(antialiased); + @include text-size-adjust(none); + @include tap-highlight-transparent(); + @include user-select(none); + + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: hidden; + + margin: 0; + padding: 0; + + color: $base-color; + word-wrap: break-word; + font-size: $font-size-base; + font-family: -apple-system; + font-family: $font-family-base; + line-height: $line-height-computed; + text-rendering: optimizeLegibility; + -webkit-backface-visibility: hidden; + -webkit-user-drag: none; + -ms-content-zooming: none; +} + +body.grade-b, +body.grade-c { + // disable optimizeLegibility for low end devices + text-rendering: auto; +} + +.content { + // used for content areas not using the content directive + position: relative; +} + +.scroll-content { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: hidden; + + // Hide the top border if any + margin-top: -1px; + + // Prevents any distortion of lines + padding-top: 1px; + margin-bottom: -1px; + + width: auto; + height: auto; +} + +.menu .scroll-content.scroll-content-false{ + z-index: $z-index-scroll-content-false; +} + +.scroll-view { + position: relative; + display: block; + overflow: hidden; + + &.overflow-scroll { + position: relative; + } + + &.scroll-x { overflow-x: scroll; overflow-y: hidden; } + &.scroll-y { overflow-x: hidden; overflow-y: scroll; } + &.scroll-xy { overflow-x: scroll; overflow-y: scroll; } + + // Hide the top border if any + margin-top: -1px; +} + +/** + * Scroll is the scroll view component available for complex and custom + * scroll view functionality. + */ +.scroll { + @include user-select(none); + @include touch-callout(none); + @include text-size-adjust(none); + @include transform-origin(left, top); +} +/** + * Set ms-viewport to prevent MS "page squish" and allow fluid scrolling + * https://msdn.microsoft.com/en-us/library/ie/hh869615(v=vs.85).aspx + */ +@-ms-viewport { width: device-width; } + +// Scroll bar styles +.scroll-bar { + position: absolute; + z-index: $z-index-scroll-bar; +} +// hide the scroll-bar during animations +.ng-animate .scroll-bar { + visibility: hidden; +} +.scroll-bar-h { + right: 2px; + bottom: 3px; + left: 2px; + height: 3px; + + .scroll-bar-indicator { + height: 100%; + } +} + +.scroll-bar-v { + top: 2px; + right: 3px; + bottom: 2px; + width: 3px; + + .scroll-bar-indicator { + width: 100%; + } +} +.scroll-bar-indicator { + position: absolute; + border-radius: 4px; + background: rgba(0,0,0,0.3); + opacity: 1; + @include transition(opacity .3s linear); + + &.scroll-bar-fade-out { + opacity: 0; + } +} +.platform-android .scroll-bar-indicator { + // android doesn't have rounded ends on scrollbar + border-radius: 0; +} +.grade-b .scroll-bar-indicator, +.grade-c .scroll-bar-indicator { + // disable rgba background and border radius for low end devices + background: #aaa; + + &.scroll-bar-fade-out { + @include transition(none); + } +} + +ion-infinite-scroll { + height: 60px; + width: 100%; + display: block; + + @include display-flex(); + @include flex-direction(row); + @include justify-content(center); + @include align-items(center); + + .icon { + color: #666666; + font-size: 30px; + color: $scroll-refresh-icon-color; + } + &:not(.active){ + .spinner, + .icon:before{ + display:none; + } + } +} + +.overflow-scroll { + overflow-x: hidden; + overflow-y: scroll; + -webkit-overflow-scrolling: touch; + + // Make sure the scrollbar doesn't take up layout space on edge + -ms-overflow-style: -ms-autohiding-scrollbar; + + top: 0; + right: 0; + bottom: 0; + left: 0; + position: absolute; + + &.pane { + overflow-x: hidden; + overflow-y: scroll; + } + + .scroll { + position: static; + height: 100%; + -webkit-transform: translate3d(0, 0, 0); // fix iOS bug where relative children of scroller disapear while scrolling. see: http://stackoverflow.com/questions/9807620/ipad-safari-scrolling-causes-html-elements-to-disappear-and-reappear-with-a-dela + } +} + + +// Pad top/bottom of content so it doesn't hide behind .bar-title and .bar-tab. +// Note: For these to work, content must come after both bars in the markup +/* If you change these, change platform.scss as well */ +.has-header { + top: $bar-height; +} +// Force no header +.no-header { + top: 0; +} + +.has-subheader { + top: $bar-height + $bar-subheader-height; +} +.has-tabs-top { + top: $bar-height + $tabs-height; +} +.has-header.has-subheader.has-tabs-top { + top: $bar-height + $bar-subheader-height + $tabs-height; +} + +.has-footer { + bottom: $bar-footer-height; +} +.has-subfooter { + bottom: $bar-footer-height + $bar-subfooter-height; +} + +.has-tabs, +.bar-footer.has-tabs { + bottom: $tabs-height; + &.pane{ + bottom: $tabs-height; + height:auto; + } +} + +.bar-subfooter.has-tabs { + bottom: $tabs-height + $bar-footer-height; +} + +.has-footer.has-tabs { + bottom: $tabs-height + $bar-footer-height; +} + +// A full screen section with a solid background +.pane { + @include translate3d(0,0,0); + @include transition-duration(0); + z-index: $z-index-pane; +} +.view { + z-index: $z-index-view; +} +.pane, +.view { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + width: 100%; + height: 100%; + background-color: $base-background-color; + overflow: hidden; +} +.view-container { + position: absolute; + display: block; + width: 100%; + height: 100%; +} diff --git a/www/lib/ionic/scss/_select.scss b/www/lib/ionic/scss/_select.scss new file mode 100644 index 00000000..02efaff6 --- /dev/null +++ b/www/lib/ionic/scss/_select.scss @@ -0,0 +1,142 @@ + +/** + * Select + * -------------------------------------------------- + */ + +.item-select { + position: relative; + + select { + @include appearance(none); + position: absolute; + top: 0; + bottom: 0; + right: 0; + padding: 0 ($item-padding * 3) 0 $item-padding; + max-width: 65%; + + border: none; + background: $item-default-bg; + color: #333; + + // hack to hide default dropdown arrow in FF + text-indent: .01px; + text-overflow: ''; + + white-space: nowrap; + font-size: $font-size-base; + + cursor: pointer; + direction: rtl; // right align the select text + } + + select::-ms-expand { + // hide default dropdown arrow in IE + display: none; + } + + option { + direction: ltr; + } + + &:after { + position: absolute; + top: 50%; + right: $item-padding; + margin-top: -3px; + width: 0; + height: 0; + border-top: 5px solid; + border-right: 5px solid rgba(0, 0, 0, 0); + border-left: 5px solid rgba(0, 0, 0, 0); + color: #999; + content: ""; + pointer-events: none; + } + &.item-light { + select{ + background:$item-light-bg; + color:$item-light-text; + } + } + &.item-stable { + select{ + background:$item-stable-bg; + color:$item-stable-text; + } + &:after, .input-label{ + color:darken($item-stable-border,30%); + } + } + &.item-positive { + select{ + background:$item-positive-bg; + color:$item-positive-text; + } + &:after, .input-label{ + color:$item-positive-text; + } + } + &.item-calm { + select{ + background:$item-calm-bg; + color:$item-calm-text; + } + &:after, .input-label{ + color:$item-calm-text; + } + } + &.item-assertive { + select{ + background:$item-assertive-bg; + color:$item-assertive-text; + } + &:after, .input-label{ + color:$item-assertive-text; + } + } + &.item-balanced { + select{ + background:$item-balanced-bg; + color:$item-balanced-text; + } + &:after, .input-label{ + color:$item-balanced-text; + } + } + &.item-energized { + select{ + background:$item-energized-bg; + color:$item-energized-text; + } + &:after, .input-label{ + color:$item-energized-text; + } + } + &.item-royal { + select{ + background:$item-royal-bg; + color:$item-royal-text; + } + &:after, .input-label{ + color:$item-royal-text; + } + } + &.item-dark { + select{ + background:$item-dark-bg; + color:$item-dark-text; + } + &:after, .input-label{ + color:$item-dark-text; + } + } +} + +select { + &[multiple], + &[size] { + height: auto; + } +} diff --git a/www/lib/ionic/scss/_slide-box.scss b/www/lib/ionic/scss/_slide-box.scss new file mode 100644 index 00000000..f3da4d3e --- /dev/null +++ b/www/lib/ionic/scss/_slide-box.scss @@ -0,0 +1,71 @@ + +/** + * Slide Box + * -------------------------------------------------- + */ + +.slider { + position: relative; + visibility: hidden; + // Make sure items don't scroll over ever + overflow: hidden; +} + +.slider-slides { + position: relative; + height: 100%; +} + +.slider-slide { + position: relative; + display: block; + float: left; + width: 100%; + height: 100%; + vertical-align: top; +} + +.slider-slide-image { + > img { + width: 100%; + } +} + +.slider-pager { + position: absolute; + bottom: 20px; + z-index: $z-index-slider-pager; + width: 100%; + height: 15px; + text-align: center; + + .slider-pager-page { + display: inline-block; + margin: 0px 3px; + width: 15px; + color: #000; + text-decoration: none; + + opacity: 0.3; + + &.active { + @include transition(opacity 0.4s ease-in); + opacity: 1; + } + } +} + +//Disable animate service animations +.slider-slide, +.slider-pager-page { + &.ng-enter, + &.ng-leave, + &.ng-animate { + -webkit-transition: none !important; + transition: none !important; + } + &.ng-animate { + -webkit-animation: none 0s; + animation: none 0s; + } +} diff --git a/www/lib/ionic/scss/_slides.scss b/www/lib/ionic/scss/_slides.scss new file mode 100644 index 00000000..0e469a93 --- /dev/null +++ b/www/lib/ionic/scss/_slides.scss @@ -0,0 +1,529 @@ +/** + * Swiper 3.2.7 + * Most modern mobile touch slider and framework with hardware accelerated transitions + * + * http://www.idangero.us/swiper/ + * + * Copyright 2015, Vladimir Kharlampidi + * The iDangero.us + * http://www.idangero.us/ + * + * Licensed under MIT + * + * Released on: December 7, 2015 + */ +.swiper-container { + margin: 0 auto; + position: relative; + overflow: hidden; + /* Fix of Webkit flickering */ + z-index: 1; +} +.swiper-container-no-flexbox .swiper-slide { + float: left; +} +.swiper-container-vertical > .swiper-wrapper { + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; +} +.swiper-wrapper { + position: relative; + width: 100%; + height: 100%; + z-index: 1; + display: -webkit-box; + display: -moz-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + -webkit-transition-property: -webkit-transform; + -moz-transition-property: -moz-transform; + -o-transition-property: -o-transform; + -ms-transition-property: -ms-transform; + transition-property: transform; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +.swiper-container-android .swiper-slide, +.swiper-wrapper { + -webkit-transform: translate3d(0px, 0, 0); + -moz-transform: translate3d(0px, 0, 0); + -o-transform: translate(0px, 0px); + -ms-transform: translate3d(0px, 0, 0); + transform: translate3d(0px, 0, 0); +} +.swiper-container-multirow > .swiper-wrapper { + -webkit-box-lines: multiple; + -moz-box-lines: multiple; + -ms-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + flex-wrap: wrap; +} +.swiper-container-free-mode > .swiper-wrapper { + -webkit-transition-timing-function: ease-out; + -moz-transition-timing-function: ease-out; + -ms-transition-timing-function: ease-out; + -o-transition-timing-function: ease-out; + transition-timing-function: ease-out; + margin: 0 auto; +} +.swiper-slide { + display: block; + -webkit-flex-shrink: 0; + -ms-flex: 0 0 auto; + flex-shrink: 0; + width: 100%; + height: 100%; + position: relative; +} +/* Auto Height */ +.swiper-container-autoheight, +.swiper-container-autoheight .swiper-slide { + height: auto; +} +.swiper-container-autoheight .swiper-wrapper { + -webkit-box-align: start; + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; + -webkit-transition-property: -webkit-transform, height; + -moz-transition-property: -moz-transform; + -o-transition-property: -o-transform; + -ms-transition-property: -ms-transform; + transition-property: transform, height; +} +/* a11y */ +.swiper-container .swiper-notification { + position: absolute; + left: 0; + top: 0; + pointer-events: none; + opacity: 0; + z-index: -1000; +} +/* IE10 Windows Phone 8 Fixes */ +.swiper-wp8-horizontal { + -ms-touch-action: pan-y; + touch-action: pan-y; +} +.swiper-wp8-vertical { + -ms-touch-action: pan-x; + touch-action: pan-x; +} +/* Arrows */ +.swiper-button-prev, +.swiper-button-next { + position: absolute; + top: 50%; + width: 27px; + height: 44px; + margin-top: -22px; + z-index: 10; + cursor: pointer; + -moz-background-size: 27px 44px; + -webkit-background-size: 27px 44px; + background-size: 27px 44px; + background-position: center; + background-repeat: no-repeat; +} +.swiper-button-prev.swiper-button-disabled, +.swiper-button-next.swiper-button-disabled { + opacity: 0.35; + cursor: auto; + pointer-events: none; +} +.swiper-button-prev, +.swiper-container-rtl .swiper-button-next { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); + left: 10px; + right: auto; +} +.swiper-button-prev.swiper-button-black, +.swiper-container-rtl .swiper-button-next.swiper-button-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-prev.swiper-button-white, +.swiper-container-rtl .swiper-button-next.swiper-button-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-next, +.swiper-container-rtl .swiper-button-prev { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); + right: 10px; + left: auto; +} +.swiper-button-next.swiper-button-black, +.swiper-container-rtl .swiper-button-prev.swiper-button-black { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); +} +.swiper-button-next.swiper-button-white, +.swiper-container-rtl .swiper-button-prev.swiper-button-white { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); +} +/* Pagination Styles */ +.swiper-pagination { + position: absolute; + text-align: center; + -webkit-transition: 300ms; + -moz-transition: 300ms; + -o-transition: 300ms; + transition: 300ms; + -webkit-transform: translate3d(0, 0, 0); + -ms-transform: translate3d(0, 0, 0); + -o-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + z-index: 10; +} +.swiper-pagination.swiper-pagination-hidden { + opacity: 0; +} +.swiper-pagination-bullet { + width: 8px; + height: 8px; + display: inline-block; + border-radius: 100%; + background: #000; + opacity: 0.2; +} +button.swiper-pagination-bullet { + border: none; + margin: 0; + padding: 0; + box-shadow: none; + -moz-appearance: none; + -ms-appearance: none; + -webkit-appearance: none; + appearance: none; +} +.swiper-pagination-clickable .swiper-pagination-bullet { + cursor: pointer; +} +.swiper-pagination-white .swiper-pagination-bullet { + background: #fff; +} +.swiper-pagination-bullet-active { + opacity: 1; +} +.swiper-pagination-white .swiper-pagination-bullet-active { + background: #fff; +} +.swiper-pagination-black .swiper-pagination-bullet-active { + background: #000; +} +.swiper-container-vertical > .swiper-pagination { + right: 10px; + top: 50%; + -webkit-transform: translate3d(0px, -50%, 0); + -moz-transform: translate3d(0px, -50%, 0); + -o-transform: translate(0px, -50%); + -ms-transform: translate3d(0px, -50%, 0); + transform: translate3d(0px, -50%, 0); +} +.swiper-container-vertical > .swiper-pagination .swiper-pagination-bullet { + margin: 5px 0; + display: block; +} +.swiper-container-horizontal > .swiper-pagination { + bottom: 10px; + left: 0; + width: 100%; +} +.swiper-container-horizontal > .swiper-pagination .swiper-pagination-bullet { + margin: 0 5px; +} +/* 3D Container */ +.swiper-container-3d { + -webkit-perspective: 1200px; + -moz-perspective: 1200px; + -o-perspective: 1200px; + perspective: 1200px; +} +.swiper-container-3d .swiper-wrapper, +.swiper-container-3d .swiper-slide, +.swiper-container-3d .swiper-slide-shadow-left, +.swiper-container-3d .swiper-slide-shadow-right, +.swiper-container-3d .swiper-slide-shadow-top, +.swiper-container-3d .swiper-slide-shadow-bottom, +.swiper-container-3d .swiper-cube-shadow { + -webkit-transform-style: preserve-3d; + -moz-transform-style: preserve-3d; + -ms-transform-style: preserve-3d; + transform-style: preserve-3d; +} +.swiper-container-3d .swiper-slide-shadow-left, +.swiper-container-3d .swiper-slide-shadow-right, +.swiper-container-3d .swiper-slide-shadow-top, +.swiper-container-3d .swiper-slide-shadow-bottom { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + pointer-events: none; + z-index: 10; +} +.swiper-container-3d .swiper-slide-shadow-left { + background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +.swiper-container-3d .swiper-slide-shadow-right { + background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +.swiper-container-3d .swiper-slide-shadow-top { + background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +.swiper-container-3d .swiper-slide-shadow-bottom { + background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); + /* Safari 4+, Chrome */ + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Chrome 10+, Safari 5.1+, iOS 5+ */ + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 3.6-15 */ + background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Opera 11.10-12.00 */ + background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); + /* Firefox 16+, IE10, Opera 12.50+ */ +} +/* Coverflow */ +.swiper-container-coverflow .swiper-wrapper { + /* Windows 8 IE 10 fix */ + -ms-perspective: 1200px; +} +/* Fade */ +.swiper-container-fade.swiper-container-free-mode .swiper-slide { + -webkit-transition-timing-function: ease-out; + -moz-transition-timing-function: ease-out; + -ms-transition-timing-function: ease-out; + -o-transition-timing-function: ease-out; + transition-timing-function: ease-out; +} +.swiper-container-fade .swiper-slide { + pointer-events: none; +} +.swiper-container-fade .swiper-slide .swiper-slide { + pointer-events: none; +} +.swiper-container-fade .swiper-slide-active, +.swiper-container-fade .swiper-slide-active .swiper-slide-active { + pointer-events: auto; +} +/* Cube */ +.swiper-container-cube { + overflow: visible; +} +.swiper-container-cube .swiper-slide { + pointer-events: none; + visibility: hidden; + -webkit-transform-origin: 0 0; + -moz-transform-origin: 0 0; + -ms-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -ms-backface-visibility: hidden; + backface-visibility: hidden; + width: 100%; + height: 100%; + z-index: 1; +} +.swiper-container-cube.swiper-container-rtl .swiper-slide { + -webkit-transform-origin: 100% 0; + -moz-transform-origin: 100% 0; + -ms-transform-origin: 100% 0; + transform-origin: 100% 0; +} +.swiper-container-cube .swiper-slide-active, +.swiper-container-cube .swiper-slide-next, +.swiper-container-cube .swiper-slide-prev, +.swiper-container-cube .swiper-slide-next + .swiper-slide { + pointer-events: auto; + visibility: visible; +} +.swiper-container-cube .swiper-slide-shadow-top, +.swiper-container-cube .swiper-slide-shadow-bottom, +.swiper-container-cube .swiper-slide-shadow-left, +.swiper-container-cube .swiper-slide-shadow-right { + z-index: 0; + -webkit-backface-visibility: hidden; + -moz-backface-visibility: hidden; + -ms-backface-visibility: hidden; + backface-visibility: hidden; +} +.swiper-container-cube .swiper-cube-shadow { + position: absolute; + left: 0; + bottom: 0px; + width: 100%; + height: 100%; + background: #000; + opacity: 0.6; + -webkit-filter: blur(50px); + filter: blur(50px); + z-index: 0; +} +/* Scrollbar */ +.swiper-scrollbar { + border-radius: 10px; + position: relative; + -ms-touch-action: none; + background: rgba(0, 0, 0, 0.1); +} +.swiper-container-horizontal > .swiper-scrollbar { + position: absolute; + left: 1%; + bottom: 3px; + z-index: 50; + height: 5px; + width: 98%; +} +.swiper-container-vertical > .swiper-scrollbar { + position: absolute; + right: 3px; + top: 1%; + z-index: 50; + width: 5px; + height: 98%; +} +.swiper-scrollbar-drag { + height: 100%; + width: 100%; + position: relative; + background: rgba(0, 0, 0, 0.5); + border-radius: 10px; + left: 0; + top: 0; +} +.swiper-scrollbar-cursor-drag { + cursor: move; +} +/* Preloader */ +.swiper-lazy-preloader { + width: 42px; + height: 42px; + position: absolute; + left: 50%; + top: 50%; + margin-left: -21px; + margin-top: -21px; + z-index: 10; + -webkit-transform-origin: 50%; + -moz-transform-origin: 50%; + transform-origin: 50%; + -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite; + -moz-animation: swiper-preloader-spin 1s steps(12, end) infinite; + animation: swiper-preloader-spin 1s steps(12, end) infinite; +} +.swiper-lazy-preloader:after { + display: block; + content: ""; + width: 100%; + height: 100%; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + background-position: 50%; + -webkit-background-size: 100%; + background-size: 100%; + background-repeat: no-repeat; +} +.swiper-lazy-preloader-white:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); +} +@-webkit-keyframes swiper-preloader-spin { + 100% { + -webkit-transform: rotate(360deg); + } +} +@keyframes swiper-preloader-spin { + 100% { + transform: rotate(360deg); + } +} + + +ion-slides { + width: 100%; + height: 100%; + display: block; +} +.slide-zoom { + display: block; + width: 100%; + text-align: center; +} + +.swiper-container { + //position: absolute; + //left: 0; + //top: 0; + width: 100%; + height: 100%; + padding: 0; + //display: flex; + overflow: hidden; +} + +.swiper-wrapper { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + padding: 0; + //display: flex; +} + +.swiper-container { + //width: 100%; + //height: 100%; +} + +.swiper-slide { + width: 100%; + height: 100%; + + box-sizing: border-box; + + //text-align: center; + //font-size: 18px; + //background: #fff; + /* Center slide text vertically */ + //display: flex; + //justify-content: center; + //align-items: center; + + img { + width: auto; + height: auto; + max-width: 100%; + max-height: 100%; + } +} diff --git a/www/lib/ionic/scss/_spinner.scss b/www/lib/ionic/scss/_spinner.scss new file mode 100644 index 00000000..3cec42cf --- /dev/null +++ b/www/lib/ionic/scss/_spinner.scss @@ -0,0 +1,100 @@ +/** + * Spinners + * -------------------------------------------------- + */ + +.spinner { + svg { + width: $spinner-width; + height: $spinner-height; + } + + stroke: $spinner-default-stroke; + fill: $spinner-default-fill; + + &.spinner-light { + stroke: $spinner-light-stroke; + fill: $spinner-light-fill; + } + &.spinner-stable { + stroke: $spinner-stable-stroke; + fill: $spinner-stable-fill; + } + &.spinner-positive { + stroke: $spinner-positive-stroke; + fill: $spinner-positive-fill; + } + &.spinner-calm { + stroke: $spinner-calm-stroke; + fill: $spinner-calm-fill; + } + &.spinner-balanced { + stroke: $spinner-balanced-stroke; + fill: $spinner-balanced-fill; + } + &.spinner-assertive { + stroke: $spinner-assertive-stroke; + fill: $spinner-assertive-fill; + } + &.spinner-energized { + stroke: $spinner-energized-stroke; + fill: $spinner-energized-fill; + } + &.spinner-royal { + stroke: $spinner-royal-stroke; + fill: $spinner-royal-fill; + } + &.spinner-dark { + stroke: $spinner-dark-stroke; + fill: $spinner-dark-fill; + } +} + +.spinner-android { + stroke: #4b8bf4; +} + +.spinner-ios, +.spinner-ios-small { + stroke: #69717d; +} + +.spinner-spiral { + .stop1 { + stop-color: $spinner-light-fill; + stop-opacity: 0; + } + + &.spinner-light { + .stop1 { + stop-color: $spinner-default-fill; + } + .stop2 { + stop-color: $spinner-light-fill; + } + } + &.spinner-stable .stop2 { + stop-color: $spinner-stable-fill; + } + &.spinner-positive .stop2 { + stop-color: $spinner-positive-fill; + } + &.spinner-calm .stop2 { + stop-color: $spinner-calm-fill; + } + &.spinner-balanced .stop2 { + stop-color: $spinner-balanced-fill; + } + &.spinner-assertive .stop2 { + stop-color: $spinner-assertive-fill; + } + &.spinner-energized .stop2 { + stop-color: $spinner-energized-fill; + } + &.spinner-royal .stop2 { + stop-color: $spinner-royal-fill; + } + &.spinner-dark .stop2 { + stop-color: $spinner-dark-fill; + } +} diff --git a/www/lib/ionic/scss/_tabs.scss b/www/lib/ionic/scss/_tabs.scss new file mode 100644 index 00000000..aa7ed847 --- /dev/null +++ b/www/lib/ionic/scss/_tabs.scss @@ -0,0 +1,542 @@ +/** + * Tabs + * -------------------------------------------------- + * A navigation bar with any number of tab items supported. + */ + +.tabs { + @include display-flex(); + @include flex-direction(horizontal); + @include justify-content(center); + @include translate3d(0,0,0); + + @include tab-style($tabs-default-bg, $tabs-default-border, $tabs-default-text); + @include tab-badge-style($tabs-default-text, $tabs-default-bg); + + position: absolute; + bottom: 0; + + z-index: $z-index-tabs; + + width: 100%; + height: $tabs-height; + + border-style: solid; + border-top-width: 1px; + + background-size: 0; + line-height: $tabs-height; + + @media (min--moz-device-pixel-ratio: 1.5), + (-webkit-min-device-pixel-ratio: 1.5), + (min-device-pixel-ratio: 1.5), + (min-resolution: 144dpi), + (min-resolution: 1.5dppx) { + padding-top: 2px; + border-top: none !important; + border-bottom: none; + background-position: top; + background-size: 100% 1px; + background-repeat: no-repeat; + } + +} +/* Allow parent element of tabs to define color, or just the tab itself */ +.tabs-light > .tabs, +.tabs.tabs-light { + @include tab-style($tabs-light-bg, $tabs-light-border, $tabs-light-text); + @include tab-badge-style($tabs-light-text, $tabs-light-bg); +} +.tabs-stable > .tabs, +.tabs.tabs-stable { + @include tab-style($tabs-stable-bg, $tabs-stable-border, $tabs-stable-text); + @include tab-badge-style($tabs-stable-text, $tabs-stable-bg); +} +.tabs-positive > .tabs, +.tabs.tabs-positive { + @include tab-style($tabs-positive-bg, $tabs-positive-border, $tabs-positive-text); + @include tab-badge-style($tabs-positive-text, $tabs-positive-bg); +} +.tabs-calm > .tabs, +.tabs.tabs-calm { + @include tab-style($tabs-calm-bg, $tabs-calm-border, $tabs-calm-text); + @include tab-badge-style($tabs-calm-text, $tabs-calm-bg); +} +.tabs-assertive > .tabs, +.tabs.tabs-assertive { + @include tab-style($tabs-assertive-bg, $tabs-assertive-border, $tabs-assertive-text); + @include tab-badge-style($tabs-assertive-text, $tabs-assertive-bg); +} +.tabs-balanced > .tabs, +.tabs.tabs-balanced { + @include tab-style($tabs-balanced-bg, $tabs-balanced-border, $tabs-balanced-text); + @include tab-badge-style($tabs-balanced-text, $tabs-balanced-bg); +} +.tabs-energized > .tabs, +.tabs.tabs-energized { + @include tab-style($tabs-energized-bg, $tabs-energized-border, $tabs-energized-text); + @include tab-badge-style($tabs-energized-text, $tabs-energized-bg); +} +.tabs-royal > .tabs, +.tabs.tabs-royal { + @include tab-style($tabs-royal-bg, $tabs-royal-border, $tabs-royal-text); + @include tab-badge-style($tabs-royal-text, $tabs-royal-bg); +} +.tabs-dark > .tabs, +.tabs.tabs-dark { + @include tab-style($tabs-dark-bg, $tabs-dark-border, $tabs-dark-text); + @include tab-badge-style($tabs-dark-text, $tabs-dark-bg); +} + +@mixin tabs-striped($style, $color, $background) { + &.#{$style} { + .tabs{ + background-color: $background; + } + .tab-item { + color: rgba($color, $tabs-striped-off-opacity); + opacity: 1; + .badge{ + opacity:$tabs-striped-off-opacity; + } + &.tab-item-active, + &.active, + &.activated { + margin-top: -$tabs-striped-border-width; + color: $color; + border-style: solid; + border-width: $tabs-striped-border-width 0 0 0; + border-color: $color; + } + } + } + &.tabs-top{ + .tab-item { + &.tab-item-active, + &.active, + &.activated { + .badge { + top: 4%; + } + } + } + } +} + +@mixin tabs-background($style, $color, $border-color) { + .#{$style} { + .tabs, + &> .tabs{ + background-color: $color; + background-image: linear-gradient(0deg, $border-color, $border-color 50%, transparent 50%); + border-color: $border-color; + } + } +} + +@mixin tabs-striped-background($style, $color) { + &.#{$style} { + .tabs { + background-color: $color; + background-image:none; + } + } +} + +@mixin tabs-color($style, $color) { + .#{$style} { + .tab-item { + color: rgba($color, $tabs-off-opacity); + opacity: 1; + .badge{ + opacity:$tabs-off-opacity; + } + &.tab-item-active, + &.active, + &.activated { + color: $color; + border: 0 solid $color; + .badge{ + opacity: 1; + } + } + } + } +} + +@mixin tabs-striped-color($style, $color) { + &.#{$style} { + .tab-item { + color: rgba($color, $tabs-striped-off-opacity); + opacity: 1; + .badge{ + opacity:$tabs-striped-off-opacity; + } + &.tab-item-active, + &.active, + &.activated { + margin-top: -$tabs-striped-border-width; + color: $color; + border: 0 solid $color; + border-top-width: $tabs-striped-border-width; + .badge{ + top:$tabs-striped-border-width; + opacity: 1; + } + } + } + } +} + +.tabs-striped { + .tabs { + background-color: white; + background-image: none; + border: none; + border-bottom: 1px solid #ddd; + padding-top: $tabs-striped-border-width; + } + .tab-item { + // default android tab style + &.tab-item-active, + &.active, + &.activated { + margin-top: -$tabs-striped-border-width; + border-style: solid; + border-width: $tabs-striped-border-width 0 0 0; + border-color: $dark; + .badge{ + top:$tabs-striped-border-width; + opacity: 1; + } + } + } + @include tabs-striped('tabs-light', $dark, $light); + @include tabs-striped('tabs-stable', $dark, $stable); + @include tabs-striped('tabs-positive', $light, $positive); + @include tabs-striped('tabs-calm', $light, $calm); + @include tabs-striped('tabs-assertive', $light, $assertive); + @include tabs-striped('tabs-balanced', $light, $balanced); + @include tabs-striped('tabs-energized', $light, $energized); + @include tabs-striped('tabs-royal', $light, $royal); + @include tabs-striped('tabs-dark', $light, $dark); + + // doing this twice so striped tabs styles don't override specific bg and color vals + @include tabs-striped-background('tabs-background-light', $light); + @include tabs-striped-background('tabs-background-stable', $stable); + @include tabs-striped-background('tabs-background-positive', $positive); + @include tabs-striped-background('tabs-background-calm', $calm); + @include tabs-striped-background('tabs-background-assertive', $assertive); + @include tabs-striped-background('tabs-background-balanced', $balanced); + @include tabs-striped-background('tabs-background-energized',$energized); + @include tabs-striped-background('tabs-background-royal', $royal); + @include tabs-striped-background('tabs-background-dark', $dark); + + @include tabs-striped-color('tabs-color-light', $light); + @include tabs-striped-color('tabs-color-stable', $stable); + @include tabs-striped-color('tabs-color-positive', $positive); + @include tabs-striped-color('tabs-color-calm', $calm); + @include tabs-striped-color('tabs-color-assertive', $assertive); + @include tabs-striped-color('tabs-color-balanced', $balanced); + @include tabs-striped-color('tabs-color-energized',$energized); + @include tabs-striped-color('tabs-color-royal', $royal); + @include tabs-striped-color('tabs-color-dark', $dark); + +} + +@include tabs-background('tabs-background-light', $light, $bar-light-border); +@include tabs-background('tabs-background-stable', $stable, $bar-stable-border); +@include tabs-background('tabs-background-positive', $positive, $bar-positive-border); +@include tabs-background('tabs-background-calm', $calm, $bar-calm-border); +@include tabs-background('tabs-background-assertive', $assertive, $bar-assertive-border); +@include tabs-background('tabs-background-balanced', $balanced, $bar-balanced-border); +@include tabs-background('tabs-background-energized',$energized, $bar-energized-border); +@include tabs-background('tabs-background-royal', $royal, $bar-royal-border); +@include tabs-background('tabs-background-dark', $dark, $bar-dark-border); + +@include tabs-color('tabs-color-light', $light); +@include tabs-color('tabs-color-stable', $stable); +@include tabs-color('tabs-color-positive', $positive); +@include tabs-color('tabs-color-calm', $calm); +@include tabs-color('tabs-color-assertive', $assertive); +@include tabs-color('tabs-color-balanced', $balanced); +@include tabs-color('tabs-color-energized',$energized); +@include tabs-color('tabs-color-royal', $royal); +@include tabs-color('tabs-color-dark', $dark); + +@mixin tabs-standard-color($style, $color, $off-color:$dark) { + &.#{$style} { + .tab-item { + color: $off-color; + &.tab-item-active, + &.active, + &.activated { + color: $color; + } + } + + } + + &.tabs-striped.#{$style} { + .tab-item { + &.tab-item-active, + &.active, + &.activated { + border-color: $color; + color: $color; + } + } + + } + +} + +ion-tabs { + @include tabs-standard-color('tabs-color-active-light', $light, $dark); + @include tabs-standard-color('tabs-color-active-stable', $stable, $dark); + @include tabs-standard-color('tabs-color-active-positive', $positive, $dark); + @include tabs-standard-color('tabs-color-active-calm', $calm, $dark); + @include tabs-standard-color('tabs-color-active-assertive', $assertive, $dark); + @include tabs-standard-color('tabs-color-active-balanced', $balanced, $dark); + @include tabs-standard-color('tabs-color-active-energized',$energized, $dark); + @include tabs-standard-color('tabs-color-active-royal', $royal, $dark); + @include tabs-standard-color('tabs-color-active-dark', $dark, $light); +} + +.tabs-top { + &.tabs-striped { + padding-bottom:0; + .tab-item{ + background: transparent; + // animate the top bar, leave bottom for platform consistency + -webkit-transition: color .1s ease; + -moz-transition: color .1s ease; + -ms-transition: color .1s ease; + -o-transition: color .1s ease; + transition: color .1s ease; + &.tab-item-active, + &.active, + &.activated { + margin-top: $tabs-striped-border-width - 1px; + border-width: 0px 0px $tabs-striped-border-width 0px !important; + border-style: solid; + > .badge, > i{ + margin-top: -$tabs-striped-border-width + 1px; + } + } + .badge{ + -webkit-transition: color .2s ease; + -moz-transition: color .2s ease; + -ms-transition: color .2s ease; + -o-transition: color .2s ease; + transition: color .2s ease; + } + } + &:not(.tabs-icon-left):not(.tabs-icon-top){ + .tab-item{ + &.tab-item-active, + &.active, + &.activated { + .tab-title, i{ + display:block; + margin-top: -$tabs-striped-border-width + 1px; + } + } + } + } + &.tabs-icon-left{ + .tab-item{ + margin-top: 1px; + &.tab-item-active, + &.active, + &.activated { + .tab-title, i { + margin-top: -0.1em; + } + } + } + } + } +} + +/* Allow parent element to have tabs-top */ +/* If you change this, change platform.scss as well */ +.tabs-top > .tabs, +.tabs.tabs-top { + top: $bar-height; + padding-top: 0; + background-position: bottom; + border-top-width: 0; + border-bottom-width: 1px; + .tab-item { + &.tab-item-active, + &.active, + &.activated { + .badge { + top: 4%; + } + } + } +} +.tabs-top ~ .bar-header { + border-bottom-width: 0; +} + +.tab-item { + @include flex(1); + display: block; + overflow: hidden; + + max-width: $tab-item-max-width; + height: 100%; + + color: inherit; + text-align: center; + text-decoration: none; + text-overflow: ellipsis; + white-space: nowrap; + + font-weight: 400; + font-size: $tabs-text-font-size; + font-family: $font-family-sans-serif; + + opacity: 0.7; + + &:hover { + cursor: pointer; + } + &.tab-hidden{ + display:none; + } +} + +.tabs-item-hide > .tabs, +.tabs.tabs-item-hide { + display: none; +} + +.tabs-icon-top > .tabs .tab-item, +.tabs-icon-top.tabs .tab-item, +.tabs-icon-bottom > .tabs .tab-item, +.tabs-icon-bottom.tabs .tab-item { + font-size: $tabs-text-font-size-side-icon; + line-height: $tabs-text-font-size; +} + +.tab-item .icon { + display: block; + margin: 0 auto; + height: $tabs-icon-size; + font-size: $tabs-icon-size; +} + +.tabs-icon-left.tabs .tab-item, +.tabs-icon-left > .tabs .tab-item, +.tabs-icon-right.tabs .tab-item, +.tabs-icon-right > .tabs .tab-item { + font-size: $tabs-text-font-size-side-icon; + + .icon, .tab-title { + display: inline-block; + vertical-align: top; + margin-top: -.1em; + + &:before { + font-size: $tabs-icon-size - 8; + line-height: $tabs-height; + } + } +} + +.tabs-icon-left > .tabs .tab-item .icon, +.tabs-icon-left.tabs .tab-item .icon { + padding-right: 3px; +} + +.tabs-icon-right > .tabs .tab-item .icon, +.tabs-icon-right.tabs .tab-item .icon { + padding-left: 3px; +} + +.tabs-icon-only > .tabs .icon, +.tabs-icon-only.tabs .icon { + line-height: inherit; +} + + +.tab-item.has-badge { + position: relative; +} + +.tab-item .badge { + position: absolute; + top: 4%; + right: 33%; // fallback + right: calc(50% - 26px); + padding: $tabs-badge-padding; + height: auto; + font-size: $tabs-badge-font-size; + line-height: $tabs-badge-font-size + 4; +} + + +/* Navigational tab */ + +/* Active state for tab */ +.tab-item.tab-item-active, +.tab-item.active, +.tab-item.activated { + opacity: 1; + + &.tab-item-light { + color: $light; + } + &.tab-item-stable { + color: $stable; + } + &.tab-item-positive { + color: $positive; + } + &.tab-item-calm { + color: $calm; + } + &.tab-item-assertive { + color: $assertive; + } + &.tab-item-balanced { + color: $balanced; + } + &.tab-item-energized { + color: $energized; + } + &.tab-item-royal { + color: $royal; + } + &.tab-item-dark { + color: $dark; + } +} + +.item.tabs { + @include display-flex(); + padding: 0; + + .icon:before { + position: relative; + } +} + +.tab-item.disabled, +.tab-item[disabled] { + opacity: .4; + cursor: default; + pointer-events: none; +} + +.nav-bar-tabs-top.hide ~ .view-container .tabs-top .tabs{ + top: 0 +} +.pane[hide-nav-bar="true"] .has-tabs-top{ + top:$tabs-height +} + diff --git a/www/lib/ionic/scss/_toggle.scss b/www/lib/ionic/scss/_toggle.scss new file mode 100644 index 00000000..94bcabb4 --- /dev/null +++ b/www/lib/ionic/scss/_toggle.scss @@ -0,0 +1,198 @@ + +/** + * Toggle + * -------------------------------------------------- + */ + +.item-toggle { + pointer-events: none; +} + +.toggle { + // set the color defaults + @include toggle-style($toggle-on-default-border, $toggle-on-default-bg); + + position: relative; + display: inline-block; + pointer-events: auto; + margin: -$toggle-hit-area-expansion; + padding: $toggle-hit-area-expansion; + + &.dragging { + .handle { + background-color: $toggle-handle-dragging-bg-color !important; + } + } + +} + +.toggle { + &.toggle-light { + @include toggle-style($toggle-on-light-border, $toggle-on-light-bg); + } + &.toggle-stable { + @include toggle-style($toggle-on-stable-border, $toggle-on-stable-bg); + } + &.toggle-positive { + @include toggle-style($toggle-on-positive-border, $toggle-on-positive-bg); + } + &.toggle-calm { + @include toggle-style($toggle-on-calm-border, $toggle-on-calm-bg); + } + &.toggle-assertive { + @include toggle-style($toggle-on-assertive-border, $toggle-on-assertive-bg); + } + &.toggle-balanced { + @include toggle-style($toggle-on-balanced-border, $toggle-on-balanced-bg); + } + &.toggle-energized { + @include toggle-style($toggle-on-energized-border, $toggle-on-energized-bg); + } + &.toggle-royal { + @include toggle-style($toggle-on-royal-border, $toggle-on-royal-bg); + } + &.toggle-dark { + @include toggle-style($toggle-on-dark-border, $toggle-on-dark-bg); + } +} + +.toggle input { + // hide the actual input checkbox + display: none; +} + +/* the track appearance when the toggle is "off" */ +.toggle .track { + @include transition-timing-function(ease-in-out); + @include transition-duration($toggle-transition-duration); + @include transition-property((background-color, border)); + + display: inline-block; + box-sizing: border-box; + width: $toggle-width; + height: $toggle-height; + border: solid $toggle-border-width $toggle-off-border-color; + border-radius: $toggle-border-radius; + background-color: $toggle-off-bg-color; + content: ' '; + cursor: pointer; + pointer-events: none; +} + +/* Fix to avoid background color bleeding */ +/* (occurred on (at least) Android 4.2, Asus MeMO Pad HD7 ME173X) */ +.platform-android4_2 .toggle .track { + -webkit-background-clip: padding-box; +} + +/* the handle (circle) thats inside the toggle's track area */ +/* also the handle's appearance when it is "off" */ +.toggle .handle { + @include transition($toggle-transition-duration cubic-bezier(0, 1.1, 1, 1.1)); + @include transition-property((background-color, transform)); + position: absolute; + display: block; + width: $toggle-handle-width; + height: $toggle-handle-height; + border-radius: $toggle-handle-radius; + background-color: $toggle-handle-off-bg-color; + top: $toggle-border-width + $toggle-hit-area-expansion; + left: $toggle-border-width + $toggle-hit-area-expansion; + box-shadow: 0 2px 7px rgba(0,0,0,.35), 0 1px 1px rgba(0,0,0,.15); + + &:before { + // used to create a larger (but hidden) hit area to slide the handle + position: absolute; + top: -4px; + left: ( ($toggle-handle-width / 2) * -1) - 8; + padding: ($toggle-handle-height / 2) + 5 ($toggle-handle-width + 7); + content: " "; + } +} + +.toggle input:checked + .track .handle { + // the handle when the toggle is "on" + @include translate3d($toggle-width - $toggle-handle-width - ($toggle-border-width * 2), 0, 0); + background-color: $toggle-handle-on-bg-color; +} + +.item-toggle.active { + box-shadow: none; +} + +.item-toggle, +.item-toggle.item-complex .item-content { + // make sure list item content have enough padding on right to fit the toggle + padding-right: ($item-padding * 3) + $toggle-width; +} + +.item-toggle.item-complex { + padding-right: 0; +} + +.item-toggle .toggle { + // position the toggle to the right within a list item + position: absolute; + top: ($item-padding / 2) + 2; + right: $item-padding; + z-index: $z-index-item-toggle; +} + +.toggle input:disabled + .track { + opacity: .6; +} + +.toggle-small { + + .track { + border: 0; + width: 34px; + height: 15px; + background: #9e9e9e; + } + input:checked + .track { + background: rgba(0,150,137,.5); + } + .handle { + top: 2px; + left: 4px; + width: 21px; + height: 21px; + box-shadow: 0 2px 5px rgba(0,0,0,.25); + } + input:checked + .track .handle { + @include translate3d(16px, 0, 0); + background: rgb(0,150,137); + } + &.item-toggle .toggle { + top: 19px; + } + + .toggle-light { + @include toggle-small-style($toggle-on-light-bg); + } + .toggle-stable { + @include toggle-small-style($toggle-on-stable-bg); + } + .toggle-positive { + @include toggle-small-style($toggle-on-positive-bg); + } + .toggle-calm { + @include toggle-small-style($toggle-on-calm-bg); + } + .toggle-assertive { + @include toggle-small-style($toggle-on-assertive-bg); + } + .toggle-balanced { + @include toggle-small-style($toggle-on-balanced-bg); + } + .toggle-energized { + @include toggle-small-style($toggle-on-energized-bg); + } + .toggle-royal { + @include toggle-small-style($toggle-on-royal-bg); + } + .toggle-dark { + @include toggle-small-style($toggle-on-dark-bg); + } +} diff --git a/www/lib/ionic/scss/_transitions.scss b/www/lib/ionic/scss/_transitions.scss new file mode 100644 index 00000000..35881d8b --- /dev/null +++ b/www/lib/ionic/scss/_transitions.scss @@ -0,0 +1,188 @@ + +// iOS View Transitions +// ------------------------------- + +$ios-transition-duration: 500ms !default; +$ios-transition-timing-function: cubic-bezier(.36, .66, .04, 1) !default; +$ios-transition-container-bg-color: #000 !default; + + +[nav-view-transition="ios"] { + + [nav-view="entering"], + [nav-view="leaving"] { + @include transition-duration( $ios-transition-duration ); + @include transition-timing-function( $ios-transition-timing-function ); + -webkit-transition-property: opacity, -webkit-transform, box-shadow; + transition-property: opacity, transform, box-shadow; + } + + &[nav-view-direction="forward"], + &[nav-view-direction="back"] { + background-color: $ios-transition-container-bg-color; + } + + [nav-view="active"], + &[nav-view-direction="forward"] [nav-view="entering"], + &[nav-view-direction="back"] [nav-view="leaving"] { + z-index: $z-index-view-above; + } + + &[nav-view-direction="back"] [nav-view="entering"], + &[nav-view-direction="forward"] [nav-view="leaving"] { + z-index: $z-index-view-below; + } + +} + + + +// iOS Nav Bar Transitions +// ------------------------------- + +[nav-bar-transition="ios"] { + + .title, + .buttons, + .back-text { + @include transition-duration( $ios-transition-duration ); + @include transition-timing-function( $ios-transition-timing-function ); + -webkit-transition-property: opacity, -webkit-transform; + transition-property: opacity, transform; + } + + [nav-bar="active"], + [nav-bar="entering"] { + z-index: $z-index-bar-above; + + .bar { + background: transparent; + } + } + + [nav-bar="cached"] { + display: block; + + .header-item { + display: none; + } + } + +} + + + +// Android View Transitions +// ------------------------------- + +$android-transition-duration: 200ms !default; +$android-transition-timing-function: cubic-bezier(0.4, 0.6, 0.2, 1) !default; + + +[nav-view-transition="android"] { + + [nav-view="entering"], + [nav-view="leaving"] { + @include transition-duration( $android-transition-duration ); + @include transition-timing-function( $android-transition-timing-function ); + -webkit-transition-property: -webkit-transform; + transition-property: transform; + } + + [nav-view="active"], + &[nav-view-direction="forward"] [nav-view="entering"], + &[nav-view-direction="back"] [nav-view="leaving"] { + z-index: $z-index-view-above; + } + + &[nav-view-direction="back"] [nav-view="entering"], + &[nav-view-direction="forward"] [nav-view="leaving"] { + z-index: $z-index-view-below; + } + +} + + + +// Android Nav Bar Transitions +// ------------------------------- + +[nav-bar-transition="android"] { + + .title, + .buttons { + @include transition-duration( $android-transition-duration ); + @include transition-timing-function( $android-transition-timing-function ); + -webkit-transition-property: opacity; + transition-property: opacity; + } + + [nav-bar="active"], + [nav-bar="entering"] { + z-index: $z-index-bar-above; + + .bar { + background: transparent; + } + } + + [nav-bar="cached"] { + display: block; + + .header-item { + display: none; + } + } + +} + + + +// Nav Swipe +// ------------------------------- + +[nav-swipe="fast"] { + [nav-view], + .title, + .buttons, + .back-text { + @include transition-duration(50ms); + @include transition-timing-function(linear); + } +} + +[nav-swipe="slow"] { + [nav-view], + .title, + .buttons, + .back-text { + @include transition-duration(160ms); + @include transition-timing-function(linear); + } +} + + + +// Transition Settings +// ------------------------------- + +[nav-view="cached"], +[nav-bar="cached"] { + display: none; +} + +[nav-view="stage"] { + opacity: 0; + @include transition-duration( 0 ); +} + +[nav-bar="stage"] { + .title, + .buttons, + .back-text { + position: absolute; + opacity: 0; + @include transition-duration(0s); + } +} + diff --git a/www/lib/ionic/scss/_type.scss b/www/lib/ionic/scss/_type.scss new file mode 100644 index 00000000..7ad62fa4 --- /dev/null +++ b/www/lib/ionic/scss/_type.scss @@ -0,0 +1,166 @@ + +/** + * Typography + * -------------------------------------------------- + */ + + +// Body text +// ------------------------- + +p { + margin: 0 0 ($line-height-computed / 2); +} + + +// Emphasis & misc +// ------------------------- + +small { font-size: 85%; } +cite { font-style: normal; } + + +// Alignment +// ------------------------- + +.text-left { text-align: left; } +.text-right { text-align: right; } +.text-center { text-align: center; } + + +// Headings +// ------------------------- + +h1, h2, h3, h4, h5, h6, +.h1, .h2, .h3, .h4, .h5, .h6 { + color: $base-color; + font-weight: $headings-font-weight; + font-family: $headings-font-family; + line-height: $headings-line-height; + + small { + font-weight: normal; + line-height: 1; + } +} + +h1, .h1, +h2, .h2, +h3, .h3 { + margin-top: $line-height-computed; + margin-bottom: ($line-height-computed / 2); + + &:first-child { + margin-top: 0; + } + + + h1, + .h1, + + h2, + .h2, + + h3, + .h3 { + margin-top: ($line-height-computed / 2); + } +} + +h4, .h4, +h5, .h5, +h6, .h6 { + margin-top: ($line-height-computed / 2); + margin-bottom: ($line-height-computed / 2); +} + +h1, .h1 { font-size: floor($font-size-base * 2.60); } // ~36px +h2, .h2 { font-size: floor($font-size-base * 2.15); } // ~30px +h3, .h3 { font-size: ceil($font-size-base * 1.70); } // ~24px +h4, .h4 { font-size: ceil($font-size-base * 1.25); } // ~18px +h5, .h5 { font-size: $font-size-base; } +h6, .h6 { font-size: ceil($font-size-base * 0.85); } // ~12px + +h1 small, .h1 small { font-size: ceil($font-size-base * 1.70); } // ~24px +h2 small, .h2 small { font-size: ceil($font-size-base * 1.25); } // ~18px +h3 small, .h3 small, +h4 small, .h4 small { font-size: $font-size-base; } + + +// Description Lists +// ------------------------- + +dl { + margin-bottom: $line-height-computed; +} +dt, +dd { + line-height: $line-height-base; +} +dt { + font-weight: bold; +} + + +// Blockquotes +// ------------------------- + +blockquote { + margin: 0 0 $line-height-computed; + padding: ($line-height-computed / 2) $line-height-computed; + border-left: 5px solid gray; + + p { + font-weight: 300; + font-size: ($font-size-base * 1.25); + line-height: 1.25; + } + + p:last-child { + margin-bottom: 0; + } + + small { + display: block; + line-height: $line-height-base; + &:before { + content: '\2014 \00A0';// EM DASH, NBSP; + } + } +} + + +// Quotes +// ------------------------- + +q:before, +q:after, +blockquote:before, +blockquote:after { + content: ""; +} + + +// Addresses +// ------------------------- + +address { + display: block; + margin-bottom: $line-height-computed; + font-style: normal; + line-height: $line-height-base; +} + + +// Links +// ------------------------- +a { + color: $link-color; +} + +a.subdued { + padding-right: 10px; + color: #888; + text-decoration: none; + + &:hover { + text-decoration: none; + } + &:last-child { + padding-right: 0; + } +} diff --git a/www/lib/ionic/scss/_util.scss b/www/lib/ionic/scss/_util.scss new file mode 100644 index 00000000..8b9d4c71 --- /dev/null +++ b/www/lib/ionic/scss/_util.scss @@ -0,0 +1,296 @@ + +/** + * Utility Classes + * -------------------------------------------------- + */ + +.hide { + display: none; +} +.opacity-hide { + opacity: 0; +} +.grade-b .opacity-hide, +.grade-c .opacity-hide { + opacity: 1; + display: none; +} +.show { + display: block; +} +.opacity-show { + opacity: 1; +} +.invisible { + visibility: hidden; +} + +.keyboard-open .hide-on-keyboard-open { + display: none; +} + +.keyboard-open .tabs.hide-on-keyboard-open + .pane .has-tabs, +.keyboard-open .bar-footer.hide-on-keyboard-open + .pane .has-footer { + bottom: 0; +} + +.inline { + display: inline-block; +} + +.disable-pointer-events { + pointer-events: none; +} + +.enable-pointer-events { + pointer-events: auto; +} + +.disable-user-behavior { + // used to prevent the browser from doing its native behavior. this doesnt + // prevent the scrolling, but cancels the contextmenu, tap highlighting, etc + + @include user-select(none); + @include touch-callout(none); + @include tap-highlight-transparent(); + + -webkit-user-drag: none; + + -ms-touch-action: none; + -ms-content-zooming: none; +} + +// Fill the screen to block clicks (a better pointer-events: none) for the body +// to avoid full-page reflows and paints which can cause flickers +.click-block { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + opacity: 0; + z-index: $z-index-click-block; + @include translate3d(0, 0, 0); + overflow: hidden; +} +.click-block-hide { + @include translate3d(-9999px, 0, 0); +} + +.no-resize { + resize: none; +} + +.block { + display: block; + clear: both; + &:after { + display: block; + visibility: hidden; + clear: both; + height: 0; + content: "."; + } +} + +.full-image { + width: 100%; +} + +.clearfix { + *zoom: 1; + &:before, + &:after { + display: table; + content: ""; + // Fixes Opera/contenteditable bug: + // http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952 + line-height: 0; + } + &:after { + clear: both; + } +} + +/** + * Content Padding + * -------------------------------------------------- + */ + +.padding { + padding: $content-padding; +} + +.padding-top, +.padding-vertical { + padding-top: $content-padding; +} + +.padding-right, +.padding-horizontal { + padding-right: $content-padding; +} + +.padding-bottom, +.padding-vertical { + padding-bottom: $content-padding; +} + +.padding-left, +.padding-horizontal { + padding-left: $content-padding; +} + + +/** + * Scrollable iFrames + * -------------------------------------------------- + */ + +.iframe-wrapper { + position: fixed; + -webkit-overflow-scrolling: touch; + overflow: scroll; + + iframe { + height: 100%; + width: 100%; + } +} + + +/** + * Rounded + * -------------------------------------------------- + */ + +.rounded { + border-radius: $border-radius-base; +} + + +/** + * Utility Colors + * -------------------------------------------------- + * Utility colors are added to help set a naming convention. You'll + * notice we purposely do not use words like "red" or "blue", but + * instead have colors which represent an emotion or generic theme. + */ + +.light, a.light { + color: $light; +} +.light-bg { + background-color: $light; +} +.light-border { + border-color: $button-light-border; +} + +.stable, a.stable { + color: $stable; +} +.stable-bg { + background-color: $stable; +} +.stable-border { + border-color: $button-stable-border; +} + +.positive, a.positive { + color: $positive; +} +.positive-bg { + background-color: $positive; +} +.positive-border { + border-color: $button-positive-border; +} + +.calm, a.calm { + color: $calm; +} +.calm-bg { + background-color: $calm; +} +.calm-border { + border-color: $button-calm-border; +} + +.assertive, a.assertive { + color: $assertive; +} +.assertive-bg { + background-color: $assertive; +} +.assertive-border { + border-color: $button-assertive-border; +} + +.balanced, a.balanced { + color: $balanced; +} +.balanced-bg { + background-color: $balanced; +} +.balanced-border { + border-color: $button-balanced-border; +} + +.energized, a.energized { + color: $energized; +} +.energized-bg { + background-color: $energized; +} +.energized-border { + border-color: $button-energized-border; +} + +.royal, a.royal { + color: $royal; +} +.royal-bg { + background-color: $royal; +} +.royal-border { + border-color: $button-royal-border; +} + +.dark, a.dark { + color: $dark; +} +.dark-bg { + background-color: $dark; +} +.dark-border { + border-color: $button-dark-border; +} + +[collection-repeat] { + /* Position is set by transforms */ + left: 0 !important; + top: 0 !important; + position: absolute !important; + z-index: 1; +} +.collection-repeat-container { + position: relative; + z-index: 1; //make sure it's above the after-container +} +.collection-repeat-after-container { + z-index: 0; + display: block; + + /* when scrolling horizontally, make sure the after container doesn't take up 100% width */ + &.horizontal { + display: inline-block; + } +} + +// ng-show fix for windows phone +// https://www.hoessl.eu/2014/12/on-using-the-ionic-framework-for-windows-phone-8-1-apps/ +[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, +.x-ng-cloak, .ng-hide:not(.ng-hide-animate) { + display: none !important; +}
\ No newline at end of file diff --git a/www/lib/ionic/scss/_variables.scss b/www/lib/ionic/scss/_variables.scss new file mode 100644 index 00000000..f8c678b0 --- /dev/null +++ b/www/lib/ionic/scss/_variables.scss @@ -0,0 +1,764 @@ + +// Colors +// ------------------------------- + +$light: #fff !default; +$stable: #f8f8f8 !default; +$positive: #387ef5 !default; +$calm: #11c1f3 !default; +$balanced: #33cd5f !default; +$energized: #ffc900 !default; +$assertive: #ef473a !default; +$royal: #886aea !default; +$dark: #444 !default; + + +// Base +// ------------------------------- + +$font-family-sans-serif: '-apple-system', "Helvetica Neue", "Roboto", "Segoe UI", sans-serif !default; + +$font-family-light-sans-serif: '-apple-system', "HelveticaNeue-Light", "Roboto-Light", "Segoe UI-Light", sans-serif-light !default; +$font-family-serif: serif !default; +$font-family-monospace: monospace !default; + +$font-family-base: $font-family-sans-serif !default; +$font-size-base: 14px !default; +$font-size-large: 18px !default; +$font-size-small: 11px !default; + +$line-height-base: 1.428571429 !default; // 20/14 +$line-height-computed: floor($font-size-base * $line-height-base) !default; // ~20px +$line-height-large: 1.33 !default; +$line-height-small: 1.5 !default; + +$headings-font-family: $font-family-base !default; +$headings-font-weight: 500 !default; +$headings-line-height: 1.2 !default; + +$base-background-color: #fff !default; +$base-color: #000 !default; + +$link-color: $positive !default; +$link-hover-color: darken($link-color, 15%) !default; + +$content-padding: 10px !default; + +$padding-base-vertical: 6px !default; +$padding-base-horizontal: 12px !default; + +$padding-large-vertical: 10px !default; +$padding-large-horizontal: 16px !default; + +$padding-small-vertical: 5px !default; +$padding-small-horizontal: 10px !default; + +$border-radius-base: 4px !default; +$border-radius-large: 6px !default; +$border-radius-small: 3px !default; + + +// Content +// ------------------------------- + +$scroll-refresh-icon-color: #666666 !default; + + +// Buttons +// ------------------------------- + +$button-color: #222 !default; +$button-block-margin: 10px !default; +$button-clear-padding: 6px !default; +$button-border-radius: 4px !default; +$button-border-width: 1px !default; + +$button-font-size: 16px !default; +$button-height: 42px !default; +$button-padding: 12px !default; +$button-icon-size: 24px !default; + +$button-large-font-size: 20px !default; +$button-large-height: 54px !default; +$button-large-padding: 16px !default; +$button-large-icon-size: 32px !default; + +$button-small-font-size: 12px !default; +$button-small-height: 28px !default; +$button-small-padding: 4px !default; +$button-small-icon-size: 16px !default; + +$button-bar-button-font-size: 13px !default; +$button-bar-button-height: 32px !default; +$button-bar-button-padding: 8px !default; +$button-bar-button-icon-size: 20px !default; + +$button-default-border: transparent !default; +$button-default-active-border: null !default; + +$button-light-bg: $light !default; +$button-light-text: #444 !default; +$button-light-border: #ddd !default; +$button-light-active-bg: #fafafa !default; +$button-light-active-border: #ccc !default; + +$button-stable-bg: $stable !default; +$button-stable-text: #444 !default; +$button-stable-border: #b2b2b2 !default; +$button-stable-active-bg: #e5e5e5 !default; +$button-stable-active-border: #a2a2a2 !default; + +$button-positive-bg: $positive !default; +$button-positive-text: #fff !default; +$button-positive-border: darken($positive, 10%) !default; +$button-positive-active-bg: darken($positive, 10%) !default; +$button-positive-active-border: darken($positive, 10%) !default; + +$button-calm-bg: $calm !default; +$button-calm-text: #fff !default; +$button-calm-border: darken($calm, 10%) !default; +$button-calm-active-bg: darken($calm, 10%) !default; +$button-calm-active-border: darken($calm, 10%) !default; + +$button-assertive-bg: $assertive !default; +$button-assertive-text: #fff !default; +$button-assertive-border: darken($assertive, 10%) !default; +$button-assertive-active-bg: darken($assertive, 10%) !default; +$button-assertive-active-border: darken($assertive, 10%) !default; + +$button-balanced-bg: $balanced !default; +$button-balanced-text: #fff !default; +$button-balanced-border: darken($balanced, 10%) !default; +$button-balanced-active-bg: darken($balanced, 10%) !default; +$button-balanced-active-border: darken($balanced, 10%) !default; + +$button-energized-bg: $energized !default; +$button-energized-text: #fff !default; +$button-energized-border: darken($energized, 5%) !default; +$button-energized-active-bg: darken($energized, 5%) !default; +$button-energized-active-border: darken($energized, 5%) !default; + +$button-royal-bg: $royal !default; +$button-royal-text: #fff !default; +$button-royal-border: darken($royal, 8%) !default; +$button-royal-active-bg: darken($royal, 8%) !default; +$button-royal-active-border: darken($royal, 8%) !default; + +$button-dark-bg: $dark !default; +$button-dark-text: #fff !default; +$button-dark-border: #111 !default; +$button-dark-active-bg: #262626 !default; +$button-dark-active-border: #000 !default; + +$button-default-bg: $button-stable-bg !default; +$button-default-text: $button-stable-text !default; +$button-default-border: $button-stable-border !default; +$button-default-active-bg: $button-stable-active-bg !default; +$button-default-active-border: $button-stable-active-border !default; + + +// Bars +// ------------------------------- + +$bar-height: 44px !default; +$bar-title-font-size: 17px !default; +$bar-padding-portrait: 5px !default; +$bar-padding-landscape: 5px !default; +$bar-transparency: 1 !default; + +$bar-footer-height: $bar-height !default; +$bar-subheader-height: $bar-height !default; +$bar-subfooter-height: $bar-height !default; + +$bar-light-bg: rgba($button-light-bg, $bar-transparency) !default; +$bar-light-text: $button-light-text !default; +$bar-light-border: $button-light-border !default; +$bar-light-active-bg: $button-light-active-bg !default; +$bar-light-active-border: $button-light-active-border !default; + +$bar-stable-bg: rgba($button-stable-bg, $bar-transparency) !default; +$bar-stable-text: $button-stable-text !default; +$bar-stable-border: $button-stable-border !default; +$bar-stable-active-bg: $button-stable-active-bg !default; +$bar-stable-active-border: $button-stable-active-border !default; + +$bar-positive-bg: rgba($button-positive-bg, $bar-transparency) !default; +$bar-positive-text: $button-positive-text !default; +$bar-positive-border: $button-positive-border !default; +$bar-positive-active-bg: $button-positive-active-bg !default; +$bar-positive-active-border: $button-positive-active-border !default; + +$bar-calm-bg: rgba($button-calm-bg, $bar-transparency) !default; +$bar-calm-text: $button-calm-text !default; +$bar-calm-border: $button-calm-border !default; +$bar-calm-active-bg: $button-calm-active-bg !default; +$bar-calm-active-border: $button-calm-active-border !default; + +$bar-assertive-bg: rgba($button-assertive-bg, $bar-transparency) !default; +$bar-assertive-text: $button-assertive-text !default; +$bar-assertive-border: $button-assertive-border !default; +$bar-assertive-active-bg: $button-assertive-active-bg !default; +$bar-assertive-active-border: $button-assertive-active-border !default; + +$bar-balanced-bg: rgba($button-balanced-bg, $bar-transparency) !default; +$bar-balanced-text: $button-balanced-text !default; +$bar-balanced-border: $button-balanced-border !default; +$bar-balanced-active-bg: $button-balanced-active-bg !default; +$bar-balanced-active-border: $button-balanced-active-border !default; + +$bar-energized-bg: rgba($button-energized-bg, $bar-transparency) !default; +$bar-energized-text: $button-energized-text !default; +$bar-energized-border: $button-energized-border !default; +$bar-energized-active-bg: $button-energized-active-bg !default; +$bar-energized-active-border: $button-energized-active-border !default; + +$bar-royal-bg: rgba($button-royal-bg, $bar-transparency) !default; +$bar-royal-text: $button-royal-text !default; +$bar-royal-border: $button-royal-border !default; +$bar-royal-active-bg: $button-royal-active-bg !default; +$bar-royal-active-border: $button-royal-active-border !default; + +$bar-dark-bg: rgba($button-dark-bg, $bar-transparency) !default; +$bar-dark-text: $button-dark-text !default; +$bar-dark-border: $button-dark-border !default; +$bar-dark-active-bg: $button-dark-active-bg !default; +$bar-dark-active-border: $button-dark-active-border !default; + +$bar-default-bg: $bar-light-bg !default; +$bar-default-text: $bar-light-text !default; +$bar-default-border: $bar-light-border !default; +$bar-default-active-bg: $bar-light-active-bg !default; +$bar-default-active-border: $bar-light-active-border !default; + + +// Tabs +// ------------------------------- + +$tabs-height: 49px !default; +$tabs-text-font-size: 14px !default; +$tabs-text-font-size-side-icon: 10px !default; +$tabs-icon-size: 32px !default; +$tabs-badge-padding: 1px 6px !default; +$tabs-badge-font-size: 12px !default; + +$tabs-light-bg: $button-light-bg !default; +$tabs-light-border: $button-light-border !default; +$tabs-light-text: $button-light-text !default; + +$tabs-stable-bg: $button-stable-bg !default; +$tabs-stable-border: $button-stable-border !default; +$tabs-stable-text: $button-stable-text !default; + +$tabs-positive-bg: $button-positive-bg !default; +$tabs-positive-border: $button-positive-border !default; +$tabs-positive-text: $button-positive-text !default; + +$tabs-calm-bg: $button-calm-bg !default; +$tabs-calm-border: $button-calm-border !default; +$tabs-calm-text: $button-calm-text !default; + +$tabs-assertive-bg: $button-assertive-bg !default; +$tabs-assertive-border: $button-assertive-border !default; +$tabs-assertive-text: $button-assertive-text !default; + +$tabs-balanced-bg: $button-balanced-bg !default; +$tabs-balanced-border: $button-balanced-border !default; +$tabs-balanced-text: $button-balanced-text !default; + +$tabs-energized-bg: $button-energized-bg !default; +$tabs-energized-border: $button-energized-border !default; +$tabs-energized-text: $button-energized-text !default; + +$tabs-royal-bg: $button-royal-bg !default; +$tabs-royal-border: $button-royal-border !default; +$tabs-royal-text: $button-royal-text !default; + +$tabs-dark-bg: $button-dark-bg !default; +$tabs-dark-border: $button-dark-border !default; +$tabs-dark-text: $button-dark-text !default; + +$tabs-default-bg: $tabs-stable-bg !default; +$tabs-default-border: $tabs-stable-border !default; +$tabs-default-text: $tabs-stable-text !default; + +$tab-item-max-width: 150px !default; + +$tabs-off-opacity: 0.4 !default; +$tabs-striped-off-opacity: $tabs-off-opacity !default; +$tabs-striped-off-color: #000 !default; +$tabs-striped-border-width: 2px !default; + + +// Items +// ------------------------------- + +$item-font-size: 16px !default; +$item-border-width: 1px !default; +$item-padding: 16px !default; + +$item-button-font-size: 18px !default; +$item-button-line-height: 32px !default; +$item-icon-font-size: 32px !default; +$item-icon-fill-font-size: 28px !default; + +$item-icon-accessory-color: #ccc !default; +$item-icon-accessory-font-size: 16px !default; + +$item-avatar-width: 40px !default; +$item-avatar-height: 40px !default; +$item-avatar-border-radius: 50% !default; + +$item-thumbnail-width: 80px !default; +$item-thumbnail-height: 80px !default; +$item-thumbnail-margin: 10px !default; + +$item-divider-bg: #f5f5f5 !default; +$item-divider-color: #222 !default; +$item-divider-padding: 5px 15px !default; + +$item-light-bg: $button-light-bg !default; +$item-light-border: $button-light-border !default; +$item-light-text: $button-light-text !default; +$item-light-active-bg: $button-light-active-bg !default; +$item-light-active-border: $button-light-active-border !default; + +$item-stable-bg: $button-stable-bg !default; +$item-stable-border: $button-stable-border !default; +$item-stable-text: $button-stable-text !default; +$item-stable-active-bg: $button-stable-active-bg !default; +$item-stable-active-border: $button-stable-active-border !default; + +$item-positive-bg: $button-positive-bg !default; +$item-positive-border: $button-positive-border !default; +$item-positive-text: $button-positive-text !default; +$item-positive-active-bg: $button-positive-active-bg !default; +$item-positive-active-border: $button-positive-active-border !default; + +$item-calm-bg: $button-calm-bg !default; +$item-calm-border: $button-calm-border !default; +$item-calm-text: $button-calm-text !default; +$item-calm-active-bg: $button-calm-active-bg !default; +$item-calm-active-border: $button-calm-active-border !default; + +$item-assertive-bg: $button-assertive-bg !default; +$item-assertive-border: $button-assertive-border !default; +$item-assertive-text: $button-assertive-text !default; +$item-assertive-active-bg: $button-assertive-active-bg !default; +$item-assertive-active-border: $button-assertive-active-border !default; + +$item-balanced-bg: $button-balanced-bg !default; +$item-balanced-border: $button-balanced-border !default; +$item-balanced-text: $button-balanced-text !default; +$item-balanced-active-bg: $button-balanced-active-bg !default; +$item-balanced-active-border: $button-balanced-active-border !default; + +$item-energized-bg: $button-energized-bg !default; +$item-energized-border: $button-energized-border !default; +$item-energized-text: $button-energized-text !default; +$item-energized-active-bg: $button-energized-active-bg !default; +$item-energized-active-border: $button-energized-active-border !default; + +$item-royal-bg: $button-royal-bg !default; +$item-royal-border: $button-royal-border !default; +$item-royal-text: $button-royal-text !default; +$item-royal-active-bg: $button-royal-active-bg !default; +$item-royal-active-border: $button-royal-active-border !default; + +$item-dark-bg: $button-dark-bg !default; +$item-dark-border: $button-dark-border !default; +$item-dark-text: $button-dark-text !default; +$item-dark-active-bg: $button-dark-active-bg !default; +$item-dark-active-border: $button-dark-active-border !default; + +$item-default-bg: $item-light-bg !default; +$item-default-border: $item-light-border !default; +$item-default-text: $item-light-text !default; +$item-default-active-bg: #D9D9D9 !default; +$item-default-active-border: $item-light-active-border !default; + + +// Item Editing +// ------------------------------- + +$item-edit-transition-duration: 250ms !default; +$item-edit-transition-function: ease-in-out !default; + +$item-remove-transition-duration: 300ms !default; +$item-remove-transition-function: ease-in !default; +$item-remove-descendents-transition-function: cubic-bezier(.25,.81,.24,1) !default; + +$item-left-edit-left: 8px !default; // item's left side edit's "left" property + +$item-right-edit-open-width: 50px !default; +$item-left-edit-open-width: 50px !default; + +$item-delete-icon-size: 24px !default; +$item-delete-icon-color: $assertive !default; + +$item-reorder-icon-size: 32px !default; +$item-reorder-icon-color: $dark !default; + + +// Lists +// ------------------------------- + +$list-header-bg: transparent !default; +$list-header-color: #222 !default; +$list-header-padding: 5px 15px !default; +$list-header-margin-top: 20px !default; + + +// Cards +// ------------------------------- + +$card-header-bg: #F5F5F5 !default; +$card-body-bg: #fff !default; +$card-footer-bg: #F5F5F5 !default; + +$card-padding: 10px !default; +$card-border-width: 1px !default; + +$card-border-color: #ccc !default; +$card-border-radius: 2px !default; +$card-box-shadow: 0 1px 3px rgba(0, 0, 0, .3) !default; + + +// Forms +// ------------------------------- + +$input-height-base: ($line-height-computed + ($padding-base-vertical * 2) + 2) !default; +$input-height-large: (floor($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default; +$input-height-small: (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default; + +$input-bg: $light !default; +$input-bg-disabled: $stable !default; + +$input-color: #111 !default; +$input-border: $item-default-border !default; +$input-border-width: $item-border-width !default; +$input-label-color: $dark !default; +$input-color-placeholder: lighten($dark, 40%) !default; + + +// Progress +// ------------------------------- + +$progress-width: 100% !default; +$progress-margin: 15px auto !default; + + +// Toggle +// ------------------------------- + +$toggle-width: 51px !default; +$toggle-height: 31px !default; +$toggle-border-width: 2px !default; +$toggle-border-radius: 20px !default; + +$toggle-handle-width: $toggle-height - ($toggle-border-width * 2) !default; +$toggle-handle-height: $toggle-handle-width !default; +$toggle-handle-radius: $toggle-handle-width !default; +$toggle-handle-dragging-bg-color: darken(#fff, 5%) !default; + +$toggle-off-bg-color: #fff !default; +$toggle-off-border-color: #e6e6e6 !default; + +$toggle-on-light-bg: $button-light-border !default; +$toggle-on-light-border: $toggle-on-light-bg !default; +$toggle-on-stable-bg: $button-stable-border !default; +$toggle-on-stable-border: $toggle-on-stable-bg !default; +$toggle-on-positive-bg: $positive !default; +$toggle-on-positive-border: $toggle-on-positive-bg !default; +$toggle-on-calm-bg: $calm !default; +$toggle-on-calm-border: $toggle-on-calm-bg !default; +$toggle-on-assertive-bg: $assertive !default; +$toggle-on-assertive-border: $toggle-on-assertive-bg !default; +$toggle-on-balanced-bg: $balanced !default; +$toggle-on-balanced-border: $toggle-on-balanced-bg !default; +$toggle-on-energized-bg: $energized !default; +$toggle-on-energized-border: $toggle-on-energized-bg !default; +$toggle-on-royal-bg: $royal !default; +$toggle-on-royal-border: $toggle-on-royal-bg !default; +$toggle-on-dark-bg: $dark !default; +$toggle-on-dark-border: $toggle-on-dark-bg !default; +$toggle-on-default-bg: #4cd964 !default; +$toggle-on-default-border: $toggle-on-default-bg !default; + +$toggle-handle-off-bg-color: $light !default; +$toggle-handle-on-bg-color: $toggle-handle-off-bg-color !default; + +$toggle-transition-duration: .3s !default; + +$toggle-hit-area-expansion: 5px; + + +// Checkbox +// ------------------------------- + +$checkbox-width: 28px !default; +$checkbox-height: 28px !default; +$checkbox-border-radius: $checkbox-width !default; +$checkbox-border-width: 1px !default; + +$checkbox-off-bg-color: #fff !default; +$checkbox-off-border-light: $button-light-border !default; +$checkbox-on-bg-light: $button-light-border !default; +$checkbox-off-border-stable: $button-stable-border !default; +$checkbox-on-bg-stable: $button-stable-border !default; +$checkbox-off-border-positive: $positive !default; +$checkbox-on-bg-positive: $positive !default; +$checkbox-off-border-calm: $calm !default; +$checkbox-on-bg-calm: $calm !default; +$checkbox-off-border-assertive: $assertive !default; +$checkbox-on-bg-assertive: $assertive !default; +$checkbox-off-border-balanced: $balanced !default; +$checkbox-on-bg-balanced: $balanced !default; +$checkbox-off-border-energized: $energized !default; +$checkbox-on-bg-energized: $energized !default; +$checkbox-off-border-royal: $royal !default; +$checkbox-on-bg-royal: $royal !default; +$checkbox-off-border-dark: $dark !default; +$checkbox-on-bg-dark: $dark !default; +$checkbox-off-border-default: $button-light-border !default; +$checkbox-on-bg-default: $positive !default; +$checkbox-on-border-default: $positive !default; + +$checkbox-check-width: 1px !default; +$checkbox-check-color: #fff !default; + + +// Range +// ------------------------------- + +$range-track-height: 2px !default; +$range-slider-width: 28px !default; +$range-slider-height: 28px !default; +$range-slider-border-radius: 50% !default; +$range-icon-size: 24px !default; +$range-slider-box-shadow: 0 0 2px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,0.2) !default; + +$range-light-track-bg: $button-light-border !default; +$range-stable-track-bg: $button-stable-border !default; +$range-positive-track-bg: $button-positive-bg !default; +$range-calm-track-bg: $button-calm-bg !default; +$range-balanced-track-bg: $button-balanced-bg !default; +$range-assertive-track-bg: $button-assertive-bg !default; +$range-energized-track-bg: $button-energized-bg !default; +$range-royal-track-bg: $button-royal-bg !default; +$range-dark-track-bg: $button-dark-bg !default; +$range-default-track-bg: #ccc !default; + + +// Menus +// ------------------------------- + +$menu-bg: #fff !default; +$menu-width: 275px !default; +$menu-animation-speed: 200ms !default; + +$menu-side-shadow: -1px 0px 2px rgba(0, 0, 0, 0.2), 1px 0px 2px rgba(0,0,0,0.2) !default; + + +// Modals +// ------------------------------- + +$modal-bg-color: #fff !default; +$modal-backdrop-bg-active: #000 !default; +$modal-backdrop-bg-inactive: rgba(0,0,0,0) !default; + +$modal-inset-mode-break-point: 680px !default; // @media min-width +$modal-inset-mode-top: 20% !default; +$modal-inset-mode-right: 20% !default; +$modal-inset-mode-bottom: 20% !default; +$modal-inset-mode-left: 20% !default; +$modal-inset-mode-min-height: 240px !default; + + +// Popovers +// ------------------------------- + +$popover-bg-color: $light !default; +$popover-backdrop-bg-active: rgba(0,0,0,0.1) !default; +$popover-backdrop-bg-inactive: rgba(0,0,0,0) !default; +$popover-width: 220px !default; +$popover-height: 280px !default; +$popover-large-break-point: 680px !default; +$popover-large-width: 360px !default; + +$popover-box-shadow: 0 1px 3px rgba(0,0,0,0.4) !default; +$popover-border-radius: 2px !default; + +$popover-box-shadow-ios: 0 0 40px rgba(0,0,0,0.08) !default; +$popover-border-radius-ios: 10px !default; + +$popover-bg-color-android: #fafafa !default; +$popover-box-shadow-android: 0 2px 6px rgba(0,0,0,0.35) !default; + + +// Grids +// ------------------------------- + +$grid-padding-width: 10px !default; +$grid-responsive-sm-break: 567px !default; // smaller than landscape phone +$grid-responsive-md-break: 767px !default; // smaller than portrait tablet +$grid-responsive-lg-break: 1023px !default; // smaller than landscape tablet + + +// Action Sheets +// ------------------------------- + +$sheet-margin: 8px !default; +$sheet-border-radius: 4px !default; + +$sheet-options-bg-color: #f1f2f3 !default; +$sheet-options-bg-active-color: #e4e5e7 !default; +$sheet-options-text-color: #007aff !default; +$sheet-options-border-color: #d1d3d6 !default; + + +// Popups +// ------------------------------- + +$popup-width: 250px !default; +$popup-enter-animation: superScaleIn !default; +$popup-enter-animation-duration: 0.2s !default; +$popup-leave-animation-duration: 0.1s !default; + +$popup-border-radius: 0px !default; +$popup-background-color: rgba(255,255,255,0.9) !default; + +$popup-button-border-radius: 2px !default; +$popup-button-line-height: 20px !default; +$popup-button-min-height: 45px !default; + + +// Loading +// ------------------------------- + +$loading-text-color: #fff !default; +$loading-bg-color: rgba(0,0,0,0.7) !default; +$loading-padding: 20px !default; +$loading-border-radius: 5px !default; +$loading-font-size: 15px !default; + +$loading-backdrop-fadein-duration:0.1s !default; +$loading-backdrop-bg-color: rgba(0,0,0,0.4) !default; + + +// Badges +// ------------------------------- + +$badge-font-size: 14px !default; +$badge-line-height: 16px !default; +$badge-font-weight: bold !default; +$badge-border-radius: 10px !default; + +$badge-light-bg: $button-light-bg !default; +$badge-light-text: $button-light-text !default; + +$badge-stable-bg: $button-stable-bg !default; +$badge-stable-text: $button-stable-text !default; + +$badge-positive-bg: $button-positive-bg !default; +$badge-positive-text: $button-positive-text !default; + +$badge-calm-bg: $button-calm-bg !default; +$badge-calm-text: $button-calm-text !default; + +$badge-balanced-bg: $button-balanced-bg !default; +$badge-balanced-text: $button-balanced-text !default; + +$badge-assertive-bg: $button-assertive-bg !default; +$badge-assertive-text: $button-assertive-text !default; + +$badge-energized-bg: $button-energized-bg !default; +$badge-energized-text: $button-energized-text !default; + +$badge-royal-bg: $button-royal-bg !default; +$badge-royal-text: $button-royal-text !default; + +$badge-dark-bg: $button-dark-bg !default; +$badge-dark-text: $button-dark-text !default; + +$badge-default-bg: transparent !default; +$badge-default-text: #AAAAAA !default; + + +// Spinners +// ------------------------------- + +$spinner-width: 28px !default; +$spinner-height: 28px !default; + +$spinner-light-stroke: $light !default; +$spinner-light-fill: $light !default; + +$spinner-stable-stroke: $stable !default; +$spinner-stable-fill: $stable !default; + +$spinner-positive-stroke: $positive !default; +$spinner-positive-fill: $positive !default; + +$spinner-calm-stroke: $calm !default; +$spinner-calm-fill: $calm !default; + +$spinner-balanced-stroke: $balanced !default; +$spinner-balanced-fill: $balanced !default; + +$spinner-assertive-stroke: $assertive !default; +$spinner-assertive-fill: $assertive !default; + +$spinner-energized-stroke: $energized !default; +$spinner-energized-fill: $energized !default; + +$spinner-royal-stroke: $royal !default; +$spinner-royal-fill: $royal !default; + +$spinner-dark-stroke: $dark !default; +$spinner-dark-fill: $dark !default; + +$spinner-default-stroke: $dark !default; +$spinner-default-fill: $dark !default; + + +// Z-Indexes +// ------------------------------- + +$z-index-bar-title: 0 !default; +$z-index-item-drag: 0 !default; +$z-index-item-edit: 0 !default; +$z-index-menu: 0 !default; +$z-index-badge: 1 !default; +$z-index-bar-button: 1 !default; +$z-index-item-options: 1 !default; +$z-index-pane: 1 !default; +$z-index-slider-pager: 1 !default; +$z-index-view: 1 !default; +$z-index-view-below: 2 !default; +$z-index-item: 2 !default; +$z-index-item-checkbox: 3 !default; +$z-index-item-radio: 3 !default; +$z-index-item-reorder: 3 !default; +$z-index-item-toggle: 3 !default; +$z-index-view-above: 3 !default; +$z-index-tabs: 5 !default; +$z-index-item-reordering: 9 !default; +$z-index-bar: 9 !default; +$z-index-bar-above: 10 !default; +$z-index-menu-scroll-content: 10 !default; +$z-index-modal: 10 !default; +$z-index-popover: 10 !default; +$z-index-action-sheet: 11 !default; +$z-index-backdrop: 11 !default; +$z-index-menu-bar-header: 11 !default; +$z-index-scroll-content-false: 11 !default; +$z-index-popup: 12 !default; +$z-index-loading: 13 !default; +$z-index-scroll-bar: 9999 !default; +$z-index-click-block: 99999 !default; + + +// Platform +// ------------------------------- + +$ios-statusbar-height: 20px !default; diff --git a/www/lib/ionic/scss/ionic.scss b/www/lib/ionic/scss/ionic.scss new file mode 100644 index 00000000..e3465b71 --- /dev/null +++ b/www/lib/ionic/scss/ionic.scss @@ -0,0 +1,54 @@ +@charset "UTF-8"; + +@import + // Ionicons + "ionicons/ionicons.scss", + + // Variables + "mixins", + "variables", + + // Base + "reset", + "scaffolding", + "type", + + // Components + "action-sheet", + "backdrop", + "bar", + "tabs", + "menu", + "modal", + "popover", + "popup", + "loading", + "items", + "list", + "badge", + "slide-box", + "slides", + "refresher", + "spinner", + + // Forms + "form", + "checkbox", + "toggle", + "radio", + "range", + "select", + "progress", + + // Buttons + "button", + "button-bar", + + // Util + "grid", + "util", + "platform", + + // Animations + "animations", + "transitions"; diff --git a/www/lib/ionic/scss/ionicons/_ionicons-font.scss b/www/lib/ionic/scss/ionicons/_ionicons-font.scss new file mode 100644 index 00000000..3801597a --- /dev/null +++ b/www/lib/ionic/scss/ionicons/_ionicons-font.scss @@ -0,0 +1,28 @@ +// Ionicons Font Path +// -------------------------- + +@font-face { + font-family: $ionicons-font-family; + src:url("#{$ionicons-font-path}/ionicons.eot?v=#{$ionicons-version}"); + src:url("#{$ionicons-font-path}/ionicons.eot?v=#{$ionicons-version}#iefix") format("embedded-opentype"), + url("#{$ionicons-font-path}/ionicons.ttf?v=#{$ionicons-version}") format("truetype"), + url("#{$ionicons-font-path}/ionicons.woff?v=#{$ionicons-version}") format("woff"), + url("#{$ionicons-font-path}/ionicons.woff") format("woff"), /* for WP8 */ + url("#{$ionicons-font-path}/ionicons.svg?v=#{$ionicons-version}#Ionicons") format("svg"); + font-weight: normal; + font-style: normal; +} + +.ion { + display: inline-block; + font-family: $ionicons-font-family; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + text-rendering: auto; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} diff --git a/www/lib/ionic/scss/ionicons/_ionicons-icons.scss b/www/lib/ionic/scss/ionicons/_ionicons-icons.scss new file mode 100644 index 00000000..d08d4f0e --- /dev/null +++ b/www/lib/ionic/scss/ionicons/_ionicons-icons.scss @@ -0,0 +1,1473 @@ +// Ionicons Icons +// -------------------------- + +.ionicons, +.#{$ionicons-prefix}alert:before, +.#{$ionicons-prefix}alert-circled:before, +.#{$ionicons-prefix}android-add:before, +.#{$ionicons-prefix}android-add-circle:before, +.#{$ionicons-prefix}android-alarm-clock:before, +.#{$ionicons-prefix}android-alert:before, +.#{$ionicons-prefix}android-apps:before, +.#{$ionicons-prefix}android-archive:before, +.#{$ionicons-prefix}android-arrow-back:before, +.#{$ionicons-prefix}android-arrow-down:before, +.#{$ionicons-prefix}android-arrow-dropdown:before, +.#{$ionicons-prefix}android-arrow-dropdown-circle:before, +.#{$ionicons-prefix}android-arrow-dropleft:before, +.#{$ionicons-prefix}android-arrow-dropleft-circle:before, +.#{$ionicons-prefix}android-arrow-dropright:before, +.#{$ionicons-prefix}android-arrow-dropright-circle:before, +.#{$ionicons-prefix}android-arrow-dropup:before, +.#{$ionicons-prefix}android-arrow-dropup-circle:before, +.#{$ionicons-prefix}android-arrow-forward:before, +.#{$ionicons-prefix}android-arrow-up:before, +.#{$ionicons-prefix}android-attach:before, +.#{$ionicons-prefix}android-bar:before, +.#{$ionicons-prefix}android-bicycle:before, +.#{$ionicons-prefix}android-boat:before, +.#{$ionicons-prefix}android-bookmark:before, +.#{$ionicons-prefix}android-bulb:before, +.#{$ionicons-prefix}android-bus:before, +.#{$ionicons-prefix}android-calendar:before, +.#{$ionicons-prefix}android-call:before, +.#{$ionicons-prefix}android-camera:before, +.#{$ionicons-prefix}android-cancel:before, +.#{$ionicons-prefix}android-car:before, +.#{$ionicons-prefix}android-cart:before, +.#{$ionicons-prefix}android-chat:before, +.#{$ionicons-prefix}android-checkbox:before, +.#{$ionicons-prefix}android-checkbox-blank:before, +.#{$ionicons-prefix}android-checkbox-outline:before, +.#{$ionicons-prefix}android-checkbox-outline-blank:before, +.#{$ionicons-prefix}android-checkmark-circle:before, +.#{$ionicons-prefix}android-clipboard:before, +.#{$ionicons-prefix}android-close:before, +.#{$ionicons-prefix}android-cloud:before, +.#{$ionicons-prefix}android-cloud-circle:before, +.#{$ionicons-prefix}android-cloud-done:before, +.#{$ionicons-prefix}android-cloud-outline:before, +.#{$ionicons-prefix}android-color-palette:before, +.#{$ionicons-prefix}android-compass:before, +.#{$ionicons-prefix}android-contact:before, +.#{$ionicons-prefix}android-contacts:before, +.#{$ionicons-prefix}android-contract:before, +.#{$ionicons-prefix}android-create:before, +.#{$ionicons-prefix}android-delete:before, +.#{$ionicons-prefix}android-desktop:before, +.#{$ionicons-prefix}android-document:before, +.#{$ionicons-prefix}android-done:before, +.#{$ionicons-prefix}android-done-all:before, +.#{$ionicons-prefix}android-download:before, +.#{$ionicons-prefix}android-drafts:before, +.#{$ionicons-prefix}android-exit:before, +.#{$ionicons-prefix}android-expand:before, +.#{$ionicons-prefix}android-favorite:before, +.#{$ionicons-prefix}android-favorite-outline:before, +.#{$ionicons-prefix}android-film:before, +.#{$ionicons-prefix}android-folder:before, +.#{$ionicons-prefix}android-folder-open:before, +.#{$ionicons-prefix}android-funnel:before, +.#{$ionicons-prefix}android-globe:before, +.#{$ionicons-prefix}android-hand:before, +.#{$ionicons-prefix}android-hangout:before, +.#{$ionicons-prefix}android-happy:before, +.#{$ionicons-prefix}android-home:before, +.#{$ionicons-prefix}android-image:before, +.#{$ionicons-prefix}android-laptop:before, +.#{$ionicons-prefix}android-list:before, +.#{$ionicons-prefix}android-locate:before, +.#{$ionicons-prefix}android-lock:before, +.#{$ionicons-prefix}android-mail:before, +.#{$ionicons-prefix}android-map:before, +.#{$ionicons-prefix}android-menu:before, +.#{$ionicons-prefix}android-microphone:before, +.#{$ionicons-prefix}android-microphone-off:before, +.#{$ionicons-prefix}android-more-horizontal:before, +.#{$ionicons-prefix}android-more-vertical:before, +.#{$ionicons-prefix}android-navigate:before, +.#{$ionicons-prefix}android-notifications:before, +.#{$ionicons-prefix}android-notifications-none:before, +.#{$ionicons-prefix}android-notifications-off:before, +.#{$ionicons-prefix}android-open:before, +.#{$ionicons-prefix}android-options:before, +.#{$ionicons-prefix}android-people:before, +.#{$ionicons-prefix}android-person:before, +.#{$ionicons-prefix}android-person-add:before, +.#{$ionicons-prefix}android-phone-landscape:before, +.#{$ionicons-prefix}android-phone-portrait:before, +.#{$ionicons-prefix}android-pin:before, +.#{$ionicons-prefix}android-plane:before, +.#{$ionicons-prefix}android-playstore:before, +.#{$ionicons-prefix}android-print:before, +.#{$ionicons-prefix}android-radio-button-off:before, +.#{$ionicons-prefix}android-radio-button-on:before, +.#{$ionicons-prefix}android-refresh:before, +.#{$ionicons-prefix}android-remove:before, +.#{$ionicons-prefix}android-remove-circle:before, +.#{$ionicons-prefix}android-restaurant:before, +.#{$ionicons-prefix}android-sad:before, +.#{$ionicons-prefix}android-search:before, +.#{$ionicons-prefix}android-send:before, +.#{$ionicons-prefix}android-settings:before, +.#{$ionicons-prefix}android-share:before, +.#{$ionicons-prefix}android-share-alt:before, +.#{$ionicons-prefix}android-star:before, +.#{$ionicons-prefix}android-star-half:before, +.#{$ionicons-prefix}android-star-outline:before, +.#{$ionicons-prefix}android-stopwatch:before, +.#{$ionicons-prefix}android-subway:before, +.#{$ionicons-prefix}android-sunny:before, +.#{$ionicons-prefix}android-sync:before, +.#{$ionicons-prefix}android-textsms:before, +.#{$ionicons-prefix}android-time:before, +.#{$ionicons-prefix}android-train:before, +.#{$ionicons-prefix}android-unlock:before, +.#{$ionicons-prefix}android-upload:before, +.#{$ionicons-prefix}android-volume-down:before, +.#{$ionicons-prefix}android-volume-mute:before, +.#{$ionicons-prefix}android-volume-off:before, +.#{$ionicons-prefix}android-volume-up:before, +.#{$ionicons-prefix}android-walk:before, +.#{$ionicons-prefix}android-warning:before, +.#{$ionicons-prefix}android-watch:before, +.#{$ionicons-prefix}android-wifi:before, +.#{$ionicons-prefix}aperture:before, +.#{$ionicons-prefix}archive:before, +.#{$ionicons-prefix}arrow-down-a:before, +.#{$ionicons-prefix}arrow-down-b:before, +.#{$ionicons-prefix}arrow-down-c:before, +.#{$ionicons-prefix}arrow-expand:before, +.#{$ionicons-prefix}arrow-graph-down-left:before, +.#{$ionicons-prefix}arrow-graph-down-right:before, +.#{$ionicons-prefix}arrow-graph-up-left:before, +.#{$ionicons-prefix}arrow-graph-up-right:before, +.#{$ionicons-prefix}arrow-left-a:before, +.#{$ionicons-prefix}arrow-left-b:before, +.#{$ionicons-prefix}arrow-left-c:before, +.#{$ionicons-prefix}arrow-move:before, +.#{$ionicons-prefix}arrow-resize:before, +.#{$ionicons-prefix}arrow-return-left:before, +.#{$ionicons-prefix}arrow-return-right:before, +.#{$ionicons-prefix}arrow-right-a:before, +.#{$ionicons-prefix}arrow-right-b:before, +.#{$ionicons-prefix}arrow-right-c:before, +.#{$ionicons-prefix}arrow-shrink:before, +.#{$ionicons-prefix}arrow-swap:before, +.#{$ionicons-prefix}arrow-up-a:before, +.#{$ionicons-prefix}arrow-up-b:before, +.#{$ionicons-prefix}arrow-up-c:before, +.#{$ionicons-prefix}asterisk:before, +.#{$ionicons-prefix}at:before, +.#{$ionicons-prefix}backspace:before, +.#{$ionicons-prefix}backspace-outline:before, +.#{$ionicons-prefix}bag:before, +.#{$ionicons-prefix}battery-charging:before, +.#{$ionicons-prefix}battery-empty:before, +.#{$ionicons-prefix}battery-full:before, +.#{$ionicons-prefix}battery-half:before, +.#{$ionicons-prefix}battery-low:before, +.#{$ionicons-prefix}beaker:before, +.#{$ionicons-prefix}beer:before, +.#{$ionicons-prefix}bluetooth:before, +.#{$ionicons-prefix}bonfire:before, +.#{$ionicons-prefix}bookmark:before, +.#{$ionicons-prefix}bowtie:before, +.#{$ionicons-prefix}briefcase:before, +.#{$ionicons-prefix}bug:before, +.#{$ionicons-prefix}calculator:before, +.#{$ionicons-prefix}calendar:before, +.#{$ionicons-prefix}camera:before, +.#{$ionicons-prefix}card:before, +.#{$ionicons-prefix}cash:before, +.#{$ionicons-prefix}chatbox:before, +.#{$ionicons-prefix}chatbox-working:before, +.#{$ionicons-prefix}chatboxes:before, +.#{$ionicons-prefix}chatbubble:before, +.#{$ionicons-prefix}chatbubble-working:before, +.#{$ionicons-prefix}chatbubbles:before, +.#{$ionicons-prefix}checkmark:before, +.#{$ionicons-prefix}checkmark-circled:before, +.#{$ionicons-prefix}checkmark-round:before, +.#{$ionicons-prefix}chevron-down:before, +.#{$ionicons-prefix}chevron-left:before, +.#{$ionicons-prefix}chevron-right:before, +.#{$ionicons-prefix}chevron-up:before, +.#{$ionicons-prefix}clipboard:before, +.#{$ionicons-prefix}clock:before, +.#{$ionicons-prefix}close:before, +.#{$ionicons-prefix}close-circled:before, +.#{$ionicons-prefix}close-round:before, +.#{$ionicons-prefix}closed-captioning:before, +.#{$ionicons-prefix}cloud:before, +.#{$ionicons-prefix}code:before, +.#{$ionicons-prefix}code-download:before, +.#{$ionicons-prefix}code-working:before, +.#{$ionicons-prefix}coffee:before, +.#{$ionicons-prefix}compass:before, +.#{$ionicons-prefix}compose:before, +.#{$ionicons-prefix}connection-bars:before, +.#{$ionicons-prefix}contrast:before, +.#{$ionicons-prefix}crop:before, +.#{$ionicons-prefix}cube:before, +.#{$ionicons-prefix}disc:before, +.#{$ionicons-prefix}document:before, +.#{$ionicons-prefix}document-text:before, +.#{$ionicons-prefix}drag:before, +.#{$ionicons-prefix}earth:before, +.#{$ionicons-prefix}easel:before, +.#{$ionicons-prefix}edit:before, +.#{$ionicons-prefix}egg:before, +.#{$ionicons-prefix}eject:before, +.#{$ionicons-prefix}email:before, +.#{$ionicons-prefix}email-unread:before, +.#{$ionicons-prefix}erlenmeyer-flask:before, +.#{$ionicons-prefix}erlenmeyer-flask-bubbles:before, +.#{$ionicons-prefix}eye:before, +.#{$ionicons-prefix}eye-disabled:before, +.#{$ionicons-prefix}female:before, +.#{$ionicons-prefix}filing:before, +.#{$ionicons-prefix}film-marker:before, +.#{$ionicons-prefix}fireball:before, +.#{$ionicons-prefix}flag:before, +.#{$ionicons-prefix}flame:before, +.#{$ionicons-prefix}flash:before, +.#{$ionicons-prefix}flash-off:before, +.#{$ionicons-prefix}folder:before, +.#{$ionicons-prefix}fork:before, +.#{$ionicons-prefix}fork-repo:before, +.#{$ionicons-prefix}forward:before, +.#{$ionicons-prefix}funnel:before, +.#{$ionicons-prefix}gear-a:before, +.#{$ionicons-prefix}gear-b:before, +.#{$ionicons-prefix}grid:before, +.#{$ionicons-prefix}hammer:before, +.#{$ionicons-prefix}happy:before, +.#{$ionicons-prefix}happy-outline:before, +.#{$ionicons-prefix}headphone:before, +.#{$ionicons-prefix}heart:before, +.#{$ionicons-prefix}heart-broken:before, +.#{$ionicons-prefix}help:before, +.#{$ionicons-prefix}help-buoy:before, +.#{$ionicons-prefix}help-circled:before, +.#{$ionicons-prefix}home:before, +.#{$ionicons-prefix}icecream:before, +.#{$ionicons-prefix}image:before, +.#{$ionicons-prefix}images:before, +.#{$ionicons-prefix}information:before, +.#{$ionicons-prefix}information-circled:before, +.#{$ionicons-prefix}ionic:before, +.#{$ionicons-prefix}ios-alarm:before, +.#{$ionicons-prefix}ios-alarm-outline:before, +.#{$ionicons-prefix}ios-albums:before, +.#{$ionicons-prefix}ios-albums-outline:before, +.#{$ionicons-prefix}ios-americanfootball:before, +.#{$ionicons-prefix}ios-americanfootball-outline:before, +.#{$ionicons-prefix}ios-analytics:before, +.#{$ionicons-prefix}ios-analytics-outline:before, +.#{$ionicons-prefix}ios-arrow-back:before, +.#{$ionicons-prefix}ios-arrow-down:before, +.#{$ionicons-prefix}ios-arrow-forward:before, +.#{$ionicons-prefix}ios-arrow-left:before, +.#{$ionicons-prefix}ios-arrow-right:before, +.#{$ionicons-prefix}ios-arrow-thin-down:before, +.#{$ionicons-prefix}ios-arrow-thin-left:before, +.#{$ionicons-prefix}ios-arrow-thin-right:before, +.#{$ionicons-prefix}ios-arrow-thin-up:before, +.#{$ionicons-prefix}ios-arrow-up:before, +.#{$ionicons-prefix}ios-at:before, +.#{$ionicons-prefix}ios-at-outline:before, +.#{$ionicons-prefix}ios-barcode:before, +.#{$ionicons-prefix}ios-barcode-outline:before, +.#{$ionicons-prefix}ios-baseball:before, +.#{$ionicons-prefix}ios-baseball-outline:before, +.#{$ionicons-prefix}ios-basketball:before, +.#{$ionicons-prefix}ios-basketball-outline:before, +.#{$ionicons-prefix}ios-bell:before, +.#{$ionicons-prefix}ios-bell-outline:before, +.#{$ionicons-prefix}ios-body:before, +.#{$ionicons-prefix}ios-body-outline:before, +.#{$ionicons-prefix}ios-bolt:before, +.#{$ionicons-prefix}ios-bolt-outline:before, +.#{$ionicons-prefix}ios-book:before, +.#{$ionicons-prefix}ios-book-outline:before, +.#{$ionicons-prefix}ios-bookmarks:before, +.#{$ionicons-prefix}ios-bookmarks-outline:before, +.#{$ionicons-prefix}ios-box:before, +.#{$ionicons-prefix}ios-box-outline:before, +.#{$ionicons-prefix}ios-briefcase:before, +.#{$ionicons-prefix}ios-briefcase-outline:before, +.#{$ionicons-prefix}ios-browsers:before, +.#{$ionicons-prefix}ios-browsers-outline:before, +.#{$ionicons-prefix}ios-calculator:before, +.#{$ionicons-prefix}ios-calculator-outline:before, +.#{$ionicons-prefix}ios-calendar:before, +.#{$ionicons-prefix}ios-calendar-outline:before, +.#{$ionicons-prefix}ios-camera:before, +.#{$ionicons-prefix}ios-camera-outline:before, +.#{$ionicons-prefix}ios-cart:before, +.#{$ionicons-prefix}ios-cart-outline:before, +.#{$ionicons-prefix}ios-chatboxes:before, +.#{$ionicons-prefix}ios-chatboxes-outline:before, +.#{$ionicons-prefix}ios-chatbubble:before, +.#{$ionicons-prefix}ios-chatbubble-outline:before, +.#{$ionicons-prefix}ios-checkmark:before, +.#{$ionicons-prefix}ios-checkmark-empty:before, +.#{$ionicons-prefix}ios-checkmark-outline:before, +.#{$ionicons-prefix}ios-circle-filled:before, +.#{$ionicons-prefix}ios-circle-outline:before, +.#{$ionicons-prefix}ios-clock:before, +.#{$ionicons-prefix}ios-clock-outline:before, +.#{$ionicons-prefix}ios-close:before, +.#{$ionicons-prefix}ios-close-empty:before, +.#{$ionicons-prefix}ios-close-outline:before, +.#{$ionicons-prefix}ios-cloud:before, +.#{$ionicons-prefix}ios-cloud-download:before, +.#{$ionicons-prefix}ios-cloud-download-outline:before, +.#{$ionicons-prefix}ios-cloud-outline:before, +.#{$ionicons-prefix}ios-cloud-upload:before, +.#{$ionicons-prefix}ios-cloud-upload-outline:before, +.#{$ionicons-prefix}ios-cloudy:before, +.#{$ionicons-prefix}ios-cloudy-night:before, +.#{$ionicons-prefix}ios-cloudy-night-outline:before, +.#{$ionicons-prefix}ios-cloudy-outline:before, +.#{$ionicons-prefix}ios-cog:before, +.#{$ionicons-prefix}ios-cog-outline:before, +.#{$ionicons-prefix}ios-color-filter:before, +.#{$ionicons-prefix}ios-color-filter-outline:before, +.#{$ionicons-prefix}ios-color-wand:before, +.#{$ionicons-prefix}ios-color-wand-outline:before, +.#{$ionicons-prefix}ios-compose:before, +.#{$ionicons-prefix}ios-compose-outline:before, +.#{$ionicons-prefix}ios-contact:before, +.#{$ionicons-prefix}ios-contact-outline:before, +.#{$ionicons-prefix}ios-copy:before, +.#{$ionicons-prefix}ios-copy-outline:before, +.#{$ionicons-prefix}ios-crop:before, +.#{$ionicons-prefix}ios-crop-strong:before, +.#{$ionicons-prefix}ios-download:before, +.#{$ionicons-prefix}ios-download-outline:before, +.#{$ionicons-prefix}ios-drag:before, +.#{$ionicons-prefix}ios-email:before, +.#{$ionicons-prefix}ios-email-outline:before, +.#{$ionicons-prefix}ios-eye:before, +.#{$ionicons-prefix}ios-eye-outline:before, +.#{$ionicons-prefix}ios-fastforward:before, +.#{$ionicons-prefix}ios-fastforward-outline:before, +.#{$ionicons-prefix}ios-filing:before, +.#{$ionicons-prefix}ios-filing-outline:before, +.#{$ionicons-prefix}ios-film:before, +.#{$ionicons-prefix}ios-film-outline:before, +.#{$ionicons-prefix}ios-flag:before, +.#{$ionicons-prefix}ios-flag-outline:before, +.#{$ionicons-prefix}ios-flame:before, +.#{$ionicons-prefix}ios-flame-outline:before, +.#{$ionicons-prefix}ios-flask:before, +.#{$ionicons-prefix}ios-flask-outline:before, +.#{$ionicons-prefix}ios-flower:before, +.#{$ionicons-prefix}ios-flower-outline:before, +.#{$ionicons-prefix}ios-folder:before, +.#{$ionicons-prefix}ios-folder-outline:before, +.#{$ionicons-prefix}ios-football:before, +.#{$ionicons-prefix}ios-football-outline:before, +.#{$ionicons-prefix}ios-game-controller-a:before, +.#{$ionicons-prefix}ios-game-controller-a-outline:before, +.#{$ionicons-prefix}ios-game-controller-b:before, +.#{$ionicons-prefix}ios-game-controller-b-outline:before, +.#{$ionicons-prefix}ios-gear:before, +.#{$ionicons-prefix}ios-gear-outline:before, +.#{$ionicons-prefix}ios-glasses:before, +.#{$ionicons-prefix}ios-glasses-outline:before, +.#{$ionicons-prefix}ios-grid-view:before, +.#{$ionicons-prefix}ios-grid-view-outline:before, +.#{$ionicons-prefix}ios-heart:before, +.#{$ionicons-prefix}ios-heart-outline:before, +.#{$ionicons-prefix}ios-help:before, +.#{$ionicons-prefix}ios-help-empty:before, +.#{$ionicons-prefix}ios-help-outline:before, +.#{$ionicons-prefix}ios-home:before, +.#{$ionicons-prefix}ios-home-outline:before, +.#{$ionicons-prefix}ios-infinite:before, +.#{$ionicons-prefix}ios-infinite-outline:before, +.#{$ionicons-prefix}ios-information:before, +.#{$ionicons-prefix}ios-information-empty:before, +.#{$ionicons-prefix}ios-information-outline:before, +.#{$ionicons-prefix}ios-ionic-outline:before, +.#{$ionicons-prefix}ios-keypad:before, +.#{$ionicons-prefix}ios-keypad-outline:before, +.#{$ionicons-prefix}ios-lightbulb:before, +.#{$ionicons-prefix}ios-lightbulb-outline:before, +.#{$ionicons-prefix}ios-list:before, +.#{$ionicons-prefix}ios-list-outline:before, +.#{$ionicons-prefix}ios-location:before, +.#{$ionicons-prefix}ios-location-outline:before, +.#{$ionicons-prefix}ios-locked:before, +.#{$ionicons-prefix}ios-locked-outline:before, +.#{$ionicons-prefix}ios-loop:before, +.#{$ionicons-prefix}ios-loop-strong:before, +.#{$ionicons-prefix}ios-medical:before, +.#{$ionicons-prefix}ios-medical-outline:before, +.#{$ionicons-prefix}ios-medkit:before, +.#{$ionicons-prefix}ios-medkit-outline:before, +.#{$ionicons-prefix}ios-mic:before, +.#{$ionicons-prefix}ios-mic-off:before, +.#{$ionicons-prefix}ios-mic-outline:before, +.#{$ionicons-prefix}ios-minus:before, +.#{$ionicons-prefix}ios-minus-empty:before, +.#{$ionicons-prefix}ios-minus-outline:before, +.#{$ionicons-prefix}ios-monitor:before, +.#{$ionicons-prefix}ios-monitor-outline:before, +.#{$ionicons-prefix}ios-moon:before, +.#{$ionicons-prefix}ios-moon-outline:before, +.#{$ionicons-prefix}ios-more:before, +.#{$ionicons-prefix}ios-more-outline:before, +.#{$ionicons-prefix}ios-musical-note:before, +.#{$ionicons-prefix}ios-musical-notes:before, +.#{$ionicons-prefix}ios-navigate:before, +.#{$ionicons-prefix}ios-navigate-outline:before, +.#{$ionicons-prefix}ios-nutrition:before, +.#{$ionicons-prefix}ios-nutrition-outline:before, +.#{$ionicons-prefix}ios-paper:before, +.#{$ionicons-prefix}ios-paper-outline:before, +.#{$ionicons-prefix}ios-paperplane:before, +.#{$ionicons-prefix}ios-paperplane-outline:before, +.#{$ionicons-prefix}ios-partlysunny:before, +.#{$ionicons-prefix}ios-partlysunny-outline:before, +.#{$ionicons-prefix}ios-pause:before, +.#{$ionicons-prefix}ios-pause-outline:before, +.#{$ionicons-prefix}ios-paw:before, +.#{$ionicons-prefix}ios-paw-outline:before, +.#{$ionicons-prefix}ios-people:before, +.#{$ionicons-prefix}ios-people-outline:before, +.#{$ionicons-prefix}ios-person:before, +.#{$ionicons-prefix}ios-person-outline:before, +.#{$ionicons-prefix}ios-personadd:before, +.#{$ionicons-prefix}ios-personadd-outline:before, +.#{$ionicons-prefix}ios-photos:before, +.#{$ionicons-prefix}ios-photos-outline:before, +.#{$ionicons-prefix}ios-pie:before, +.#{$ionicons-prefix}ios-pie-outline:before, +.#{$ionicons-prefix}ios-pint:before, +.#{$ionicons-prefix}ios-pint-outline:before, +.#{$ionicons-prefix}ios-play:before, +.#{$ionicons-prefix}ios-play-outline:before, +.#{$ionicons-prefix}ios-plus:before, +.#{$ionicons-prefix}ios-plus-empty:before, +.#{$ionicons-prefix}ios-plus-outline:before, +.#{$ionicons-prefix}ios-pricetag:before, +.#{$ionicons-prefix}ios-pricetag-outline:before, +.#{$ionicons-prefix}ios-pricetags:before, +.#{$ionicons-prefix}ios-pricetags-outline:before, +.#{$ionicons-prefix}ios-printer:before, +.#{$ionicons-prefix}ios-printer-outline:before, +.#{$ionicons-prefix}ios-pulse:before, +.#{$ionicons-prefix}ios-pulse-strong:before, +.#{$ionicons-prefix}ios-rainy:before, +.#{$ionicons-prefix}ios-rainy-outline:before, +.#{$ionicons-prefix}ios-recording:before, +.#{$ionicons-prefix}ios-recording-outline:before, +.#{$ionicons-prefix}ios-redo:before, +.#{$ionicons-prefix}ios-redo-outline:before, +.#{$ionicons-prefix}ios-refresh:before, +.#{$ionicons-prefix}ios-refresh-empty:before, +.#{$ionicons-prefix}ios-refresh-outline:before, +.#{$ionicons-prefix}ios-reload:before, +.#{$ionicons-prefix}ios-reverse-camera:before, +.#{$ionicons-prefix}ios-reverse-camera-outline:before, +.#{$ionicons-prefix}ios-rewind:before, +.#{$ionicons-prefix}ios-rewind-outline:before, +.#{$ionicons-prefix}ios-rose:before, +.#{$ionicons-prefix}ios-rose-outline:before, +.#{$ionicons-prefix}ios-search:before, +.#{$ionicons-prefix}ios-search-strong:before, +.#{$ionicons-prefix}ios-settings:before, +.#{$ionicons-prefix}ios-settings-strong:before, +.#{$ionicons-prefix}ios-shuffle:before, +.#{$ionicons-prefix}ios-shuffle-strong:before, +.#{$ionicons-prefix}ios-skipbackward:before, +.#{$ionicons-prefix}ios-skipbackward-outline:before, +.#{$ionicons-prefix}ios-skipforward:before, +.#{$ionicons-prefix}ios-skipforward-outline:before, +.#{$ionicons-prefix}ios-snowy:before, +.#{$ionicons-prefix}ios-speedometer:before, +.#{$ionicons-prefix}ios-speedometer-outline:before, +.#{$ionicons-prefix}ios-star:before, +.#{$ionicons-prefix}ios-star-half:before, +.#{$ionicons-prefix}ios-star-outline:before, +.#{$ionicons-prefix}ios-stopwatch:before, +.#{$ionicons-prefix}ios-stopwatch-outline:before, +.#{$ionicons-prefix}ios-sunny:before, +.#{$ionicons-prefix}ios-sunny-outline:before, +.#{$ionicons-prefix}ios-telephone:before, +.#{$ionicons-prefix}ios-telephone-outline:before, +.#{$ionicons-prefix}ios-tennisball:before, +.#{$ionicons-prefix}ios-tennisball-outline:before, +.#{$ionicons-prefix}ios-thunderstorm:before, +.#{$ionicons-prefix}ios-thunderstorm-outline:before, +.#{$ionicons-prefix}ios-time:before, +.#{$ionicons-prefix}ios-time-outline:before, +.#{$ionicons-prefix}ios-timer:before, +.#{$ionicons-prefix}ios-timer-outline:before, +.#{$ionicons-prefix}ios-toggle:before, +.#{$ionicons-prefix}ios-toggle-outline:before, +.#{$ionicons-prefix}ios-trash:before, +.#{$ionicons-prefix}ios-trash-outline:before, +.#{$ionicons-prefix}ios-undo:before, +.#{$ionicons-prefix}ios-undo-outline:before, +.#{$ionicons-prefix}ios-unlocked:before, +.#{$ionicons-prefix}ios-unlocked-outline:before, +.#{$ionicons-prefix}ios-upload:before, +.#{$ionicons-prefix}ios-upload-outline:before, +.#{$ionicons-prefix}ios-videocam:before, +.#{$ionicons-prefix}ios-videocam-outline:before, +.#{$ionicons-prefix}ios-volume-high:before, +.#{$ionicons-prefix}ios-volume-low:before, +.#{$ionicons-prefix}ios-wineglass:before, +.#{$ionicons-prefix}ios-wineglass-outline:before, +.#{$ionicons-prefix}ios-world:before, +.#{$ionicons-prefix}ios-world-outline:before, +.#{$ionicons-prefix}ipad:before, +.#{$ionicons-prefix}iphone:before, +.#{$ionicons-prefix}ipod:before, +.#{$ionicons-prefix}jet:before, +.#{$ionicons-prefix}key:before, +.#{$ionicons-prefix}knife:before, +.#{$ionicons-prefix}laptop:before, +.#{$ionicons-prefix}leaf:before, +.#{$ionicons-prefix}levels:before, +.#{$ionicons-prefix}lightbulb:before, +.#{$ionicons-prefix}link:before, +.#{$ionicons-prefix}load-a:before, +.#{$ionicons-prefix}load-b:before, +.#{$ionicons-prefix}load-c:before, +.#{$ionicons-prefix}load-d:before, +.#{$ionicons-prefix}location:before, +.#{$ionicons-prefix}lock-combination:before, +.#{$ionicons-prefix}locked:before, +.#{$ionicons-prefix}log-in:before, +.#{$ionicons-prefix}log-out:before, +.#{$ionicons-prefix}loop:before, +.#{$ionicons-prefix}magnet:before, +.#{$ionicons-prefix}male:before, +.#{$ionicons-prefix}man:before, +.#{$ionicons-prefix}map:before, +.#{$ionicons-prefix}medkit:before, +.#{$ionicons-prefix}merge:before, +.#{$ionicons-prefix}mic-a:before, +.#{$ionicons-prefix}mic-b:before, +.#{$ionicons-prefix}mic-c:before, +.#{$ionicons-prefix}minus:before, +.#{$ionicons-prefix}minus-circled:before, +.#{$ionicons-prefix}minus-round:before, +.#{$ionicons-prefix}model-s:before, +.#{$ionicons-prefix}monitor:before, +.#{$ionicons-prefix}more:before, +.#{$ionicons-prefix}mouse:before, +.#{$ionicons-prefix}music-note:before, +.#{$ionicons-prefix}navicon:before, +.#{$ionicons-prefix}navicon-round:before, +.#{$ionicons-prefix}navigate:before, +.#{$ionicons-prefix}network:before, +.#{$ionicons-prefix}no-smoking:before, +.#{$ionicons-prefix}nuclear:before, +.#{$ionicons-prefix}outlet:before, +.#{$ionicons-prefix}paintbrush:before, +.#{$ionicons-prefix}paintbucket:before, +.#{$ionicons-prefix}paper-airplane:before, +.#{$ionicons-prefix}paperclip:before, +.#{$ionicons-prefix}pause:before, +.#{$ionicons-prefix}person:before, +.#{$ionicons-prefix}person-add:before, +.#{$ionicons-prefix}person-stalker:before, +.#{$ionicons-prefix}pie-graph:before, +.#{$ionicons-prefix}pin:before, +.#{$ionicons-prefix}pinpoint:before, +.#{$ionicons-prefix}pizza:before, +.#{$ionicons-prefix}plane:before, +.#{$ionicons-prefix}planet:before, +.#{$ionicons-prefix}play:before, +.#{$ionicons-prefix}playstation:before, +.#{$ionicons-prefix}plus:before, +.#{$ionicons-prefix}plus-circled:before, +.#{$ionicons-prefix}plus-round:before, +.#{$ionicons-prefix}podium:before, +.#{$ionicons-prefix}pound:before, +.#{$ionicons-prefix}power:before, +.#{$ionicons-prefix}pricetag:before, +.#{$ionicons-prefix}pricetags:before, +.#{$ionicons-prefix}printer:before, +.#{$ionicons-prefix}pull-request:before, +.#{$ionicons-prefix}qr-scanner:before, +.#{$ionicons-prefix}quote:before, +.#{$ionicons-prefix}radio-waves:before, +.#{$ionicons-prefix}record:before, +.#{$ionicons-prefix}refresh:before, +.#{$ionicons-prefix}reply:before, +.#{$ionicons-prefix}reply-all:before, +.#{$ionicons-prefix}ribbon-a:before, +.#{$ionicons-prefix}ribbon-b:before, +.#{$ionicons-prefix}sad:before, +.#{$ionicons-prefix}sad-outline:before, +.#{$ionicons-prefix}scissors:before, +.#{$ionicons-prefix}search:before, +.#{$ionicons-prefix}settings:before, +.#{$ionicons-prefix}share:before, +.#{$ionicons-prefix}shuffle:before, +.#{$ionicons-prefix}skip-backward:before, +.#{$ionicons-prefix}skip-forward:before, +.#{$ionicons-prefix}social-android:before, +.#{$ionicons-prefix}social-android-outline:before, +.#{$ionicons-prefix}social-angular:before, +.#{$ionicons-prefix}social-angular-outline:before, +.#{$ionicons-prefix}social-apple:before, +.#{$ionicons-prefix}social-apple-outline:before, +.#{$ionicons-prefix}social-bitcoin:before, +.#{$ionicons-prefix}social-bitcoin-outline:before, +.#{$ionicons-prefix}social-buffer:before, +.#{$ionicons-prefix}social-buffer-outline:before, +.#{$ionicons-prefix}social-chrome:before, +.#{$ionicons-prefix}social-chrome-outline:before, +.#{$ionicons-prefix}social-codepen:before, +.#{$ionicons-prefix}social-codepen-outline:before, +.#{$ionicons-prefix}social-css3:before, +.#{$ionicons-prefix}social-css3-outline:before, +.#{$ionicons-prefix}social-designernews:before, +.#{$ionicons-prefix}social-designernews-outline:before, +.#{$ionicons-prefix}social-dribbble:before, +.#{$ionicons-prefix}social-dribbble-outline:before, +.#{$ionicons-prefix}social-dropbox:before, +.#{$ionicons-prefix}social-dropbox-outline:before, +.#{$ionicons-prefix}social-euro:before, +.#{$ionicons-prefix}social-euro-outline:before, +.#{$ionicons-prefix}social-facebook:before, +.#{$ionicons-prefix}social-facebook-outline:before, +.#{$ionicons-prefix}social-foursquare:before, +.#{$ionicons-prefix}social-foursquare-outline:before, +.#{$ionicons-prefix}social-freebsd-devil:before, +.#{$ionicons-prefix}social-github:before, +.#{$ionicons-prefix}social-github-outline:before, +.#{$ionicons-prefix}social-google:before, +.#{$ionicons-prefix}social-google-outline:before, +.#{$ionicons-prefix}social-googleplus:before, +.#{$ionicons-prefix}social-googleplus-outline:before, +.#{$ionicons-prefix}social-hackernews:before, +.#{$ionicons-prefix}social-hackernews-outline:before, +.#{$ionicons-prefix}social-html5:before, +.#{$ionicons-prefix}social-html5-outline:before, +.#{$ionicons-prefix}social-instagram:before, +.#{$ionicons-prefix}social-instagram-outline:before, +.#{$ionicons-prefix}social-javascript:before, +.#{$ionicons-prefix}social-javascript-outline:before, +.#{$ionicons-prefix}social-linkedin:before, +.#{$ionicons-prefix}social-linkedin-outline:before, +.#{$ionicons-prefix}social-markdown:before, +.#{$ionicons-prefix}social-nodejs:before, +.#{$ionicons-prefix}social-octocat:before, +.#{$ionicons-prefix}social-pinterest:before, +.#{$ionicons-prefix}social-pinterest-outline:before, +.#{$ionicons-prefix}social-python:before, +.#{$ionicons-prefix}social-reddit:before, +.#{$ionicons-prefix}social-reddit-outline:before, +.#{$ionicons-prefix}social-rss:before, +.#{$ionicons-prefix}social-rss-outline:before, +.#{$ionicons-prefix}social-sass:before, +.#{$ionicons-prefix}social-skype:before, +.#{$ionicons-prefix}social-skype-outline:before, +.#{$ionicons-prefix}social-snapchat:before, +.#{$ionicons-prefix}social-snapchat-outline:before, +.#{$ionicons-prefix}social-tumblr:before, +.#{$ionicons-prefix}social-tumblr-outline:before, +.#{$ionicons-prefix}social-tux:before, +.#{$ionicons-prefix}social-twitch:before, +.#{$ionicons-prefix}social-twitch-outline:before, +.#{$ionicons-prefix}social-twitter:before, +.#{$ionicons-prefix}social-twitter-outline:before, +.#{$ionicons-prefix}social-usd:before, +.#{$ionicons-prefix}social-usd-outline:before, +.#{$ionicons-prefix}social-vimeo:before, +.#{$ionicons-prefix}social-vimeo-outline:before, +.#{$ionicons-prefix}social-whatsapp:before, +.#{$ionicons-prefix}social-whatsapp-outline:before, +.#{$ionicons-prefix}social-windows:before, +.#{$ionicons-prefix}social-windows-outline:before, +.#{$ionicons-prefix}social-wordpress:before, +.#{$ionicons-prefix}social-wordpress-outline:before, +.#{$ionicons-prefix}social-yahoo:before, +.#{$ionicons-prefix}social-yahoo-outline:before, +.#{$ionicons-prefix}social-yen:before, +.#{$ionicons-prefix}social-yen-outline:before, +.#{$ionicons-prefix}social-youtube:before, +.#{$ionicons-prefix}social-youtube-outline:before, +.#{$ionicons-prefix}soup-can:before, +.#{$ionicons-prefix}soup-can-outline:before, +.#{$ionicons-prefix}speakerphone:before, +.#{$ionicons-prefix}speedometer:before, +.#{$ionicons-prefix}spoon:before, +.#{$ionicons-prefix}star:before, +.#{$ionicons-prefix}stats-bars:before, +.#{$ionicons-prefix}steam:before, +.#{$ionicons-prefix}stop:before, +.#{$ionicons-prefix}thermometer:before, +.#{$ionicons-prefix}thumbsdown:before, +.#{$ionicons-prefix}thumbsup:before, +.#{$ionicons-prefix}toggle:before, +.#{$ionicons-prefix}toggle-filled:before, +.#{$ionicons-prefix}transgender:before, +.#{$ionicons-prefix}trash-a:before, +.#{$ionicons-prefix}trash-b:before, +.#{$ionicons-prefix}trophy:before, +.#{$ionicons-prefix}tshirt:before, +.#{$ionicons-prefix}tshirt-outline:before, +.#{$ionicons-prefix}umbrella:before, +.#{$ionicons-prefix}university:before, +.#{$ionicons-prefix}unlocked:before, +.#{$ionicons-prefix}upload:before, +.#{$ionicons-prefix}usb:before, +.#{$ionicons-prefix}videocamera:before, +.#{$ionicons-prefix}volume-high:before, +.#{$ionicons-prefix}volume-low:before, +.#{$ionicons-prefix}volume-medium:before, +.#{$ionicons-prefix}volume-mute:before, +.#{$ionicons-prefix}wand:before, +.#{$ionicons-prefix}waterdrop:before, +.#{$ionicons-prefix}wifi:before, +.#{$ionicons-prefix}wineglass:before, +.#{$ionicons-prefix}woman:before, +.#{$ionicons-prefix}wrench:before, +.#{$ionicons-prefix}xbox:before +{ + @extend .ion; +} +.#{$ionicons-prefix}alert:before { content: $ionicon-var-alert; } +.#{$ionicons-prefix}alert-circled:before { content: $ionicon-var-alert-circled; } +.#{$ionicons-prefix}android-add:before { content: $ionicon-var-android-add; } +.#{$ionicons-prefix}android-add-circle:before { content: $ionicon-var-android-add-circle; } +.#{$ionicons-prefix}android-alarm-clock:before { content: $ionicon-var-android-alarm-clock; } +.#{$ionicons-prefix}android-alert:before { content: $ionicon-var-android-alert; } +.#{$ionicons-prefix}android-apps:before { content: $ionicon-var-android-apps; } +.#{$ionicons-prefix}android-archive:before { content: $ionicon-var-android-archive; } +.#{$ionicons-prefix}android-arrow-back:before { content: $ionicon-var-android-arrow-back; } +.#{$ionicons-prefix}android-arrow-down:before { content: $ionicon-var-android-arrow-down; } +.#{$ionicons-prefix}android-arrow-dropdown:before { content: $ionicon-var-android-arrow-dropdown; } +.#{$ionicons-prefix}android-arrow-dropdown-circle:before { content: $ionicon-var-android-arrow-dropdown-circle; } +.#{$ionicons-prefix}android-arrow-dropleft:before { content: $ionicon-var-android-arrow-dropleft; } +.#{$ionicons-prefix}android-arrow-dropleft-circle:before { content: $ionicon-var-android-arrow-dropleft-circle; } +.#{$ionicons-prefix}android-arrow-dropright:before { content: $ionicon-var-android-arrow-dropright; } +.#{$ionicons-prefix}android-arrow-dropright-circle:before { content: $ionicon-var-android-arrow-dropright-circle; } +.#{$ionicons-prefix}android-arrow-dropup:before { content: $ionicon-var-android-arrow-dropup; } +.#{$ionicons-prefix}android-arrow-dropup-circle:before { content: $ionicon-var-android-arrow-dropup-circle; } +.#{$ionicons-prefix}android-arrow-forward:before { content: $ionicon-var-android-arrow-forward; } +.#{$ionicons-prefix}android-arrow-up:before { content: $ionicon-var-android-arrow-up; } +.#{$ionicons-prefix}android-attach:before { content: $ionicon-var-android-attach; } +.#{$ionicons-prefix}android-bar:before { content: $ionicon-var-android-bar; } +.#{$ionicons-prefix}android-bicycle:before { content: $ionicon-var-android-bicycle; } +.#{$ionicons-prefix}android-boat:before { content: $ionicon-var-android-boat; } +.#{$ionicons-prefix}android-bookmark:before { content: $ionicon-var-android-bookmark; } +.#{$ionicons-prefix}android-bulb:before { content: $ionicon-var-android-bulb; } +.#{$ionicons-prefix}android-bus:before { content: $ionicon-var-android-bus; } +.#{$ionicons-prefix}android-calendar:before { content: $ionicon-var-android-calendar; } +.#{$ionicons-prefix}android-call:before { content: $ionicon-var-android-call; } +.#{$ionicons-prefix}android-camera:before { content: $ionicon-var-android-camera; } +.#{$ionicons-prefix}android-cancel:before { content: $ionicon-var-android-cancel; } +.#{$ionicons-prefix}android-car:before { content: $ionicon-var-android-car; } +.#{$ionicons-prefix}android-cart:before { content: $ionicon-var-android-cart; } +.#{$ionicons-prefix}android-chat:before { content: $ionicon-var-android-chat; } +.#{$ionicons-prefix}android-checkbox:before { content: $ionicon-var-android-checkbox; } +.#{$ionicons-prefix}android-checkbox-blank:before { content: $ionicon-var-android-checkbox-blank; } +.#{$ionicons-prefix}android-checkbox-outline:before { content: $ionicon-var-android-checkbox-outline; } +.#{$ionicons-prefix}android-checkbox-outline-blank:before { content: $ionicon-var-android-checkbox-outline-blank; } +.#{$ionicons-prefix}android-checkmark-circle:before { content: $ionicon-var-android-checkmark-circle; } +.#{$ionicons-prefix}android-clipboard:before { content: $ionicon-var-android-clipboard; } +.#{$ionicons-prefix}android-close:before { content: $ionicon-var-android-close; } +.#{$ionicons-prefix}android-cloud:before { content: $ionicon-var-android-cloud; } +.#{$ionicons-prefix}android-cloud-circle:before { content: $ionicon-var-android-cloud-circle; } +.#{$ionicons-prefix}android-cloud-done:before { content: $ionicon-var-android-cloud-done; } +.#{$ionicons-prefix}android-cloud-outline:before { content: $ionicon-var-android-cloud-outline; } +.#{$ionicons-prefix}android-color-palette:before { content: $ionicon-var-android-color-palette; } +.#{$ionicons-prefix}android-compass:before { content: $ionicon-var-android-compass; } +.#{$ionicons-prefix}android-contact:before { content: $ionicon-var-android-contact; } +.#{$ionicons-prefix}android-contacts:before { content: $ionicon-var-android-contacts; } +.#{$ionicons-prefix}android-contract:before { content: $ionicon-var-android-contract; } +.#{$ionicons-prefix}android-create:before { content: $ionicon-var-android-create; } +.#{$ionicons-prefix}android-delete:before { content: $ionicon-var-android-delete; } +.#{$ionicons-prefix}android-desktop:before { content: $ionicon-var-android-desktop; } +.#{$ionicons-prefix}android-document:before { content: $ionicon-var-android-document; } +.#{$ionicons-prefix}android-done:before { content: $ionicon-var-android-done; } +.#{$ionicons-prefix}android-done-all:before { content: $ionicon-var-android-done-all; } +.#{$ionicons-prefix}android-download:before { content: $ionicon-var-android-download; } +.#{$ionicons-prefix}android-drafts:before { content: $ionicon-var-android-drafts; } +.#{$ionicons-prefix}android-exit:before { content: $ionicon-var-android-exit; } +.#{$ionicons-prefix}android-expand:before { content: $ionicon-var-android-expand; } +.#{$ionicons-prefix}android-favorite:before { content: $ionicon-var-android-favorite; } +.#{$ionicons-prefix}android-favorite-outline:before { content: $ionicon-var-android-favorite-outline; } +.#{$ionicons-prefix}android-film:before { content: $ionicon-var-android-film; } +.#{$ionicons-prefix}android-folder:before { content: $ionicon-var-android-folder; } +.#{$ionicons-prefix}android-folder-open:before { content: $ionicon-var-android-folder-open; } +.#{$ionicons-prefix}android-funnel:before { content: $ionicon-var-android-funnel; } +.#{$ionicons-prefix}android-globe:before { content: $ionicon-var-android-globe; } +.#{$ionicons-prefix}android-hand:before { content: $ionicon-var-android-hand; } +.#{$ionicons-prefix}android-hangout:before { content: $ionicon-var-android-hangout; } +.#{$ionicons-prefix}android-happy:before { content: $ionicon-var-android-happy; } +.#{$ionicons-prefix}android-home:before { content: $ionicon-var-android-home; } +.#{$ionicons-prefix}android-image:before { content: $ionicon-var-android-image; } +.#{$ionicons-prefix}android-laptop:before { content: $ionicon-var-android-laptop; } +.#{$ionicons-prefix}android-list:before { content: $ionicon-var-android-list; } +.#{$ionicons-prefix}android-locate:before { content: $ionicon-var-android-locate; } +.#{$ionicons-prefix}android-lock:before { content: $ionicon-var-android-lock; } +.#{$ionicons-prefix}android-mail:before { content: $ionicon-var-android-mail; } +.#{$ionicons-prefix}android-map:before { content: $ionicon-var-android-map; } +.#{$ionicons-prefix}android-menu:before { content: $ionicon-var-android-menu; } +.#{$ionicons-prefix}android-microphone:before { content: $ionicon-var-android-microphone; } +.#{$ionicons-prefix}android-microphone-off:before { content: $ionicon-var-android-microphone-off; } +.#{$ionicons-prefix}android-more-horizontal:before { content: $ionicon-var-android-more-horizontal; } +.#{$ionicons-prefix}android-more-vertical:before { content: $ionicon-var-android-more-vertical; } +.#{$ionicons-prefix}android-navigate:before { content: $ionicon-var-android-navigate; } +.#{$ionicons-prefix}android-notifications:before { content: $ionicon-var-android-notifications; } +.#{$ionicons-prefix}android-notifications-none:before { content: $ionicon-var-android-notifications-none; } +.#{$ionicons-prefix}android-notifications-off:before { content: $ionicon-var-android-notifications-off; } +.#{$ionicons-prefix}android-open:before { content: $ionicon-var-android-open; } +.#{$ionicons-prefix}android-options:before { content: $ionicon-var-android-options; } +.#{$ionicons-prefix}android-people:before { content: $ionicon-var-android-people; } +.#{$ionicons-prefix}android-person:before { content: $ionicon-var-android-person; } +.#{$ionicons-prefix}android-person-add:before { content: $ionicon-var-android-person-add; } +.#{$ionicons-prefix}android-phone-landscape:before { content: $ionicon-var-android-phone-landscape; } +.#{$ionicons-prefix}android-phone-portrait:before { content: $ionicon-var-android-phone-portrait; } +.#{$ionicons-prefix}android-pin:before { content: $ionicon-var-android-pin; } +.#{$ionicons-prefix}android-plane:before { content: $ionicon-var-android-plane; } +.#{$ionicons-prefix}android-playstore:before { content: $ionicon-var-android-playstore; } +.#{$ionicons-prefix}android-print:before { content: $ionicon-var-android-print; } +.#{$ionicons-prefix}android-radio-button-off:before { content: $ionicon-var-android-radio-button-off; } +.#{$ionicons-prefix}android-radio-button-on:before { content: $ionicon-var-android-radio-button-on; } +.#{$ionicons-prefix}android-refresh:before { content: $ionicon-var-android-refresh; } +.#{$ionicons-prefix}android-remove:before { content: $ionicon-var-android-remove; } +.#{$ionicons-prefix}android-remove-circle:before { content: $ionicon-var-android-remove-circle; } +.#{$ionicons-prefix}android-restaurant:before { content: $ionicon-var-android-restaurant; } +.#{$ionicons-prefix}android-sad:before { content: $ionicon-var-android-sad; } +.#{$ionicons-prefix}android-search:before { content: $ionicon-var-android-search; } +.#{$ionicons-prefix}android-send:before { content: $ionicon-var-android-send; } +.#{$ionicons-prefix}android-settings:before { content: $ionicon-var-android-settings; } +.#{$ionicons-prefix}android-share:before { content: $ionicon-var-android-share; } +.#{$ionicons-prefix}android-share-alt:before { content: $ionicon-var-android-share-alt; } +.#{$ionicons-prefix}android-star:before { content: $ionicon-var-android-star; } +.#{$ionicons-prefix}android-star-half:before { content: $ionicon-var-android-star-half; } +.#{$ionicons-prefix}android-star-outline:before { content: $ionicon-var-android-star-outline; } +.#{$ionicons-prefix}android-stopwatch:before { content: $ionicon-var-android-stopwatch; } +.#{$ionicons-prefix}android-subway:before { content: $ionicon-var-android-subway; } +.#{$ionicons-prefix}android-sunny:before { content: $ionicon-var-android-sunny; } +.#{$ionicons-prefix}android-sync:before { content: $ionicon-var-android-sync; } +.#{$ionicons-prefix}android-textsms:before { content: $ionicon-var-android-textsms; } +.#{$ionicons-prefix}android-time:before { content: $ionicon-var-android-time; } +.#{$ionicons-prefix}android-train:before { content: $ionicon-var-android-train; } +.#{$ionicons-prefix}android-unlock:before { content: $ionicon-var-android-unlock; } +.#{$ionicons-prefix}android-upload:before { content: $ionicon-var-android-upload; } +.#{$ionicons-prefix}android-volume-down:before { content: $ionicon-var-android-volume-down; } +.#{$ionicons-prefix}android-volume-mute:before { content: $ionicon-var-android-volume-mute; } +.#{$ionicons-prefix}android-volume-off:before { content: $ionicon-var-android-volume-off; } +.#{$ionicons-prefix}android-volume-up:before { content: $ionicon-var-android-volume-up; } +.#{$ionicons-prefix}android-walk:before { content: $ionicon-var-android-walk; } +.#{$ionicons-prefix}android-warning:before { content: $ionicon-var-android-warning; } +.#{$ionicons-prefix}android-watch:before { content: $ionicon-var-android-watch; } +.#{$ionicons-prefix}android-wifi:before { content: $ionicon-var-android-wifi; } +.#{$ionicons-prefix}aperture:before { content: $ionicon-var-aperture; } +.#{$ionicons-prefix}archive:before { content: $ionicon-var-archive; } +.#{$ionicons-prefix}arrow-down-a:before { content: $ionicon-var-arrow-down-a; } +.#{$ionicons-prefix}arrow-down-b:before { content: $ionicon-var-arrow-down-b; } +.#{$ionicons-prefix}arrow-down-c:before { content: $ionicon-var-arrow-down-c; } +.#{$ionicons-prefix}arrow-expand:before { content: $ionicon-var-arrow-expand; } +.#{$ionicons-prefix}arrow-graph-down-left:before { content: $ionicon-var-arrow-graph-down-left; } +.#{$ionicons-prefix}arrow-graph-down-right:before { content: $ionicon-var-arrow-graph-down-right; } +.#{$ionicons-prefix}arrow-graph-up-left:before { content: $ionicon-var-arrow-graph-up-left; } +.#{$ionicons-prefix}arrow-graph-up-right:before { content: $ionicon-var-arrow-graph-up-right; } +.#{$ionicons-prefix}arrow-left-a:before { content: $ionicon-var-arrow-left-a; } +.#{$ionicons-prefix}arrow-left-b:before { content: $ionicon-var-arrow-left-b; } +.#{$ionicons-prefix}arrow-left-c:before { content: $ionicon-var-arrow-left-c; } +.#{$ionicons-prefix}arrow-move:before { content: $ionicon-var-arrow-move; } +.#{$ionicons-prefix}arrow-resize:before { content: $ionicon-var-arrow-resize; } +.#{$ionicons-prefix}arrow-return-left:before { content: $ionicon-var-arrow-return-left; } +.#{$ionicons-prefix}arrow-return-right:before { content: $ionicon-var-arrow-return-right; } +.#{$ionicons-prefix}arrow-right-a:before { content: $ionicon-var-arrow-right-a; } +.#{$ionicons-prefix}arrow-right-b:before { content: $ionicon-var-arrow-right-b; } +.#{$ionicons-prefix}arrow-right-c:before { content: $ionicon-var-arrow-right-c; } +.#{$ionicons-prefix}arrow-shrink:before { content: $ionicon-var-arrow-shrink; } +.#{$ionicons-prefix}arrow-swap:before { content: $ionicon-var-arrow-swap; } +.#{$ionicons-prefix}arrow-up-a:before { content: $ionicon-var-arrow-up-a; } +.#{$ionicons-prefix}arrow-up-b:before { content: $ionicon-var-arrow-up-b; } +.#{$ionicons-prefix}arrow-up-c:before { content: $ionicon-var-arrow-up-c; } +.#{$ionicons-prefix}asterisk:before { content: $ionicon-var-asterisk; } +.#{$ionicons-prefix}at:before { content: $ionicon-var-at; } +.#{$ionicons-prefix}backspace:before { content: $ionicon-var-backspace; } +.#{$ionicons-prefix}backspace-outline:before { content: $ionicon-var-backspace-outline; } +.#{$ionicons-prefix}bag:before { content: $ionicon-var-bag; } +.#{$ionicons-prefix}battery-charging:before { content: $ionicon-var-battery-charging; } +.#{$ionicons-prefix}battery-empty:before { content: $ionicon-var-battery-empty; } +.#{$ionicons-prefix}battery-full:before { content: $ionicon-var-battery-full; } +.#{$ionicons-prefix}battery-half:before { content: $ionicon-var-battery-half; } +.#{$ionicons-prefix}battery-low:before { content: $ionicon-var-battery-low; } +.#{$ionicons-prefix}beaker:before { content: $ionicon-var-beaker; } +.#{$ionicons-prefix}beer:before { content: $ionicon-var-beer; } +.#{$ionicons-prefix}bluetooth:before { content: $ionicon-var-bluetooth; } +.#{$ionicons-prefix}bonfire:before { content: $ionicon-var-bonfire; } +.#{$ionicons-prefix}bookmark:before { content: $ionicon-var-bookmark; } +.#{$ionicons-prefix}bowtie:before { content: $ionicon-var-bowtie; } +.#{$ionicons-prefix}briefcase:before { content: $ionicon-var-briefcase; } +.#{$ionicons-prefix}bug:before { content: $ionicon-var-bug; } +.#{$ionicons-prefix}calculator:before { content: $ionicon-var-calculator; } +.#{$ionicons-prefix}calendar:before { content: $ionicon-var-calendar; } +.#{$ionicons-prefix}camera:before { content: $ionicon-var-camera; } +.#{$ionicons-prefix}card:before { content: $ionicon-var-card; } +.#{$ionicons-prefix}cash:before { content: $ionicon-var-cash; } +.#{$ionicons-prefix}chatbox:before { content: $ionicon-var-chatbox; } +.#{$ionicons-prefix}chatbox-working:before { content: $ionicon-var-chatbox-working; } +.#{$ionicons-prefix}chatboxes:before { content: $ionicon-var-chatboxes; } +.#{$ionicons-prefix}chatbubble:before { content: $ionicon-var-chatbubble; } +.#{$ionicons-prefix}chatbubble-working:before { content: $ionicon-var-chatbubble-working; } +.#{$ionicons-prefix}chatbubbles:before { content: $ionicon-var-chatbubbles; } +.#{$ionicons-prefix}checkmark:before { content: $ionicon-var-checkmark; } +.#{$ionicons-prefix}checkmark-circled:before { content: $ionicon-var-checkmark-circled; } +.#{$ionicons-prefix}checkmark-round:before { content: $ionicon-var-checkmark-round; } +.#{$ionicons-prefix}chevron-down:before { content: $ionicon-var-chevron-down; } +.#{$ionicons-prefix}chevron-left:before { content: $ionicon-var-chevron-left; } +.#{$ionicons-prefix}chevron-right:before { content: $ionicon-var-chevron-right; } +.#{$ionicons-prefix}chevron-up:before { content: $ionicon-var-chevron-up; } +.#{$ionicons-prefix}clipboard:before { content: $ionicon-var-clipboard; } +.#{$ionicons-prefix}clock:before { content: $ionicon-var-clock; } +.#{$ionicons-prefix}close:before { content: $ionicon-var-close; } +.#{$ionicons-prefix}close-circled:before { content: $ionicon-var-close-circled; } +.#{$ionicons-prefix}close-round:before { content: $ionicon-var-close-round; } +.#{$ionicons-prefix}closed-captioning:before { content: $ionicon-var-closed-captioning; } +.#{$ionicons-prefix}cloud:before { content: $ionicon-var-cloud; } +.#{$ionicons-prefix}code:before { content: $ionicon-var-code; } +.#{$ionicons-prefix}code-download:before { content: $ionicon-var-code-download; } +.#{$ionicons-prefix}code-working:before { content: $ionicon-var-code-working; } +.#{$ionicons-prefix}coffee:before { content: $ionicon-var-coffee; } +.#{$ionicons-prefix}compass:before { content: $ionicon-var-compass; } +.#{$ionicons-prefix}compose:before { content: $ionicon-var-compose; } +.#{$ionicons-prefix}connection-bars:before { content: $ionicon-var-connection-bars; } +.#{$ionicons-prefix}contrast:before { content: $ionicon-var-contrast; } +.#{$ionicons-prefix}crop:before { content: $ionicon-var-crop; } +.#{$ionicons-prefix}cube:before { content: $ionicon-var-cube; } +.#{$ionicons-prefix}disc:before { content: $ionicon-var-disc; } +.#{$ionicons-prefix}document:before { content: $ionicon-var-document; } +.#{$ionicons-prefix}document-text:before { content: $ionicon-var-document-text; } +.#{$ionicons-prefix}drag:before { content: $ionicon-var-drag; } +.#{$ionicons-prefix}earth:before { content: $ionicon-var-earth; } +.#{$ionicons-prefix}easel:before { content: $ionicon-var-easel; } +.#{$ionicons-prefix}edit:before { content: $ionicon-var-edit; } +.#{$ionicons-prefix}egg:before { content: $ionicon-var-egg; } +.#{$ionicons-prefix}eject:before { content: $ionicon-var-eject; } +.#{$ionicons-prefix}email:before { content: $ionicon-var-email; } +.#{$ionicons-prefix}email-unread:before { content: $ionicon-var-email-unread; } +.#{$ionicons-prefix}erlenmeyer-flask:before { content: $ionicon-var-erlenmeyer-flask; } +.#{$ionicons-prefix}erlenmeyer-flask-bubbles:before { content: $ionicon-var-erlenmeyer-flask-bubbles; } +.#{$ionicons-prefix}eye:before { content: $ionicon-var-eye; } +.#{$ionicons-prefix}eye-disabled:before { content: $ionicon-var-eye-disabled; } +.#{$ionicons-prefix}female:before { content: $ionicon-var-female; } +.#{$ionicons-prefix}filing:before { content: $ionicon-var-filing; } +.#{$ionicons-prefix}film-marker:before { content: $ionicon-var-film-marker; } +.#{$ionicons-prefix}fireball:before { content: $ionicon-var-fireball; } +.#{$ionicons-prefix}flag:before { content: $ionicon-var-flag; } +.#{$ionicons-prefix}flame:before { content: $ionicon-var-flame; } +.#{$ionicons-prefix}flash:before { content: $ionicon-var-flash; } +.#{$ionicons-prefix}flash-off:before { content: $ionicon-var-flash-off; } +.#{$ionicons-prefix}folder:before { content: $ionicon-var-folder; } +.#{$ionicons-prefix}fork:before { content: $ionicon-var-fork; } +.#{$ionicons-prefix}fork-repo:before { content: $ionicon-var-fork-repo; } +.#{$ionicons-prefix}forward:before { content: $ionicon-var-forward; } +.#{$ionicons-prefix}funnel:before { content: $ionicon-var-funnel; } +.#{$ionicons-prefix}gear-a:before { content: $ionicon-var-gear-a; } +.#{$ionicons-prefix}gear-b:before { content: $ionicon-var-gear-b; } +.#{$ionicons-prefix}grid:before { content: $ionicon-var-grid; } +.#{$ionicons-prefix}hammer:before { content: $ionicon-var-hammer; } +.#{$ionicons-prefix}happy:before { content: $ionicon-var-happy; } +.#{$ionicons-prefix}happy-outline:before { content: $ionicon-var-happy-outline; } +.#{$ionicons-prefix}headphone:before { content: $ionicon-var-headphone; } +.#{$ionicons-prefix}heart:before { content: $ionicon-var-heart; } +.#{$ionicons-prefix}heart-broken:before { content: $ionicon-var-heart-broken; } +.#{$ionicons-prefix}help:before { content: $ionicon-var-help; } +.#{$ionicons-prefix}help-buoy:before { content: $ionicon-var-help-buoy; } +.#{$ionicons-prefix}help-circled:before { content: $ionicon-var-help-circled; } +.#{$ionicons-prefix}home:before { content: $ionicon-var-home; } +.#{$ionicons-prefix}icecream:before { content: $ionicon-var-icecream; } +.#{$ionicons-prefix}image:before { content: $ionicon-var-image; } +.#{$ionicons-prefix}images:before { content: $ionicon-var-images; } +.#{$ionicons-prefix}information:before { content: $ionicon-var-information; } +.#{$ionicons-prefix}information-circled:before { content: $ionicon-var-information-circled; } +.#{$ionicons-prefix}ionic:before { content: $ionicon-var-ionic; } +.#{$ionicons-prefix}ios-alarm:before { content: $ionicon-var-ios-alarm; } +.#{$ionicons-prefix}ios-alarm-outline:before { content: $ionicon-var-ios-alarm-outline; } +.#{$ionicons-prefix}ios-albums:before { content: $ionicon-var-ios-albums; } +.#{$ionicons-prefix}ios-albums-outline:before { content: $ionicon-var-ios-albums-outline; } +.#{$ionicons-prefix}ios-americanfootball:before { content: $ionicon-var-ios-americanfootball; } +.#{$ionicons-prefix}ios-americanfootball-outline:before { content: $ionicon-var-ios-americanfootball-outline; } +.#{$ionicons-prefix}ios-analytics:before { content: $ionicon-var-ios-analytics; } +.#{$ionicons-prefix}ios-analytics-outline:before { content: $ionicon-var-ios-analytics-outline; } +.#{$ionicons-prefix}ios-arrow-back:before { content: $ionicon-var-ios-arrow-back; } +.#{$ionicons-prefix}ios-arrow-down:before { content: $ionicon-var-ios-arrow-down; } +.#{$ionicons-prefix}ios-arrow-forward:before { content: $ionicon-var-ios-arrow-forward; } +.#{$ionicons-prefix}ios-arrow-left:before { content: $ionicon-var-ios-arrow-left; } +.#{$ionicons-prefix}ios-arrow-right:before { content: $ionicon-var-ios-arrow-right; } +.#{$ionicons-prefix}ios-arrow-thin-down:before { content: $ionicon-var-ios-arrow-thin-down; } +.#{$ionicons-prefix}ios-arrow-thin-left:before { content: $ionicon-var-ios-arrow-thin-left; } +.#{$ionicons-prefix}ios-arrow-thin-right:before { content: $ionicon-var-ios-arrow-thin-right; } +.#{$ionicons-prefix}ios-arrow-thin-up:before { content: $ionicon-var-ios-arrow-thin-up; } +.#{$ionicons-prefix}ios-arrow-up:before { content: $ionicon-var-ios-arrow-up; } +.#{$ionicons-prefix}ios-at:before { content: $ionicon-var-ios-at; } +.#{$ionicons-prefix}ios-at-outline:before { content: $ionicon-var-ios-at-outline; } +.#{$ionicons-prefix}ios-barcode:before { content: $ionicon-var-ios-barcode; } +.#{$ionicons-prefix}ios-barcode-outline:before { content: $ionicon-var-ios-barcode-outline; } +.#{$ionicons-prefix}ios-baseball:before { content: $ionicon-var-ios-baseball; } +.#{$ionicons-prefix}ios-baseball-outline:before { content: $ionicon-var-ios-baseball-outline; } +.#{$ionicons-prefix}ios-basketball:before { content: $ionicon-var-ios-basketball; } +.#{$ionicons-prefix}ios-basketball-outline:before { content: $ionicon-var-ios-basketball-outline; } +.#{$ionicons-prefix}ios-bell:before { content: $ionicon-var-ios-bell; } +.#{$ionicons-prefix}ios-bell-outline:before { content: $ionicon-var-ios-bell-outline; } +.#{$ionicons-prefix}ios-body:before { content: $ionicon-var-ios-body; } +.#{$ionicons-prefix}ios-body-outline:before { content: $ionicon-var-ios-body-outline; } +.#{$ionicons-prefix}ios-bolt:before { content: $ionicon-var-ios-bolt; } +.#{$ionicons-prefix}ios-bolt-outline:before { content: $ionicon-var-ios-bolt-outline; } +.#{$ionicons-prefix}ios-book:before { content: $ionicon-var-ios-book; } +.#{$ionicons-prefix}ios-book-outline:before { content: $ionicon-var-ios-book-outline; } +.#{$ionicons-prefix}ios-bookmarks:before { content: $ionicon-var-ios-bookmarks; } +.#{$ionicons-prefix}ios-bookmarks-outline:before { content: $ionicon-var-ios-bookmarks-outline; } +.#{$ionicons-prefix}ios-box:before { content: $ionicon-var-ios-box; } +.#{$ionicons-prefix}ios-box-outline:before { content: $ionicon-var-ios-box-outline; } +.#{$ionicons-prefix}ios-briefcase:before { content: $ionicon-var-ios-briefcase; } +.#{$ionicons-prefix}ios-briefcase-outline:before { content: $ionicon-var-ios-briefcase-outline; } +.#{$ionicons-prefix}ios-browsers:before { content: $ionicon-var-ios-browsers; } +.#{$ionicons-prefix}ios-browsers-outline:before { content: $ionicon-var-ios-browsers-outline; } +.#{$ionicons-prefix}ios-calculator:before { content: $ionicon-var-ios-calculator; } +.#{$ionicons-prefix}ios-calculator-outline:before { content: $ionicon-var-ios-calculator-outline; } +.#{$ionicons-prefix}ios-calendar:before { content: $ionicon-var-ios-calendar; } +.#{$ionicons-prefix}ios-calendar-outline:before { content: $ionicon-var-ios-calendar-outline; } +.#{$ionicons-prefix}ios-camera:before { content: $ionicon-var-ios-camera; } +.#{$ionicons-prefix}ios-camera-outline:before { content: $ionicon-var-ios-camera-outline; } +.#{$ionicons-prefix}ios-cart:before { content: $ionicon-var-ios-cart; } +.#{$ionicons-prefix}ios-cart-outline:before { content: $ionicon-var-ios-cart-outline; } +.#{$ionicons-prefix}ios-chatboxes:before { content: $ionicon-var-ios-chatboxes; } +.#{$ionicons-prefix}ios-chatboxes-outline:before { content: $ionicon-var-ios-chatboxes-outline; } +.#{$ionicons-prefix}ios-chatbubble:before { content: $ionicon-var-ios-chatbubble; } +.#{$ionicons-prefix}ios-chatbubble-outline:before { content: $ionicon-var-ios-chatbubble-outline; } +.#{$ionicons-prefix}ios-checkmark:before { content: $ionicon-var-ios-checkmark; } +.#{$ionicons-prefix}ios-checkmark-empty:before { content: $ionicon-var-ios-checkmark-empty; } +.#{$ionicons-prefix}ios-checkmark-outline:before { content: $ionicon-var-ios-checkmark-outline; } +.#{$ionicons-prefix}ios-circle-filled:before { content: $ionicon-var-ios-circle-filled; } +.#{$ionicons-prefix}ios-circle-outline:before { content: $ionicon-var-ios-circle-outline; } +.#{$ionicons-prefix}ios-clock:before { content: $ionicon-var-ios-clock; } +.#{$ionicons-prefix}ios-clock-outline:before { content: $ionicon-var-ios-clock-outline; } +.#{$ionicons-prefix}ios-close:before { content: $ionicon-var-ios-close; } +.#{$ionicons-prefix}ios-close-empty:before { content: $ionicon-var-ios-close-empty; } +.#{$ionicons-prefix}ios-close-outline:before { content: $ionicon-var-ios-close-outline; } +.#{$ionicons-prefix}ios-cloud:before { content: $ionicon-var-ios-cloud; } +.#{$ionicons-prefix}ios-cloud-download:before { content: $ionicon-var-ios-cloud-download; } +.#{$ionicons-prefix}ios-cloud-download-outline:before { content: $ionicon-var-ios-cloud-download-outline; } +.#{$ionicons-prefix}ios-cloud-outline:before { content: $ionicon-var-ios-cloud-outline; } +.#{$ionicons-prefix}ios-cloud-upload:before { content: $ionicon-var-ios-cloud-upload; } +.#{$ionicons-prefix}ios-cloud-upload-outline:before { content: $ionicon-var-ios-cloud-upload-outline; } +.#{$ionicons-prefix}ios-cloudy:before { content: $ionicon-var-ios-cloudy; } +.#{$ionicons-prefix}ios-cloudy-night:before { content: $ionicon-var-ios-cloudy-night; } +.#{$ionicons-prefix}ios-cloudy-night-outline:before { content: $ionicon-var-ios-cloudy-night-outline; } +.#{$ionicons-prefix}ios-cloudy-outline:before { content: $ionicon-var-ios-cloudy-outline; } +.#{$ionicons-prefix}ios-cog:before { content: $ionicon-var-ios-cog; } +.#{$ionicons-prefix}ios-cog-outline:before { content: $ionicon-var-ios-cog-outline; } +.#{$ionicons-prefix}ios-color-filter:before { content: $ionicon-var-ios-color-filter; } +.#{$ionicons-prefix}ios-color-filter-outline:before { content: $ionicon-var-ios-color-filter-outline; } +.#{$ionicons-prefix}ios-color-wand:before { content: $ionicon-var-ios-color-wand; } +.#{$ionicons-prefix}ios-color-wand-outline:before { content: $ionicon-var-ios-color-wand-outline; } +.#{$ionicons-prefix}ios-compose:before { content: $ionicon-var-ios-compose; } +.#{$ionicons-prefix}ios-compose-outline:before { content: $ionicon-var-ios-compose-outline; } +.#{$ionicons-prefix}ios-contact:before { content: $ionicon-var-ios-contact; } +.#{$ionicons-prefix}ios-contact-outline:before { content: $ionicon-var-ios-contact-outline; } +.#{$ionicons-prefix}ios-copy:before { content: $ionicon-var-ios-copy; } +.#{$ionicons-prefix}ios-copy-outline:before { content: $ionicon-var-ios-copy-outline; } +.#{$ionicons-prefix}ios-crop:before { content: $ionicon-var-ios-crop; } +.#{$ionicons-prefix}ios-crop-strong:before { content: $ionicon-var-ios-crop-strong; } +.#{$ionicons-prefix}ios-download:before { content: $ionicon-var-ios-download; } +.#{$ionicons-prefix}ios-download-outline:before { content: $ionicon-var-ios-download-outline; } +.#{$ionicons-prefix}ios-drag:before { content: $ionicon-var-ios-drag; } +.#{$ionicons-prefix}ios-email:before { content: $ionicon-var-ios-email; } +.#{$ionicons-prefix}ios-email-outline:before { content: $ionicon-var-ios-email-outline; } +.#{$ionicons-prefix}ios-eye:before { content: $ionicon-var-ios-eye; } +.#{$ionicons-prefix}ios-eye-outline:before { content: $ionicon-var-ios-eye-outline; } +.#{$ionicons-prefix}ios-fastforward:before { content: $ionicon-var-ios-fastforward; } +.#{$ionicons-prefix}ios-fastforward-outline:before { content: $ionicon-var-ios-fastforward-outline; } +.#{$ionicons-prefix}ios-filing:before { content: $ionicon-var-ios-filing; } +.#{$ionicons-prefix}ios-filing-outline:before { content: $ionicon-var-ios-filing-outline; } +.#{$ionicons-prefix}ios-film:before { content: $ionicon-var-ios-film; } +.#{$ionicons-prefix}ios-film-outline:before { content: $ionicon-var-ios-film-outline; } +.#{$ionicons-prefix}ios-flag:before { content: $ionicon-var-ios-flag; } +.#{$ionicons-prefix}ios-flag-outline:before { content: $ionicon-var-ios-flag-outline; } +.#{$ionicons-prefix}ios-flame:before { content: $ionicon-var-ios-flame; } +.#{$ionicons-prefix}ios-flame-outline:before { content: $ionicon-var-ios-flame-outline; } +.#{$ionicons-prefix}ios-flask:before { content: $ionicon-var-ios-flask; } +.#{$ionicons-prefix}ios-flask-outline:before { content: $ionicon-var-ios-flask-outline; } +.#{$ionicons-prefix}ios-flower:before { content: $ionicon-var-ios-flower; } +.#{$ionicons-prefix}ios-flower-outline:before { content: $ionicon-var-ios-flower-outline; } +.#{$ionicons-prefix}ios-folder:before { content: $ionicon-var-ios-folder; } +.#{$ionicons-prefix}ios-folder-outline:before { content: $ionicon-var-ios-folder-outline; } +.#{$ionicons-prefix}ios-football:before { content: $ionicon-var-ios-football; } +.#{$ionicons-prefix}ios-football-outline:before { content: $ionicon-var-ios-football-outline; } +.#{$ionicons-prefix}ios-game-controller-a:before { content: $ionicon-var-ios-game-controller-a; } +.#{$ionicons-prefix}ios-game-controller-a-outline:before { content: $ionicon-var-ios-game-controller-a-outline; } +.#{$ionicons-prefix}ios-game-controller-b:before { content: $ionicon-var-ios-game-controller-b; } +.#{$ionicons-prefix}ios-game-controller-b-outline:before { content: $ionicon-var-ios-game-controller-b-outline; } +.#{$ionicons-prefix}ios-gear:before { content: $ionicon-var-ios-gear; } +.#{$ionicons-prefix}ios-gear-outline:before { content: $ionicon-var-ios-gear-outline; } +.#{$ionicons-prefix}ios-glasses:before { content: $ionicon-var-ios-glasses; } +.#{$ionicons-prefix}ios-glasses-outline:before { content: $ionicon-var-ios-glasses-outline; } +.#{$ionicons-prefix}ios-grid-view:before { content: $ionicon-var-ios-grid-view; } +.#{$ionicons-prefix}ios-grid-view-outline:before { content: $ionicon-var-ios-grid-view-outline; } +.#{$ionicons-prefix}ios-heart:before { content: $ionicon-var-ios-heart; } +.#{$ionicons-prefix}ios-heart-outline:before { content: $ionicon-var-ios-heart-outline; } +.#{$ionicons-prefix}ios-help:before { content: $ionicon-var-ios-help; } +.#{$ionicons-prefix}ios-help-empty:before { content: $ionicon-var-ios-help-empty; } +.#{$ionicons-prefix}ios-help-outline:before { content: $ionicon-var-ios-help-outline; } +.#{$ionicons-prefix}ios-home:before { content: $ionicon-var-ios-home; } +.#{$ionicons-prefix}ios-home-outline:before { content: $ionicon-var-ios-home-outline; } +.#{$ionicons-prefix}ios-infinite:before { content: $ionicon-var-ios-infinite; } +.#{$ionicons-prefix}ios-infinite-outline:before { content: $ionicon-var-ios-infinite-outline; } +.#{$ionicons-prefix}ios-information:before { content: $ionicon-var-ios-information; } +.#{$ionicons-prefix}ios-information-empty:before { content: $ionicon-var-ios-information-empty; } +.#{$ionicons-prefix}ios-information-outline:before { content: $ionicon-var-ios-information-outline; } +.#{$ionicons-prefix}ios-ionic-outline:before { content: $ionicon-var-ios-ionic-outline; } +.#{$ionicons-prefix}ios-keypad:before { content: $ionicon-var-ios-keypad; } +.#{$ionicons-prefix}ios-keypad-outline:before { content: $ionicon-var-ios-keypad-outline; } +.#{$ionicons-prefix}ios-lightbulb:before { content: $ionicon-var-ios-lightbulb; } +.#{$ionicons-prefix}ios-lightbulb-outline:before { content: $ionicon-var-ios-lightbulb-outline; } +.#{$ionicons-prefix}ios-list:before { content: $ionicon-var-ios-list; } +.#{$ionicons-prefix}ios-list-outline:before { content: $ionicon-var-ios-list-outline; } +.#{$ionicons-prefix}ios-location:before { content: $ionicon-var-ios-location; } +.#{$ionicons-prefix}ios-location-outline:before { content: $ionicon-var-ios-location-outline; } +.#{$ionicons-prefix}ios-locked:before { content: $ionicon-var-ios-locked; } +.#{$ionicons-prefix}ios-locked-outline:before { content: $ionicon-var-ios-locked-outline; } +.#{$ionicons-prefix}ios-loop:before { content: $ionicon-var-ios-loop; } +.#{$ionicons-prefix}ios-loop-strong:before { content: $ionicon-var-ios-loop-strong; } +.#{$ionicons-prefix}ios-medical:before { content: $ionicon-var-ios-medical; } +.#{$ionicons-prefix}ios-medical-outline:before { content: $ionicon-var-ios-medical-outline; } +.#{$ionicons-prefix}ios-medkit:before { content: $ionicon-var-ios-medkit; } +.#{$ionicons-prefix}ios-medkit-outline:before { content: $ionicon-var-ios-medkit-outline; } +.#{$ionicons-prefix}ios-mic:before { content: $ionicon-var-ios-mic; } +.#{$ionicons-prefix}ios-mic-off:before { content: $ionicon-var-ios-mic-off; } +.#{$ionicons-prefix}ios-mic-outline:before { content: $ionicon-var-ios-mic-outline; } +.#{$ionicons-prefix}ios-minus:before { content: $ionicon-var-ios-minus; } +.#{$ionicons-prefix}ios-minus-empty:before { content: $ionicon-var-ios-minus-empty; } +.#{$ionicons-prefix}ios-minus-outline:before { content: $ionicon-var-ios-minus-outline; } +.#{$ionicons-prefix}ios-monitor:before { content: $ionicon-var-ios-monitor; } +.#{$ionicons-prefix}ios-monitor-outline:before { content: $ionicon-var-ios-monitor-outline; } +.#{$ionicons-prefix}ios-moon:before { content: $ionicon-var-ios-moon; } +.#{$ionicons-prefix}ios-moon-outline:before { content: $ionicon-var-ios-moon-outline; } +.#{$ionicons-prefix}ios-more:before { content: $ionicon-var-ios-more; } +.#{$ionicons-prefix}ios-more-outline:before { content: $ionicon-var-ios-more-outline; } +.#{$ionicons-prefix}ios-musical-note:before { content: $ionicon-var-ios-musical-note; } +.#{$ionicons-prefix}ios-musical-notes:before { content: $ionicon-var-ios-musical-notes; } +.#{$ionicons-prefix}ios-navigate:before { content: $ionicon-var-ios-navigate; } +.#{$ionicons-prefix}ios-navigate-outline:before { content: $ionicon-var-ios-navigate-outline; } +.#{$ionicons-prefix}ios-nutrition:before { content: $ionicon-var-ios-nutrition; } +.#{$ionicons-prefix}ios-nutrition-outline:before { content: $ionicon-var-ios-nutrition-outline; } +.#{$ionicons-prefix}ios-paper:before { content: $ionicon-var-ios-paper; } +.#{$ionicons-prefix}ios-paper-outline:before { content: $ionicon-var-ios-paper-outline; } +.#{$ionicons-prefix}ios-paperplane:before { content: $ionicon-var-ios-paperplane; } +.#{$ionicons-prefix}ios-paperplane-outline:before { content: $ionicon-var-ios-paperplane-outline; } +.#{$ionicons-prefix}ios-partlysunny:before { content: $ionicon-var-ios-partlysunny; } +.#{$ionicons-prefix}ios-partlysunny-outline:before { content: $ionicon-var-ios-partlysunny-outline; } +.#{$ionicons-prefix}ios-pause:before { content: $ionicon-var-ios-pause; } +.#{$ionicons-prefix}ios-pause-outline:before { content: $ionicon-var-ios-pause-outline; } +.#{$ionicons-prefix}ios-paw:before { content: $ionicon-var-ios-paw; } +.#{$ionicons-prefix}ios-paw-outline:before { content: $ionicon-var-ios-paw-outline; } +.#{$ionicons-prefix}ios-people:before { content: $ionicon-var-ios-people; } +.#{$ionicons-prefix}ios-people-outline:before { content: $ionicon-var-ios-people-outline; } +.#{$ionicons-prefix}ios-person:before { content: $ionicon-var-ios-person; } +.#{$ionicons-prefix}ios-person-outline:before { content: $ionicon-var-ios-person-outline; } +.#{$ionicons-prefix}ios-personadd:before { content: $ionicon-var-ios-personadd; } +.#{$ionicons-prefix}ios-personadd-outline:before { content: $ionicon-var-ios-personadd-outline; } +.#{$ionicons-prefix}ios-photos:before { content: $ionicon-var-ios-photos; } +.#{$ionicons-prefix}ios-photos-outline:before { content: $ionicon-var-ios-photos-outline; } +.#{$ionicons-prefix}ios-pie:before { content: $ionicon-var-ios-pie; } +.#{$ionicons-prefix}ios-pie-outline:before { content: $ionicon-var-ios-pie-outline; } +.#{$ionicons-prefix}ios-pint:before { content: $ionicon-var-ios-pint; } +.#{$ionicons-prefix}ios-pint-outline:before { content: $ionicon-var-ios-pint-outline; } +.#{$ionicons-prefix}ios-play:before { content: $ionicon-var-ios-play; } +.#{$ionicons-prefix}ios-play-outline:before { content: $ionicon-var-ios-play-outline; } +.#{$ionicons-prefix}ios-plus:before { content: $ionicon-var-ios-plus; } +.#{$ionicons-prefix}ios-plus-empty:before { content: $ionicon-var-ios-plus-empty; } +.#{$ionicons-prefix}ios-plus-outline:before { content: $ionicon-var-ios-plus-outline; } +.#{$ionicons-prefix}ios-pricetag:before { content: $ionicon-var-ios-pricetag; } +.#{$ionicons-prefix}ios-pricetag-outline:before { content: $ionicon-var-ios-pricetag-outline; } +.#{$ionicons-prefix}ios-pricetags:before { content: $ionicon-var-ios-pricetags; } +.#{$ionicons-prefix}ios-pricetags-outline:before { content: $ionicon-var-ios-pricetags-outline; } +.#{$ionicons-prefix}ios-printer:before { content: $ionicon-var-ios-printer; } +.#{$ionicons-prefix}ios-printer-outline:before { content: $ionicon-var-ios-printer-outline; } +.#{$ionicons-prefix}ios-pulse:before { content: $ionicon-var-ios-pulse; } +.#{$ionicons-prefix}ios-pulse-strong:before { content: $ionicon-var-ios-pulse-strong; } +.#{$ionicons-prefix}ios-rainy:before { content: $ionicon-var-ios-rainy; } +.#{$ionicons-prefix}ios-rainy-outline:before { content: $ionicon-var-ios-rainy-outline; } +.#{$ionicons-prefix}ios-recording:before { content: $ionicon-var-ios-recording; } +.#{$ionicons-prefix}ios-recording-outline:before { content: $ionicon-var-ios-recording-outline; } +.#{$ionicons-prefix}ios-redo:before { content: $ionicon-var-ios-redo; } +.#{$ionicons-prefix}ios-redo-outline:before { content: $ionicon-var-ios-redo-outline; } +.#{$ionicons-prefix}ios-refresh:before { content: $ionicon-var-ios-refresh; } +.#{$ionicons-prefix}ios-refresh-empty:before { content: $ionicon-var-ios-refresh-empty; } +.#{$ionicons-prefix}ios-refresh-outline:before { content: $ionicon-var-ios-refresh-outline; } +.#{$ionicons-prefix}ios-reload:before { content: $ionicon-var-ios-reload; } +.#{$ionicons-prefix}ios-reverse-camera:before { content: $ionicon-var-ios-reverse-camera; } +.#{$ionicons-prefix}ios-reverse-camera-outline:before { content: $ionicon-var-ios-reverse-camera-outline; } +.#{$ionicons-prefix}ios-rewind:before { content: $ionicon-var-ios-rewind; } +.#{$ionicons-prefix}ios-rewind-outline:before { content: $ionicon-var-ios-rewind-outline; } +.#{$ionicons-prefix}ios-rose:before { content: $ionicon-var-ios-rose; } +.#{$ionicons-prefix}ios-rose-outline:before { content: $ionicon-var-ios-rose-outline; } +.#{$ionicons-prefix}ios-search:before { content: $ionicon-var-ios-search; } +.#{$ionicons-prefix}ios-search-strong:before { content: $ionicon-var-ios-search-strong; } +.#{$ionicons-prefix}ios-settings:before { content: $ionicon-var-ios-settings; } +.#{$ionicons-prefix}ios-settings-strong:before { content: $ionicon-var-ios-settings-strong; } +.#{$ionicons-prefix}ios-shuffle:before { content: $ionicon-var-ios-shuffle; } +.#{$ionicons-prefix}ios-shuffle-strong:before { content: $ionicon-var-ios-shuffle-strong; } +.#{$ionicons-prefix}ios-skipbackward:before { content: $ionicon-var-ios-skipbackward; } +.#{$ionicons-prefix}ios-skipbackward-outline:before { content: $ionicon-var-ios-skipbackward-outline; } +.#{$ionicons-prefix}ios-skipforward:before { content: $ionicon-var-ios-skipforward; } +.#{$ionicons-prefix}ios-skipforward-outline:before { content: $ionicon-var-ios-skipforward-outline; } +.#{$ionicons-prefix}ios-snowy:before { content: $ionicon-var-ios-snowy; } +.#{$ionicons-prefix}ios-speedometer:before { content: $ionicon-var-ios-speedometer; } +.#{$ionicons-prefix}ios-speedometer-outline:before { content: $ionicon-var-ios-speedometer-outline; } +.#{$ionicons-prefix}ios-star:before { content: $ionicon-var-ios-star; } +.#{$ionicons-prefix}ios-star-half:before { content: $ionicon-var-ios-star-half; } +.#{$ionicons-prefix}ios-star-outline:before { content: $ionicon-var-ios-star-outline; } +.#{$ionicons-prefix}ios-stopwatch:before { content: $ionicon-var-ios-stopwatch; } +.#{$ionicons-prefix}ios-stopwatch-outline:before { content: $ionicon-var-ios-stopwatch-outline; } +.#{$ionicons-prefix}ios-sunny:before { content: $ionicon-var-ios-sunny; } +.#{$ionicons-prefix}ios-sunny-outline:before { content: $ionicon-var-ios-sunny-outline; } +.#{$ionicons-prefix}ios-telephone:before { content: $ionicon-var-ios-telephone; } +.#{$ionicons-prefix}ios-telephone-outline:before { content: $ionicon-var-ios-telephone-outline; } +.#{$ionicons-prefix}ios-tennisball:before { content: $ionicon-var-ios-tennisball; } +.#{$ionicons-prefix}ios-tennisball-outline:before { content: $ionicon-var-ios-tennisball-outline; } +.#{$ionicons-prefix}ios-thunderstorm:before { content: $ionicon-var-ios-thunderstorm; } +.#{$ionicons-prefix}ios-thunderstorm-outline:before { content: $ionicon-var-ios-thunderstorm-outline; } +.#{$ionicons-prefix}ios-time:before { content: $ionicon-var-ios-time; } +.#{$ionicons-prefix}ios-time-outline:before { content: $ionicon-var-ios-time-outline; } +.#{$ionicons-prefix}ios-timer:before { content: $ionicon-var-ios-timer; } +.#{$ionicons-prefix}ios-timer-outline:before { content: $ionicon-var-ios-timer-outline; } +.#{$ionicons-prefix}ios-toggle:before { content: $ionicon-var-ios-toggle; } +.#{$ionicons-prefix}ios-toggle-outline:before { content: $ionicon-var-ios-toggle-outline; } +.#{$ionicons-prefix}ios-trash:before { content: $ionicon-var-ios-trash; } +.#{$ionicons-prefix}ios-trash-outline:before { content: $ionicon-var-ios-trash-outline; } +.#{$ionicons-prefix}ios-undo:before { content: $ionicon-var-ios-undo; } +.#{$ionicons-prefix}ios-undo-outline:before { content: $ionicon-var-ios-undo-outline; } +.#{$ionicons-prefix}ios-unlocked:before { content: $ionicon-var-ios-unlocked; } +.#{$ionicons-prefix}ios-unlocked-outline:before { content: $ionicon-var-ios-unlocked-outline; } +.#{$ionicons-prefix}ios-upload:before { content: $ionicon-var-ios-upload; } +.#{$ionicons-prefix}ios-upload-outline:before { content: $ionicon-var-ios-upload-outline; } +.#{$ionicons-prefix}ios-videocam:before { content: $ionicon-var-ios-videocam; } +.#{$ionicons-prefix}ios-videocam-outline:before { content: $ionicon-var-ios-videocam-outline; } +.#{$ionicons-prefix}ios-volume-high:before { content: $ionicon-var-ios-volume-high; } +.#{$ionicons-prefix}ios-volume-low:before { content: $ionicon-var-ios-volume-low; } +.#{$ionicons-prefix}ios-wineglass:before { content: $ionicon-var-ios-wineglass; } +.#{$ionicons-prefix}ios-wineglass-outline:before { content: $ionicon-var-ios-wineglass-outline; } +.#{$ionicons-prefix}ios-world:before { content: $ionicon-var-ios-world; } +.#{$ionicons-prefix}ios-world-outline:before { content: $ionicon-var-ios-world-outline; } +.#{$ionicons-prefix}ipad:before { content: $ionicon-var-ipad; } +.#{$ionicons-prefix}iphone:before { content: $ionicon-var-iphone; } +.#{$ionicons-prefix}ipod:before { content: $ionicon-var-ipod; } +.#{$ionicons-prefix}jet:before { content: $ionicon-var-jet; } +.#{$ionicons-prefix}key:before { content: $ionicon-var-key; } +.#{$ionicons-prefix}knife:before { content: $ionicon-var-knife; } +.#{$ionicons-prefix}laptop:before { content: $ionicon-var-laptop; } +.#{$ionicons-prefix}leaf:before { content: $ionicon-var-leaf; } +.#{$ionicons-prefix}levels:before { content: $ionicon-var-levels; } +.#{$ionicons-prefix}lightbulb:before { content: $ionicon-var-lightbulb; } +.#{$ionicons-prefix}link:before { content: $ionicon-var-link; } +.#{$ionicons-prefix}load-a:before { content: $ionicon-var-load-a; } +.#{$ionicons-prefix}load-b:before { content: $ionicon-var-load-b; } +.#{$ionicons-prefix}load-c:before { content: $ionicon-var-load-c; } +.#{$ionicons-prefix}load-d:before { content: $ionicon-var-load-d; } +.#{$ionicons-prefix}location:before { content: $ionicon-var-location; } +.#{$ionicons-prefix}lock-combination:before { content: $ionicon-var-lock-combination; } +.#{$ionicons-prefix}locked:before { content: $ionicon-var-locked; } +.#{$ionicons-prefix}log-in:before { content: $ionicon-var-log-in; } +.#{$ionicons-prefix}log-out:before { content: $ionicon-var-log-out; } +.#{$ionicons-prefix}loop:before { content: $ionicon-var-loop; } +.#{$ionicons-prefix}magnet:before { content: $ionicon-var-magnet; } +.#{$ionicons-prefix}male:before { content: $ionicon-var-male; } +.#{$ionicons-prefix}man:before { content: $ionicon-var-man; } +.#{$ionicons-prefix}map:before { content: $ionicon-var-map; } +.#{$ionicons-prefix}medkit:before { content: $ionicon-var-medkit; } +.#{$ionicons-prefix}merge:before { content: $ionicon-var-merge; } +.#{$ionicons-prefix}mic-a:before { content: $ionicon-var-mic-a; } +.#{$ionicons-prefix}mic-b:before { content: $ionicon-var-mic-b; } +.#{$ionicons-prefix}mic-c:before { content: $ionicon-var-mic-c; } +.#{$ionicons-prefix}minus:before { content: $ionicon-var-minus; } +.#{$ionicons-prefix}minus-circled:before { content: $ionicon-var-minus-circled; } +.#{$ionicons-prefix}minus-round:before { content: $ionicon-var-minus-round; } +.#{$ionicons-prefix}model-s:before { content: $ionicon-var-model-s; } +.#{$ionicons-prefix}monitor:before { content: $ionicon-var-monitor; } +.#{$ionicons-prefix}more:before { content: $ionicon-var-more; } +.#{$ionicons-prefix}mouse:before { content: $ionicon-var-mouse; } +.#{$ionicons-prefix}music-note:before { content: $ionicon-var-music-note; } +.#{$ionicons-prefix}navicon:before { content: $ionicon-var-navicon; } +.#{$ionicons-prefix}navicon-round:before { content: $ionicon-var-navicon-round; } +.#{$ionicons-prefix}navigate:before { content: $ionicon-var-navigate; } +.#{$ionicons-prefix}network:before { content: $ionicon-var-network; } +.#{$ionicons-prefix}no-smoking:before { content: $ionicon-var-no-smoking; } +.#{$ionicons-prefix}nuclear:before { content: $ionicon-var-nuclear; } +.#{$ionicons-prefix}outlet:before { content: $ionicon-var-outlet; } +.#{$ionicons-prefix}paintbrush:before { content: $ionicon-var-paintbrush; } +.#{$ionicons-prefix}paintbucket:before { content: $ionicon-var-paintbucket; } +.#{$ionicons-prefix}paper-airplane:before { content: $ionicon-var-paper-airplane; } +.#{$ionicons-prefix}paperclip:before { content: $ionicon-var-paperclip; } +.#{$ionicons-prefix}pause:before { content: $ionicon-var-pause; } +.#{$ionicons-prefix}person:before { content: $ionicon-var-person; } +.#{$ionicons-prefix}person-add:before { content: $ionicon-var-person-add; } +.#{$ionicons-prefix}person-stalker:before { content: $ionicon-var-person-stalker; } +.#{$ionicons-prefix}pie-graph:before { content: $ionicon-var-pie-graph; } +.#{$ionicons-prefix}pin:before { content: $ionicon-var-pin; } +.#{$ionicons-prefix}pinpoint:before { content: $ionicon-var-pinpoint; } +.#{$ionicons-prefix}pizza:before { content: $ionicon-var-pizza; } +.#{$ionicons-prefix}plane:before { content: $ionicon-var-plane; } +.#{$ionicons-prefix}planet:before { content: $ionicon-var-planet; } +.#{$ionicons-prefix}play:before { content: $ionicon-var-play; } +.#{$ionicons-prefix}playstation:before { content: $ionicon-var-playstation; } +.#{$ionicons-prefix}plus:before { content: $ionicon-var-plus; } +.#{$ionicons-prefix}plus-circled:before { content: $ionicon-var-plus-circled; } +.#{$ionicons-prefix}plus-round:before { content: $ionicon-var-plus-round; } +.#{$ionicons-prefix}podium:before { content: $ionicon-var-podium; } +.#{$ionicons-prefix}pound:before { content: $ionicon-var-pound; } +.#{$ionicons-prefix}power:before { content: $ionicon-var-power; } +.#{$ionicons-prefix}pricetag:before { content: $ionicon-var-pricetag; } +.#{$ionicons-prefix}pricetags:before { content: $ionicon-var-pricetags; } +.#{$ionicons-prefix}printer:before { content: $ionicon-var-printer; } +.#{$ionicons-prefix}pull-request:before { content: $ionicon-var-pull-request; } +.#{$ionicons-prefix}qr-scanner:before { content: $ionicon-var-qr-scanner; } +.#{$ionicons-prefix}quote:before { content: $ionicon-var-quote; } +.#{$ionicons-prefix}radio-waves:before { content: $ionicon-var-radio-waves; } +.#{$ionicons-prefix}record:before { content: $ionicon-var-record; } +.#{$ionicons-prefix}refresh:before { content: $ionicon-var-refresh; } +.#{$ionicons-prefix}reply:before { content: $ionicon-var-reply; } +.#{$ionicons-prefix}reply-all:before { content: $ionicon-var-reply-all; } +.#{$ionicons-prefix}ribbon-a:before { content: $ionicon-var-ribbon-a; } +.#{$ionicons-prefix}ribbon-b:before { content: $ionicon-var-ribbon-b; } +.#{$ionicons-prefix}sad:before { content: $ionicon-var-sad; } +.#{$ionicons-prefix}sad-outline:before { content: $ionicon-var-sad-outline; } +.#{$ionicons-prefix}scissors:before { content: $ionicon-var-scissors; } +.#{$ionicons-prefix}search:before { content: $ionicon-var-search; } +.#{$ionicons-prefix}settings:before { content: $ionicon-var-settings; } +.#{$ionicons-prefix}share:before { content: $ionicon-var-share; } +.#{$ionicons-prefix}shuffle:before { content: $ionicon-var-shuffle; } +.#{$ionicons-prefix}skip-backward:before { content: $ionicon-var-skip-backward; } +.#{$ionicons-prefix}skip-forward:before { content: $ionicon-var-skip-forward; } +.#{$ionicons-prefix}social-android:before { content: $ionicon-var-social-android; } +.#{$ionicons-prefix}social-android-outline:before { content: $ionicon-var-social-android-outline; } +.#{$ionicons-prefix}social-angular:before { content: $ionicon-var-social-angular; } +.#{$ionicons-prefix}social-angular-outline:before { content: $ionicon-var-social-angular-outline; } +.#{$ionicons-prefix}social-apple:before { content: $ionicon-var-social-apple; } +.#{$ionicons-prefix}social-apple-outline:before { content: $ionicon-var-social-apple-outline; } +.#{$ionicons-prefix}social-bitcoin:before { content: $ionicon-var-social-bitcoin; } +.#{$ionicons-prefix}social-bitcoin-outline:before { content: $ionicon-var-social-bitcoin-outline; } +.#{$ionicons-prefix}social-buffer:before { content: $ionicon-var-social-buffer; } +.#{$ionicons-prefix}social-buffer-outline:before { content: $ionicon-var-social-buffer-outline; } +.#{$ionicons-prefix}social-chrome:before { content: $ionicon-var-social-chrome; } +.#{$ionicons-prefix}social-chrome-outline:before { content: $ionicon-var-social-chrome-outline; } +.#{$ionicons-prefix}social-codepen:before { content: $ionicon-var-social-codepen; } +.#{$ionicons-prefix}social-codepen-outline:before { content: $ionicon-var-social-codepen-outline; } +.#{$ionicons-prefix}social-css3:before { content: $ionicon-var-social-css3; } +.#{$ionicons-prefix}social-css3-outline:before { content: $ionicon-var-social-css3-outline; } +.#{$ionicons-prefix}social-designernews:before { content: $ionicon-var-social-designernews; } +.#{$ionicons-prefix}social-designernews-outline:before { content: $ionicon-var-social-designernews-outline; } +.#{$ionicons-prefix}social-dribbble:before { content: $ionicon-var-social-dribbble; } +.#{$ionicons-prefix}social-dribbble-outline:before { content: $ionicon-var-social-dribbble-outline; } +.#{$ionicons-prefix}social-dropbox:before { content: $ionicon-var-social-dropbox; } +.#{$ionicons-prefix}social-dropbox-outline:before { content: $ionicon-var-social-dropbox-outline; } +.#{$ionicons-prefix}social-euro:before { content: $ionicon-var-social-euro; } +.#{$ionicons-prefix}social-euro-outline:before { content: $ionicon-var-social-euro-outline; } +.#{$ionicons-prefix}social-facebook:before { content: $ionicon-var-social-facebook; } +.#{$ionicons-prefix}social-facebook-outline:before { content: $ionicon-var-social-facebook-outline; } +.#{$ionicons-prefix}social-foursquare:before { content: $ionicon-var-social-foursquare; } +.#{$ionicons-prefix}social-foursquare-outline:before { content: $ionicon-var-social-foursquare-outline; } +.#{$ionicons-prefix}social-freebsd-devil:before { content: $ionicon-var-social-freebsd-devil; } +.#{$ionicons-prefix}social-github:before { content: $ionicon-var-social-github; } +.#{$ionicons-prefix}social-github-outline:before { content: $ionicon-var-social-github-outline; } +.#{$ionicons-prefix}social-google:before { content: $ionicon-var-social-google; } +.#{$ionicons-prefix}social-google-outline:before { content: $ionicon-var-social-google-outline; } +.#{$ionicons-prefix}social-googleplus:before { content: $ionicon-var-social-googleplus; } +.#{$ionicons-prefix}social-googleplus-outline:before { content: $ionicon-var-social-googleplus-outline; } +.#{$ionicons-prefix}social-hackernews:before { content: $ionicon-var-social-hackernews; } +.#{$ionicons-prefix}social-hackernews-outline:before { content: $ionicon-var-social-hackernews-outline; } +.#{$ionicons-prefix}social-html5:before { content: $ionicon-var-social-html5; } +.#{$ionicons-prefix}social-html5-outline:before { content: $ionicon-var-social-html5-outline; } +.#{$ionicons-prefix}social-instagram:before { content: $ionicon-var-social-instagram; } +.#{$ionicons-prefix}social-instagram-outline:before { content: $ionicon-var-social-instagram-outline; } +.#{$ionicons-prefix}social-javascript:before { content: $ionicon-var-social-javascript; } +.#{$ionicons-prefix}social-javascript-outline:before { content: $ionicon-var-social-javascript-outline; } +.#{$ionicons-prefix}social-linkedin:before { content: $ionicon-var-social-linkedin; } +.#{$ionicons-prefix}social-linkedin-outline:before { content: $ionicon-var-social-linkedin-outline; } +.#{$ionicons-prefix}social-markdown:before { content: $ionicon-var-social-markdown; } +.#{$ionicons-prefix}social-nodejs:before { content: $ionicon-var-social-nodejs; } +.#{$ionicons-prefix}social-octocat:before { content: $ionicon-var-social-octocat; } +.#{$ionicons-prefix}social-pinterest:before { content: $ionicon-var-social-pinterest; } +.#{$ionicons-prefix}social-pinterest-outline:before { content: $ionicon-var-social-pinterest-outline; } +.#{$ionicons-prefix}social-python:before { content: $ionicon-var-social-python; } +.#{$ionicons-prefix}social-reddit:before { content: $ionicon-var-social-reddit; } +.#{$ionicons-prefix}social-reddit-outline:before { content: $ionicon-var-social-reddit-outline; } +.#{$ionicons-prefix}social-rss:before { content: $ionicon-var-social-rss; } +.#{$ionicons-prefix}social-rss-outline:before { content: $ionicon-var-social-rss-outline; } +.#{$ionicons-prefix}social-sass:before { content: $ionicon-var-social-sass; } +.#{$ionicons-prefix}social-skype:before { content: $ionicon-var-social-skype; } +.#{$ionicons-prefix}social-skype-outline:before { content: $ionicon-var-social-skype-outline; } +.#{$ionicons-prefix}social-snapchat:before { content: $ionicon-var-social-snapchat; } +.#{$ionicons-prefix}social-snapchat-outline:before { content: $ionicon-var-social-snapchat-outline; } +.#{$ionicons-prefix}social-tumblr:before { content: $ionicon-var-social-tumblr; } +.#{$ionicons-prefix}social-tumblr-outline:before { content: $ionicon-var-social-tumblr-outline; } +.#{$ionicons-prefix}social-tux:before { content: $ionicon-var-social-tux; } +.#{$ionicons-prefix}social-twitch:before { content: $ionicon-var-social-twitch; } +.#{$ionicons-prefix}social-twitch-outline:before { content: $ionicon-var-social-twitch-outline; } +.#{$ionicons-prefix}social-twitter:before { content: $ionicon-var-social-twitter; } +.#{$ionicons-prefix}social-twitter-outline:before { content: $ionicon-var-social-twitter-outline; } +.#{$ionicons-prefix}social-usd:before { content: $ionicon-var-social-usd; } +.#{$ionicons-prefix}social-usd-outline:before { content: $ionicon-var-social-usd-outline; } +.#{$ionicons-prefix}social-vimeo:before { content: $ionicon-var-social-vimeo; } +.#{$ionicons-prefix}social-vimeo-outline:before { content: $ionicon-var-social-vimeo-outline; } +.#{$ionicons-prefix}social-whatsapp:before { content: $ionicon-var-social-whatsapp; } +.#{$ionicons-prefix}social-whatsapp-outline:before { content: $ionicon-var-social-whatsapp-outline; } +.#{$ionicons-prefix}social-windows:before { content: $ionicon-var-social-windows; } +.#{$ionicons-prefix}social-windows-outline:before { content: $ionicon-var-social-windows-outline; } +.#{$ionicons-prefix}social-wordpress:before { content: $ionicon-var-social-wordpress; } +.#{$ionicons-prefix}social-wordpress-outline:before { content: $ionicon-var-social-wordpress-outline; } +.#{$ionicons-prefix}social-yahoo:before { content: $ionicon-var-social-yahoo; } +.#{$ionicons-prefix}social-yahoo-outline:before { content: $ionicon-var-social-yahoo-outline; } +.#{$ionicons-prefix}social-yen:before { content: $ionicon-var-social-yen; } +.#{$ionicons-prefix}social-yen-outline:before { content: $ionicon-var-social-yen-outline; } +.#{$ionicons-prefix}social-youtube:before { content: $ionicon-var-social-youtube; } +.#{$ionicons-prefix}social-youtube-outline:before { content: $ionicon-var-social-youtube-outline; } +.#{$ionicons-prefix}soup-can:before { content: $ionicon-var-soup-can; } +.#{$ionicons-prefix}soup-can-outline:before { content: $ionicon-var-soup-can-outline; } +.#{$ionicons-prefix}speakerphone:before { content: $ionicon-var-speakerphone; } +.#{$ionicons-prefix}speedometer:before { content: $ionicon-var-speedometer; } +.#{$ionicons-prefix}spoon:before { content: $ionicon-var-spoon; } +.#{$ionicons-prefix}star:before { content: $ionicon-var-star; } +.#{$ionicons-prefix}stats-bars:before { content: $ionicon-var-stats-bars; } +.#{$ionicons-prefix}steam:before { content: $ionicon-var-steam; } +.#{$ionicons-prefix}stop:before { content: $ionicon-var-stop; } +.#{$ionicons-prefix}thermometer:before { content: $ionicon-var-thermometer; } +.#{$ionicons-prefix}thumbsdown:before { content: $ionicon-var-thumbsdown; } +.#{$ionicons-prefix}thumbsup:before { content: $ionicon-var-thumbsup; } +.#{$ionicons-prefix}toggle:before { content: $ionicon-var-toggle; } +.#{$ionicons-prefix}toggle-filled:before { content: $ionicon-var-toggle-filled; } +.#{$ionicons-prefix}transgender:before { content: $ionicon-var-transgender; } +.#{$ionicons-prefix}trash-a:before { content: $ionicon-var-trash-a; } +.#{$ionicons-prefix}trash-b:before { content: $ionicon-var-trash-b; } +.#{$ionicons-prefix}trophy:before { content: $ionicon-var-trophy; } +.#{$ionicons-prefix}tshirt:before { content: $ionicon-var-tshirt; } +.#{$ionicons-prefix}tshirt-outline:before { content: $ionicon-var-tshirt-outline; } +.#{$ionicons-prefix}umbrella:before { content: $ionicon-var-umbrella; } +.#{$ionicons-prefix}university:before { content: $ionicon-var-university; } +.#{$ionicons-prefix}unlocked:before { content: $ionicon-var-unlocked; } +.#{$ionicons-prefix}upload:before { content: $ionicon-var-upload; } +.#{$ionicons-prefix}usb:before { content: $ionicon-var-usb; } +.#{$ionicons-prefix}videocamera:before { content: $ionicon-var-videocamera; } +.#{$ionicons-prefix}volume-high:before { content: $ionicon-var-volume-high; } +.#{$ionicons-prefix}volume-low:before { content: $ionicon-var-volume-low; } +.#{$ionicons-prefix}volume-medium:before { content: $ionicon-var-volume-medium; } +.#{$ionicons-prefix}volume-mute:before { content: $ionicon-var-volume-mute; } +.#{$ionicons-prefix}wand:before { content: $ionicon-var-wand; } +.#{$ionicons-prefix}waterdrop:before { content: $ionicon-var-waterdrop; } +.#{$ionicons-prefix}wifi:before { content: $ionicon-var-wifi; } +.#{$ionicons-prefix}wineglass:before { content: $ionicon-var-wineglass; } +.#{$ionicons-prefix}woman:before { content: $ionicon-var-woman; } +.#{$ionicons-prefix}wrench:before { content: $ionicon-var-wrench; } +.#{$ionicons-prefix}xbox:before { content: $ionicon-var-xbox; }
\ No newline at end of file diff --git a/www/lib/ionic/scss/ionicons/_ionicons-variables.scss b/www/lib/ionic/scss/ionicons/_ionicons-variables.scss new file mode 100644 index 00000000..034a14a7 --- /dev/null +++ b/www/lib/ionic/scss/ionicons/_ionicons-variables.scss @@ -0,0 +1,741 @@ +// Ionicons Variables +// -------------------------- + +$ionicons-font-path: "../fonts" !default; +$ionicons-font-family: "Ionicons" !default; +$ionicons-version: "2.0.1" !default; +$ionicons-prefix: ion- !default; + +$ionicon-var-alert: "\f101"; +$ionicon-var-alert-circled: "\f100"; +$ionicon-var-android-add: "\f2c7"; +$ionicon-var-android-add-circle: "\f359"; +$ionicon-var-android-alarm-clock: "\f35a"; +$ionicon-var-android-alert: "\f35b"; +$ionicon-var-android-apps: "\f35c"; +$ionicon-var-android-archive: "\f2c9"; +$ionicon-var-android-arrow-back: "\f2ca"; +$ionicon-var-android-arrow-down: "\f35d"; +$ionicon-var-android-arrow-dropdown: "\f35f"; +$ionicon-var-android-arrow-dropdown-circle: "\f35e"; +$ionicon-var-android-arrow-dropleft: "\f361"; +$ionicon-var-android-arrow-dropleft-circle: "\f360"; +$ionicon-var-android-arrow-dropright: "\f363"; +$ionicon-var-android-arrow-dropright-circle: "\f362"; +$ionicon-var-android-arrow-dropup: "\f365"; +$ionicon-var-android-arrow-dropup-circle: "\f364"; +$ionicon-var-android-arrow-forward: "\f30f"; +$ionicon-var-android-arrow-up: "\f366"; +$ionicon-var-android-attach: "\f367"; +$ionicon-var-android-bar: "\f368"; +$ionicon-var-android-bicycle: "\f369"; +$ionicon-var-android-boat: "\f36a"; +$ionicon-var-android-bookmark: "\f36b"; +$ionicon-var-android-bulb: "\f36c"; +$ionicon-var-android-bus: "\f36d"; +$ionicon-var-android-calendar: "\f2d1"; +$ionicon-var-android-call: "\f2d2"; +$ionicon-var-android-camera: "\f2d3"; +$ionicon-var-android-cancel: "\f36e"; +$ionicon-var-android-car: "\f36f"; +$ionicon-var-android-cart: "\f370"; +$ionicon-var-android-chat: "\f2d4"; +$ionicon-var-android-checkbox: "\f374"; +$ionicon-var-android-checkbox-blank: "\f371"; +$ionicon-var-android-checkbox-outline: "\f373"; +$ionicon-var-android-checkbox-outline-blank: "\f372"; +$ionicon-var-android-checkmark-circle: "\f375"; +$ionicon-var-android-clipboard: "\f376"; +$ionicon-var-android-close: "\f2d7"; +$ionicon-var-android-cloud: "\f37a"; +$ionicon-var-android-cloud-circle: "\f377"; +$ionicon-var-android-cloud-done: "\f378"; +$ionicon-var-android-cloud-outline: "\f379"; +$ionicon-var-android-color-palette: "\f37b"; +$ionicon-var-android-compass: "\f37c"; +$ionicon-var-android-contact: "\f2d8"; +$ionicon-var-android-contacts: "\f2d9"; +$ionicon-var-android-contract: "\f37d"; +$ionicon-var-android-create: "\f37e"; +$ionicon-var-android-delete: "\f37f"; +$ionicon-var-android-desktop: "\f380"; +$ionicon-var-android-document: "\f381"; +$ionicon-var-android-done: "\f383"; +$ionicon-var-android-done-all: "\f382"; +$ionicon-var-android-download: "\f2dd"; +$ionicon-var-android-drafts: "\f384"; +$ionicon-var-android-exit: "\f385"; +$ionicon-var-android-expand: "\f386"; +$ionicon-var-android-favorite: "\f388"; +$ionicon-var-android-favorite-outline: "\f387"; +$ionicon-var-android-film: "\f389"; +$ionicon-var-android-folder: "\f2e0"; +$ionicon-var-android-folder-open: "\f38a"; +$ionicon-var-android-funnel: "\f38b"; +$ionicon-var-android-globe: "\f38c"; +$ionicon-var-android-hand: "\f2e3"; +$ionicon-var-android-hangout: "\f38d"; +$ionicon-var-android-happy: "\f38e"; +$ionicon-var-android-home: "\f38f"; +$ionicon-var-android-image: "\f2e4"; +$ionicon-var-android-laptop: "\f390"; +$ionicon-var-android-list: "\f391"; +$ionicon-var-android-locate: "\f2e9"; +$ionicon-var-android-lock: "\f392"; +$ionicon-var-android-mail: "\f2eb"; +$ionicon-var-android-map: "\f393"; +$ionicon-var-android-menu: "\f394"; +$ionicon-var-android-microphone: "\f2ec"; +$ionicon-var-android-microphone-off: "\f395"; +$ionicon-var-android-more-horizontal: "\f396"; +$ionicon-var-android-more-vertical: "\f397"; +$ionicon-var-android-navigate: "\f398"; +$ionicon-var-android-notifications: "\f39b"; +$ionicon-var-android-notifications-none: "\f399"; +$ionicon-var-android-notifications-off: "\f39a"; +$ionicon-var-android-open: "\f39c"; +$ionicon-var-android-options: "\f39d"; +$ionicon-var-android-people: "\f39e"; +$ionicon-var-android-person: "\f3a0"; +$ionicon-var-android-person-add: "\f39f"; +$ionicon-var-android-phone-landscape: "\f3a1"; +$ionicon-var-android-phone-portrait: "\f3a2"; +$ionicon-var-android-pin: "\f3a3"; +$ionicon-var-android-plane: "\f3a4"; +$ionicon-var-android-playstore: "\f2f0"; +$ionicon-var-android-print: "\f3a5"; +$ionicon-var-android-radio-button-off: "\f3a6"; +$ionicon-var-android-radio-button-on: "\f3a7"; +$ionicon-var-android-refresh: "\f3a8"; +$ionicon-var-android-remove: "\f2f4"; +$ionicon-var-android-remove-circle: "\f3a9"; +$ionicon-var-android-restaurant: "\f3aa"; +$ionicon-var-android-sad: "\f3ab"; +$ionicon-var-android-search: "\f2f5"; +$ionicon-var-android-send: "\f2f6"; +$ionicon-var-android-settings: "\f2f7"; +$ionicon-var-android-share: "\f2f8"; +$ionicon-var-android-share-alt: "\f3ac"; +$ionicon-var-android-star: "\f2fc"; +$ionicon-var-android-star-half: "\f3ad"; +$ionicon-var-android-star-outline: "\f3ae"; +$ionicon-var-android-stopwatch: "\f2fd"; +$ionicon-var-android-subway: "\f3af"; +$ionicon-var-android-sunny: "\f3b0"; +$ionicon-var-android-sync: "\f3b1"; +$ionicon-var-android-textsms: "\f3b2"; +$ionicon-var-android-time: "\f3b3"; +$ionicon-var-android-train: "\f3b4"; +$ionicon-var-android-unlock: "\f3b5"; +$ionicon-var-android-upload: "\f3b6"; +$ionicon-var-android-volume-down: "\f3b7"; +$ionicon-var-android-volume-mute: "\f3b8"; +$ionicon-var-android-volume-off: "\f3b9"; +$ionicon-var-android-volume-up: "\f3ba"; +$ionicon-var-android-walk: "\f3bb"; +$ionicon-var-android-warning: "\f3bc"; +$ionicon-var-android-watch: "\f3bd"; +$ionicon-var-android-wifi: "\f305"; +$ionicon-var-aperture: "\f313"; +$ionicon-var-archive: "\f102"; +$ionicon-var-arrow-down-a: "\f103"; +$ionicon-var-arrow-down-b: "\f104"; +$ionicon-var-arrow-down-c: "\f105"; +$ionicon-var-arrow-expand: "\f25e"; +$ionicon-var-arrow-graph-down-left: "\f25f"; +$ionicon-var-arrow-graph-down-right: "\f260"; +$ionicon-var-arrow-graph-up-left: "\f261"; +$ionicon-var-arrow-graph-up-right: "\f262"; +$ionicon-var-arrow-left-a: "\f106"; +$ionicon-var-arrow-left-b: "\f107"; +$ionicon-var-arrow-left-c: "\f108"; +$ionicon-var-arrow-move: "\f263"; +$ionicon-var-arrow-resize: "\f264"; +$ionicon-var-arrow-return-left: "\f265"; +$ionicon-var-arrow-return-right: "\f266"; +$ionicon-var-arrow-right-a: "\f109"; +$ionicon-var-arrow-right-b: "\f10a"; +$ionicon-var-arrow-right-c: "\f10b"; +$ionicon-var-arrow-shrink: "\f267"; +$ionicon-var-arrow-swap: "\f268"; +$ionicon-var-arrow-up-a: "\f10c"; +$ionicon-var-arrow-up-b: "\f10d"; +$ionicon-var-arrow-up-c: "\f10e"; +$ionicon-var-asterisk: "\f314"; +$ionicon-var-at: "\f10f"; +$ionicon-var-backspace: "\f3bf"; +$ionicon-var-backspace-outline: "\f3be"; +$ionicon-var-bag: "\f110"; +$ionicon-var-battery-charging: "\f111"; +$ionicon-var-battery-empty: "\f112"; +$ionicon-var-battery-full: "\f113"; +$ionicon-var-battery-half: "\f114"; +$ionicon-var-battery-low: "\f115"; +$ionicon-var-beaker: "\f269"; +$ionicon-var-beer: "\f26a"; +$ionicon-var-bluetooth: "\f116"; +$ionicon-var-bonfire: "\f315"; +$ionicon-var-bookmark: "\f26b"; +$ionicon-var-bowtie: "\f3c0"; +$ionicon-var-briefcase: "\f26c"; +$ionicon-var-bug: "\f2be"; +$ionicon-var-calculator: "\f26d"; +$ionicon-var-calendar: "\f117"; +$ionicon-var-camera: "\f118"; +$ionicon-var-card: "\f119"; +$ionicon-var-cash: "\f316"; +$ionicon-var-chatbox: "\f11b"; +$ionicon-var-chatbox-working: "\f11a"; +$ionicon-var-chatboxes: "\f11c"; +$ionicon-var-chatbubble: "\f11e"; +$ionicon-var-chatbubble-working: "\f11d"; +$ionicon-var-chatbubbles: "\f11f"; +$ionicon-var-checkmark: "\f122"; +$ionicon-var-checkmark-circled: "\f120"; +$ionicon-var-checkmark-round: "\f121"; +$ionicon-var-chevron-down: "\f123"; +$ionicon-var-chevron-left: "\f124"; +$ionicon-var-chevron-right: "\f125"; +$ionicon-var-chevron-up: "\f126"; +$ionicon-var-clipboard: "\f127"; +$ionicon-var-clock: "\f26e"; +$ionicon-var-close: "\f12a"; +$ionicon-var-close-circled: "\f128"; +$ionicon-var-close-round: "\f129"; +$ionicon-var-closed-captioning: "\f317"; +$ionicon-var-cloud: "\f12b"; +$ionicon-var-code: "\f271"; +$ionicon-var-code-download: "\f26f"; +$ionicon-var-code-working: "\f270"; +$ionicon-var-coffee: "\f272"; +$ionicon-var-compass: "\f273"; +$ionicon-var-compose: "\f12c"; +$ionicon-var-connection-bars: "\f274"; +$ionicon-var-contrast: "\f275"; +$ionicon-var-crop: "\f3c1"; +$ionicon-var-cube: "\f318"; +$ionicon-var-disc: "\f12d"; +$ionicon-var-document: "\f12f"; +$ionicon-var-document-text: "\f12e"; +$ionicon-var-drag: "\f130"; +$ionicon-var-earth: "\f276"; +$ionicon-var-easel: "\f3c2"; +$ionicon-var-edit: "\f2bf"; +$ionicon-var-egg: "\f277"; +$ionicon-var-eject: "\f131"; +$ionicon-var-email: "\f132"; +$ionicon-var-email-unread: "\f3c3"; +$ionicon-var-erlenmeyer-flask: "\f3c5"; +$ionicon-var-erlenmeyer-flask-bubbles: "\f3c4"; +$ionicon-var-eye: "\f133"; +$ionicon-var-eye-disabled: "\f306"; +$ionicon-var-female: "\f278"; +$ionicon-var-filing: "\f134"; +$ionicon-var-film-marker: "\f135"; +$ionicon-var-fireball: "\f319"; +$ionicon-var-flag: "\f279"; +$ionicon-var-flame: "\f31a"; +$ionicon-var-flash: "\f137"; +$ionicon-var-flash-off: "\f136"; +$ionicon-var-folder: "\f139"; +$ionicon-var-fork: "\f27a"; +$ionicon-var-fork-repo: "\f2c0"; +$ionicon-var-forward: "\f13a"; +$ionicon-var-funnel: "\f31b"; +$ionicon-var-gear-a: "\f13d"; +$ionicon-var-gear-b: "\f13e"; +$ionicon-var-grid: "\f13f"; +$ionicon-var-hammer: "\f27b"; +$ionicon-var-happy: "\f31c"; +$ionicon-var-happy-outline: "\f3c6"; +$ionicon-var-headphone: "\f140"; +$ionicon-var-heart: "\f141"; +$ionicon-var-heart-broken: "\f31d"; +$ionicon-var-help: "\f143"; +$ionicon-var-help-buoy: "\f27c"; +$ionicon-var-help-circled: "\f142"; +$ionicon-var-home: "\f144"; +$ionicon-var-icecream: "\f27d"; +$ionicon-var-image: "\f147"; +$ionicon-var-images: "\f148"; +$ionicon-var-information: "\f14a"; +$ionicon-var-information-circled: "\f149"; +$ionicon-var-ionic: "\f14b"; +$ionicon-var-ios-alarm: "\f3c8"; +$ionicon-var-ios-alarm-outline: "\f3c7"; +$ionicon-var-ios-albums: "\f3ca"; +$ionicon-var-ios-albums-outline: "\f3c9"; +$ionicon-var-ios-americanfootball: "\f3cc"; +$ionicon-var-ios-americanfootball-outline: "\f3cb"; +$ionicon-var-ios-analytics: "\f3ce"; +$ionicon-var-ios-analytics-outline: "\f3cd"; +$ionicon-var-ios-arrow-back: "\f3cf"; +$ionicon-var-ios-arrow-down: "\f3d0"; +$ionicon-var-ios-arrow-forward: "\f3d1"; +$ionicon-var-ios-arrow-left: "\f3d2"; +$ionicon-var-ios-arrow-right: "\f3d3"; +$ionicon-var-ios-arrow-thin-down: "\f3d4"; +$ionicon-var-ios-arrow-thin-left: "\f3d5"; +$ionicon-var-ios-arrow-thin-right: "\f3d6"; +$ionicon-var-ios-arrow-thin-up: "\f3d7"; +$ionicon-var-ios-arrow-up: "\f3d8"; +$ionicon-var-ios-at: "\f3da"; +$ionicon-var-ios-at-outline: "\f3d9"; +$ionicon-var-ios-barcode: "\f3dc"; +$ionicon-var-ios-barcode-outline: "\f3db"; +$ionicon-var-ios-baseball: "\f3de"; +$ionicon-var-ios-baseball-outline: "\f3dd"; +$ionicon-var-ios-basketball: "\f3e0"; +$ionicon-var-ios-basketball-outline: "\f3df"; +$ionicon-var-ios-bell: "\f3e2"; +$ionicon-var-ios-bell-outline: "\f3e1"; +$ionicon-var-ios-body: "\f3e4"; +$ionicon-var-ios-body-outline: "\f3e3"; +$ionicon-var-ios-bolt: "\f3e6"; +$ionicon-var-ios-bolt-outline: "\f3e5"; +$ionicon-var-ios-book: "\f3e8"; +$ionicon-var-ios-book-outline: "\f3e7"; +$ionicon-var-ios-bookmarks: "\f3ea"; +$ionicon-var-ios-bookmarks-outline: "\f3e9"; +$ionicon-var-ios-box: "\f3ec"; +$ionicon-var-ios-box-outline: "\f3eb"; +$ionicon-var-ios-briefcase: "\f3ee"; +$ionicon-var-ios-briefcase-outline: "\f3ed"; +$ionicon-var-ios-browsers: "\f3f0"; +$ionicon-var-ios-browsers-outline: "\f3ef"; +$ionicon-var-ios-calculator: "\f3f2"; +$ionicon-var-ios-calculator-outline: "\f3f1"; +$ionicon-var-ios-calendar: "\f3f4"; +$ionicon-var-ios-calendar-outline: "\f3f3"; +$ionicon-var-ios-camera: "\f3f6"; +$ionicon-var-ios-camera-outline: "\f3f5"; +$ionicon-var-ios-cart: "\f3f8"; +$ionicon-var-ios-cart-outline: "\f3f7"; +$ionicon-var-ios-chatboxes: "\f3fa"; +$ionicon-var-ios-chatboxes-outline: "\f3f9"; +$ionicon-var-ios-chatbubble: "\f3fc"; +$ionicon-var-ios-chatbubble-outline: "\f3fb"; +$ionicon-var-ios-checkmark: "\f3ff"; +$ionicon-var-ios-checkmark-empty: "\f3fd"; +$ionicon-var-ios-checkmark-outline: "\f3fe"; +$ionicon-var-ios-circle-filled: "\f400"; +$ionicon-var-ios-circle-outline: "\f401"; +$ionicon-var-ios-clock: "\f403"; +$ionicon-var-ios-clock-outline: "\f402"; +$ionicon-var-ios-close: "\f406"; +$ionicon-var-ios-close-empty: "\f404"; +$ionicon-var-ios-close-outline: "\f405"; +$ionicon-var-ios-cloud: "\f40c"; +$ionicon-var-ios-cloud-download: "\f408"; +$ionicon-var-ios-cloud-download-outline: "\f407"; +$ionicon-var-ios-cloud-outline: "\f409"; +$ionicon-var-ios-cloud-upload: "\f40b"; +$ionicon-var-ios-cloud-upload-outline: "\f40a"; +$ionicon-var-ios-cloudy: "\f410"; +$ionicon-var-ios-cloudy-night: "\f40e"; +$ionicon-var-ios-cloudy-night-outline: "\f40d"; +$ionicon-var-ios-cloudy-outline: "\f40f"; +$ionicon-var-ios-cog: "\f412"; +$ionicon-var-ios-cog-outline: "\f411"; +$ionicon-var-ios-color-filter: "\f414"; +$ionicon-var-ios-color-filter-outline: "\f413"; +$ionicon-var-ios-color-wand: "\f416"; +$ionicon-var-ios-color-wand-outline: "\f415"; +$ionicon-var-ios-compose: "\f418"; +$ionicon-var-ios-compose-outline: "\f417"; +$ionicon-var-ios-contact: "\f41a"; +$ionicon-var-ios-contact-outline: "\f419"; +$ionicon-var-ios-copy: "\f41c"; +$ionicon-var-ios-copy-outline: "\f41b"; +$ionicon-var-ios-crop: "\f41e"; +$ionicon-var-ios-crop-strong: "\f41d"; +$ionicon-var-ios-download: "\f420"; +$ionicon-var-ios-download-outline: "\f41f"; +$ionicon-var-ios-drag: "\f421"; +$ionicon-var-ios-email: "\f423"; +$ionicon-var-ios-email-outline: "\f422"; +$ionicon-var-ios-eye: "\f425"; +$ionicon-var-ios-eye-outline: "\f424"; +$ionicon-var-ios-fastforward: "\f427"; +$ionicon-var-ios-fastforward-outline: "\f426"; +$ionicon-var-ios-filing: "\f429"; +$ionicon-var-ios-filing-outline: "\f428"; +$ionicon-var-ios-film: "\f42b"; +$ionicon-var-ios-film-outline: "\f42a"; +$ionicon-var-ios-flag: "\f42d"; +$ionicon-var-ios-flag-outline: "\f42c"; +$ionicon-var-ios-flame: "\f42f"; +$ionicon-var-ios-flame-outline: "\f42e"; +$ionicon-var-ios-flask: "\f431"; +$ionicon-var-ios-flask-outline: "\f430"; +$ionicon-var-ios-flower: "\f433"; +$ionicon-var-ios-flower-outline: "\f432"; +$ionicon-var-ios-folder: "\f435"; +$ionicon-var-ios-folder-outline: "\f434"; +$ionicon-var-ios-football: "\f437"; +$ionicon-var-ios-football-outline: "\f436"; +$ionicon-var-ios-game-controller-a: "\f439"; +$ionicon-var-ios-game-controller-a-outline: "\f438"; +$ionicon-var-ios-game-controller-b: "\f43b"; +$ionicon-var-ios-game-controller-b-outline: "\f43a"; +$ionicon-var-ios-gear: "\f43d"; +$ionicon-var-ios-gear-outline: "\f43c"; +$ionicon-var-ios-glasses: "\f43f"; +$ionicon-var-ios-glasses-outline: "\f43e"; +$ionicon-var-ios-grid-view: "\f441"; +$ionicon-var-ios-grid-view-outline: "\f440"; +$ionicon-var-ios-heart: "\f443"; +$ionicon-var-ios-heart-outline: "\f442"; +$ionicon-var-ios-help: "\f446"; +$ionicon-var-ios-help-empty: "\f444"; +$ionicon-var-ios-help-outline: "\f445"; +$ionicon-var-ios-home: "\f448"; +$ionicon-var-ios-home-outline: "\f447"; +$ionicon-var-ios-infinite: "\f44a"; +$ionicon-var-ios-infinite-outline: "\f449"; +$ionicon-var-ios-information: "\f44d"; +$ionicon-var-ios-information-empty: "\f44b"; +$ionicon-var-ios-information-outline: "\f44c"; +$ionicon-var-ios-ionic-outline: "\f44e"; +$ionicon-var-ios-keypad: "\f450"; +$ionicon-var-ios-keypad-outline: "\f44f"; +$ionicon-var-ios-lightbulb: "\f452"; +$ionicon-var-ios-lightbulb-outline: "\f451"; +$ionicon-var-ios-list: "\f454"; +$ionicon-var-ios-list-outline: "\f453"; +$ionicon-var-ios-location: "\f456"; +$ionicon-var-ios-location-outline: "\f455"; +$ionicon-var-ios-locked: "\f458"; +$ionicon-var-ios-locked-outline: "\f457"; +$ionicon-var-ios-loop: "\f45a"; +$ionicon-var-ios-loop-strong: "\f459"; +$ionicon-var-ios-medical: "\f45c"; +$ionicon-var-ios-medical-outline: "\f45b"; +$ionicon-var-ios-medkit: "\f45e"; +$ionicon-var-ios-medkit-outline: "\f45d"; +$ionicon-var-ios-mic: "\f461"; +$ionicon-var-ios-mic-off: "\f45f"; +$ionicon-var-ios-mic-outline: "\f460"; +$ionicon-var-ios-minus: "\f464"; +$ionicon-var-ios-minus-empty: "\f462"; +$ionicon-var-ios-minus-outline: "\f463"; +$ionicon-var-ios-monitor: "\f466"; +$ionicon-var-ios-monitor-outline: "\f465"; +$ionicon-var-ios-moon: "\f468"; +$ionicon-var-ios-moon-outline: "\f467"; +$ionicon-var-ios-more: "\f46a"; +$ionicon-var-ios-more-outline: "\f469"; +$ionicon-var-ios-musical-note: "\f46b"; +$ionicon-var-ios-musical-notes: "\f46c"; +$ionicon-var-ios-navigate: "\f46e"; +$ionicon-var-ios-navigate-outline: "\f46d"; +$ionicon-var-ios-nutrition: "\f470"; +$ionicon-var-ios-nutrition-outline: "\f46f"; +$ionicon-var-ios-paper: "\f472"; +$ionicon-var-ios-paper-outline: "\f471"; +$ionicon-var-ios-paperplane: "\f474"; +$ionicon-var-ios-paperplane-outline: "\f473"; +$ionicon-var-ios-partlysunny: "\f476"; +$ionicon-var-ios-partlysunny-outline: "\f475"; +$ionicon-var-ios-pause: "\f478"; +$ionicon-var-ios-pause-outline: "\f477"; +$ionicon-var-ios-paw: "\f47a"; +$ionicon-var-ios-paw-outline: "\f479"; +$ionicon-var-ios-people: "\f47c"; +$ionicon-var-ios-people-outline: "\f47b"; +$ionicon-var-ios-person: "\f47e"; +$ionicon-var-ios-person-outline: "\f47d"; +$ionicon-var-ios-personadd: "\f480"; +$ionicon-var-ios-personadd-outline: "\f47f"; +$ionicon-var-ios-photos: "\f482"; +$ionicon-var-ios-photos-outline: "\f481"; +$ionicon-var-ios-pie: "\f484"; +$ionicon-var-ios-pie-outline: "\f483"; +$ionicon-var-ios-pint: "\f486"; +$ionicon-var-ios-pint-outline: "\f485"; +$ionicon-var-ios-play: "\f488"; +$ionicon-var-ios-play-outline: "\f487"; +$ionicon-var-ios-plus: "\f48b"; +$ionicon-var-ios-plus-empty: "\f489"; +$ionicon-var-ios-plus-outline: "\f48a"; +$ionicon-var-ios-pricetag: "\f48d"; +$ionicon-var-ios-pricetag-outline: "\f48c"; +$ionicon-var-ios-pricetags: "\f48f"; +$ionicon-var-ios-pricetags-outline: "\f48e"; +$ionicon-var-ios-printer: "\f491"; +$ionicon-var-ios-printer-outline: "\f490"; +$ionicon-var-ios-pulse: "\f493"; +$ionicon-var-ios-pulse-strong: "\f492"; +$ionicon-var-ios-rainy: "\f495"; +$ionicon-var-ios-rainy-outline: "\f494"; +$ionicon-var-ios-recording: "\f497"; +$ionicon-var-ios-recording-outline: "\f496"; +$ionicon-var-ios-redo: "\f499"; +$ionicon-var-ios-redo-outline: "\f498"; +$ionicon-var-ios-refresh: "\f49c"; +$ionicon-var-ios-refresh-empty: "\f49a"; +$ionicon-var-ios-refresh-outline: "\f49b"; +$ionicon-var-ios-reload: "\f49d"; +$ionicon-var-ios-reverse-camera: "\f49f"; +$ionicon-var-ios-reverse-camera-outline: "\f49e"; +$ionicon-var-ios-rewind: "\f4a1"; +$ionicon-var-ios-rewind-outline: "\f4a0"; +$ionicon-var-ios-rose: "\f4a3"; +$ionicon-var-ios-rose-outline: "\f4a2"; +$ionicon-var-ios-search: "\f4a5"; +$ionicon-var-ios-search-strong: "\f4a4"; +$ionicon-var-ios-settings: "\f4a7"; +$ionicon-var-ios-settings-strong: "\f4a6"; +$ionicon-var-ios-shuffle: "\f4a9"; +$ionicon-var-ios-shuffle-strong: "\f4a8"; +$ionicon-var-ios-skipbackward: "\f4ab"; +$ionicon-var-ios-skipbackward-outline: "\f4aa"; +$ionicon-var-ios-skipforward: "\f4ad"; +$ionicon-var-ios-skipforward-outline: "\f4ac"; +$ionicon-var-ios-snowy: "\f4ae"; +$ionicon-var-ios-speedometer: "\f4b0"; +$ionicon-var-ios-speedometer-outline: "\f4af"; +$ionicon-var-ios-star: "\f4b3"; +$ionicon-var-ios-star-half: "\f4b1"; +$ionicon-var-ios-star-outline: "\f4b2"; +$ionicon-var-ios-stopwatch: "\f4b5"; +$ionicon-var-ios-stopwatch-outline: "\f4b4"; +$ionicon-var-ios-sunny: "\f4b7"; +$ionicon-var-ios-sunny-outline: "\f4b6"; +$ionicon-var-ios-telephone: "\f4b9"; +$ionicon-var-ios-telephone-outline: "\f4b8"; +$ionicon-var-ios-tennisball: "\f4bb"; +$ionicon-var-ios-tennisball-outline: "\f4ba"; +$ionicon-var-ios-thunderstorm: "\f4bd"; +$ionicon-var-ios-thunderstorm-outline: "\f4bc"; +$ionicon-var-ios-time: "\f4bf"; +$ionicon-var-ios-time-outline: "\f4be"; +$ionicon-var-ios-timer: "\f4c1"; +$ionicon-var-ios-timer-outline: "\f4c0"; +$ionicon-var-ios-toggle: "\f4c3"; +$ionicon-var-ios-toggle-outline: "\f4c2"; +$ionicon-var-ios-trash: "\f4c5"; +$ionicon-var-ios-trash-outline: "\f4c4"; +$ionicon-var-ios-undo: "\f4c7"; +$ionicon-var-ios-undo-outline: "\f4c6"; +$ionicon-var-ios-unlocked: "\f4c9"; +$ionicon-var-ios-unlocked-outline: "\f4c8"; +$ionicon-var-ios-upload: "\f4cb"; +$ionicon-var-ios-upload-outline: "\f4ca"; +$ionicon-var-ios-videocam: "\f4cd"; +$ionicon-var-ios-videocam-outline: "\f4cc"; +$ionicon-var-ios-volume-high: "\f4ce"; +$ionicon-var-ios-volume-low: "\f4cf"; +$ionicon-var-ios-wineglass: "\f4d1"; +$ionicon-var-ios-wineglass-outline: "\f4d0"; +$ionicon-var-ios-world: "\f4d3"; +$ionicon-var-ios-world-outline: "\f4d2"; +$ionicon-var-ipad: "\f1f9"; +$ionicon-var-iphone: "\f1fa"; +$ionicon-var-ipod: "\f1fb"; +$ionicon-var-jet: "\f295"; +$ionicon-var-key: "\f296"; +$ionicon-var-knife: "\f297"; +$ionicon-var-laptop: "\f1fc"; +$ionicon-var-leaf: "\f1fd"; +$ionicon-var-levels: "\f298"; +$ionicon-var-lightbulb: "\f299"; +$ionicon-var-link: "\f1fe"; +$ionicon-var-load-a: "\f29a"; +$ionicon-var-load-b: "\f29b"; +$ionicon-var-load-c: "\f29c"; +$ionicon-var-load-d: "\f29d"; +$ionicon-var-location: "\f1ff"; +$ionicon-var-lock-combination: "\f4d4"; +$ionicon-var-locked: "\f200"; +$ionicon-var-log-in: "\f29e"; +$ionicon-var-log-out: "\f29f"; +$ionicon-var-loop: "\f201"; +$ionicon-var-magnet: "\f2a0"; +$ionicon-var-male: "\f2a1"; +$ionicon-var-man: "\f202"; +$ionicon-var-map: "\f203"; +$ionicon-var-medkit: "\f2a2"; +$ionicon-var-merge: "\f33f"; +$ionicon-var-mic-a: "\f204"; +$ionicon-var-mic-b: "\f205"; +$ionicon-var-mic-c: "\f206"; +$ionicon-var-minus: "\f209"; +$ionicon-var-minus-circled: "\f207"; +$ionicon-var-minus-round: "\f208"; +$ionicon-var-model-s: "\f2c1"; +$ionicon-var-monitor: "\f20a"; +$ionicon-var-more: "\f20b"; +$ionicon-var-mouse: "\f340"; +$ionicon-var-music-note: "\f20c"; +$ionicon-var-navicon: "\f20e"; +$ionicon-var-navicon-round: "\f20d"; +$ionicon-var-navigate: "\f2a3"; +$ionicon-var-network: "\f341"; +$ionicon-var-no-smoking: "\f2c2"; +$ionicon-var-nuclear: "\f2a4"; +$ionicon-var-outlet: "\f342"; +$ionicon-var-paintbrush: "\f4d5"; +$ionicon-var-paintbucket: "\f4d6"; +$ionicon-var-paper-airplane: "\f2c3"; +$ionicon-var-paperclip: "\f20f"; +$ionicon-var-pause: "\f210"; +$ionicon-var-person: "\f213"; +$ionicon-var-person-add: "\f211"; +$ionicon-var-person-stalker: "\f212"; +$ionicon-var-pie-graph: "\f2a5"; +$ionicon-var-pin: "\f2a6"; +$ionicon-var-pinpoint: "\f2a7"; +$ionicon-var-pizza: "\f2a8"; +$ionicon-var-plane: "\f214"; +$ionicon-var-planet: "\f343"; +$ionicon-var-play: "\f215"; +$ionicon-var-playstation: "\f30a"; +$ionicon-var-plus: "\f218"; +$ionicon-var-plus-circled: "\f216"; +$ionicon-var-plus-round: "\f217"; +$ionicon-var-podium: "\f344"; +$ionicon-var-pound: "\f219"; +$ionicon-var-power: "\f2a9"; +$ionicon-var-pricetag: "\f2aa"; +$ionicon-var-pricetags: "\f2ab"; +$ionicon-var-printer: "\f21a"; +$ionicon-var-pull-request: "\f345"; +$ionicon-var-qr-scanner: "\f346"; +$ionicon-var-quote: "\f347"; +$ionicon-var-radio-waves: "\f2ac"; +$ionicon-var-record: "\f21b"; +$ionicon-var-refresh: "\f21c"; +$ionicon-var-reply: "\f21e"; +$ionicon-var-reply-all: "\f21d"; +$ionicon-var-ribbon-a: "\f348"; +$ionicon-var-ribbon-b: "\f349"; +$ionicon-var-sad: "\f34a"; +$ionicon-var-sad-outline: "\f4d7"; +$ionicon-var-scissors: "\f34b"; +$ionicon-var-search: "\f21f"; +$ionicon-var-settings: "\f2ad"; +$ionicon-var-share: "\f220"; +$ionicon-var-shuffle: "\f221"; +$ionicon-var-skip-backward: "\f222"; +$ionicon-var-skip-forward: "\f223"; +$ionicon-var-social-android: "\f225"; +$ionicon-var-social-android-outline: "\f224"; +$ionicon-var-social-angular: "\f4d9"; +$ionicon-var-social-angular-outline: "\f4d8"; +$ionicon-var-social-apple: "\f227"; +$ionicon-var-social-apple-outline: "\f226"; +$ionicon-var-social-bitcoin: "\f2af"; +$ionicon-var-social-bitcoin-outline: "\f2ae"; +$ionicon-var-social-buffer: "\f229"; +$ionicon-var-social-buffer-outline: "\f228"; +$ionicon-var-social-chrome: "\f4db"; +$ionicon-var-social-chrome-outline: "\f4da"; +$ionicon-var-social-codepen: "\f4dd"; +$ionicon-var-social-codepen-outline: "\f4dc"; +$ionicon-var-social-css3: "\f4df"; +$ionicon-var-social-css3-outline: "\f4de"; +$ionicon-var-social-designernews: "\f22b"; +$ionicon-var-social-designernews-outline: "\f22a"; +$ionicon-var-social-dribbble: "\f22d"; +$ionicon-var-social-dribbble-outline: "\f22c"; +$ionicon-var-social-dropbox: "\f22f"; +$ionicon-var-social-dropbox-outline: "\f22e"; +$ionicon-var-social-euro: "\f4e1"; +$ionicon-var-social-euro-outline: "\f4e0"; +$ionicon-var-social-facebook: "\f231"; +$ionicon-var-social-facebook-outline: "\f230"; +$ionicon-var-social-foursquare: "\f34d"; +$ionicon-var-social-foursquare-outline: "\f34c"; +$ionicon-var-social-freebsd-devil: "\f2c4"; +$ionicon-var-social-github: "\f233"; +$ionicon-var-social-github-outline: "\f232"; +$ionicon-var-social-google: "\f34f"; +$ionicon-var-social-google-outline: "\f34e"; +$ionicon-var-social-googleplus: "\f235"; +$ionicon-var-social-googleplus-outline: "\f234"; +$ionicon-var-social-hackernews: "\f237"; +$ionicon-var-social-hackernews-outline: "\f236"; +$ionicon-var-social-html5: "\f4e3"; +$ionicon-var-social-html5-outline: "\f4e2"; +$ionicon-var-social-instagram: "\f351"; +$ionicon-var-social-instagram-outline: "\f350"; +$ionicon-var-social-javascript: "\f4e5"; +$ionicon-var-social-javascript-outline: "\f4e4"; +$ionicon-var-social-linkedin: "\f239"; +$ionicon-var-social-linkedin-outline: "\f238"; +$ionicon-var-social-markdown: "\f4e6"; +$ionicon-var-social-nodejs: "\f4e7"; +$ionicon-var-social-octocat: "\f4e8"; +$ionicon-var-social-pinterest: "\f2b1"; +$ionicon-var-social-pinterest-outline: "\f2b0"; +$ionicon-var-social-python: "\f4e9"; +$ionicon-var-social-reddit: "\f23b"; +$ionicon-var-social-reddit-outline: "\f23a"; +$ionicon-var-social-rss: "\f23d"; +$ionicon-var-social-rss-outline: "\f23c"; +$ionicon-var-social-sass: "\f4ea"; +$ionicon-var-social-skype: "\f23f"; +$ionicon-var-social-skype-outline: "\f23e"; +$ionicon-var-social-snapchat: "\f4ec"; +$ionicon-var-social-snapchat-outline: "\f4eb"; +$ionicon-var-social-tumblr: "\f241"; +$ionicon-var-social-tumblr-outline: "\f240"; +$ionicon-var-social-tux: "\f2c5"; +$ionicon-var-social-twitch: "\f4ee"; +$ionicon-var-social-twitch-outline: "\f4ed"; +$ionicon-var-social-twitter: "\f243"; +$ionicon-var-social-twitter-outline: "\f242"; +$ionicon-var-social-usd: "\f353"; +$ionicon-var-social-usd-outline: "\f352"; +$ionicon-var-social-vimeo: "\f245"; +$ionicon-var-social-vimeo-outline: "\f244"; +$ionicon-var-social-whatsapp: "\f4f0"; +$ionicon-var-social-whatsapp-outline: "\f4ef"; +$ionicon-var-social-windows: "\f247"; +$ionicon-var-social-windows-outline: "\f246"; +$ionicon-var-social-wordpress: "\f249"; +$ionicon-var-social-wordpress-outline: "\f248"; +$ionicon-var-social-yahoo: "\f24b"; +$ionicon-var-social-yahoo-outline: "\f24a"; +$ionicon-var-social-yen: "\f4f2"; +$ionicon-var-social-yen-outline: "\f4f1"; +$ionicon-var-social-youtube: "\f24d"; +$ionicon-var-social-youtube-outline: "\f24c"; +$ionicon-var-soup-can: "\f4f4"; +$ionicon-var-soup-can-outline: "\f4f3"; +$ionicon-var-speakerphone: "\f2b2"; +$ionicon-var-speedometer: "\f2b3"; +$ionicon-var-spoon: "\f2b4"; +$ionicon-var-star: "\f24e"; +$ionicon-var-stats-bars: "\f2b5"; +$ionicon-var-steam: "\f30b"; +$ionicon-var-stop: "\f24f"; +$ionicon-var-thermometer: "\f2b6"; +$ionicon-var-thumbsdown: "\f250"; +$ionicon-var-thumbsup: "\f251"; +$ionicon-var-toggle: "\f355"; +$ionicon-var-toggle-filled: "\f354"; +$ionicon-var-transgender: "\f4f5"; +$ionicon-var-trash-a: "\f252"; +$ionicon-var-trash-b: "\f253"; +$ionicon-var-trophy: "\f356"; +$ionicon-var-tshirt: "\f4f7"; +$ionicon-var-tshirt-outline: "\f4f6"; +$ionicon-var-umbrella: "\f2b7"; +$ionicon-var-university: "\f357"; +$ionicon-var-unlocked: "\f254"; +$ionicon-var-upload: "\f255"; +$ionicon-var-usb: "\f2b8"; +$ionicon-var-videocamera: "\f256"; +$ionicon-var-volume-high: "\f257"; +$ionicon-var-volume-low: "\f258"; +$ionicon-var-volume-medium: "\f259"; +$ionicon-var-volume-mute: "\f25a"; +$ionicon-var-wand: "\f358"; +$ionicon-var-waterdrop: "\f25b"; +$ionicon-var-wifi: "\f25c"; +$ionicon-var-wineglass: "\f2b9"; +$ionicon-var-woman: "\f25d"; +$ionicon-var-wrench: "\f2ba"; +$ionicon-var-xbox: "\f30c";
\ No newline at end of file diff --git a/www/lib/ionic/scss/ionicons/ionicons.scss b/www/lib/ionic/scss/ionicons/ionicons.scss new file mode 100644 index 00000000..0ef6a8d0 --- /dev/null +++ b/www/lib/ionic/scss/ionicons/ionicons.scss @@ -0,0 +1,16 @@ +@charset "UTF-8"; +@import "ionicons-variables"; +/*! + Ionicons, v2.0.1 + Created by Ben Sperry for the Ionic Framework, http://ionicons.com/ + https://twitter.com/benjsperry https://twitter.com/ionicframework + MIT License: https://github.com/driftyco/ionicons + + Android-style icons originally built by Google’s + Material Design Icons: https://github.com/google/material-design-icons + used under CC BY http://creativecommons.org/licenses/by/4.0/ + Modified icons to fit ionicon’s grid from original. +*/ + +@import "ionicons-font"; +@import "ionicons-icons"; |