UNPKG

@ionic/angular

Version:

Angular specific wrappers for @ionic/core

458 lines (416 loc) • 9.17 kB
audio, canvas, progress, video { vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } b, strong { font-weight: bold; } img { max-width: 100%; } hr { height: 1px; border-width: 0; box-sizing: content-box; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } label, input, select, textarea { font-family: inherit; line-height: normal; } textarea { overflow: auto; height: auto; font: inherit; color: inherit; } textarea::placeholder { padding-left: 2px; } form, input, optgroup, select { margin: 0; font: inherit; color: inherit; } html input[type=button], input[type=reset], input[type=submit] { cursor: pointer; -webkit-appearance: button; } a, a div, a span, a ion-icon, a ion-label, button, button div, button span, button ion-icon, button ion-label, .ion-tappable, [tappable], [tappable] div, [tappable] span, [tappable] ion-icon, [tappable] ion-label, input, textarea { touch-action: manipulation; } a ion-label, button ion-label { pointer-events: none; } button { padding: 0; border: 0; border-radius: 0; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: 1; text-transform: none; cursor: pointer; -webkit-appearance: button; } [tappable] { cursor: pointer; } a[disabled], button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { height: auto; } input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration { -webkit-appearance: none; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /** * Convert a font size to a dynamic font size. * Fonts that participate in Dynamic Type should use * dynamic font sizes. * @param size - The initial font size including the unit (i.e. px or pt) * @param unit (optional) - The unit to convert to. Use this if you want to * convert to a unit other than $baselineUnit. */ /** * Convert a font size to a dynamic font size but impose * a maximum font size. * @param size - The initial font size including the unit (i.e. px or pt) * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale). * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to * convert to a unit other than $baselineUnit. */ /** * Convert a font size to a dynamic font size but impose * a minimum font size. * @param size - The initial font size including the unit (i.e. px or pt) * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale). * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to * convert to a unit other than $baselineUnit. */ /** * Convert a font size to a dynamic font size but impose * maximum and minimum font sizes. * @param size - The initial font size including the unit (i.e. px or pt) * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale). * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale). * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to * convert to a unit other than $baselineUnit. */ /** * A heuristic that applies CSS to tablet * viewports. * * Usage: * @include tablet-viewport() { * :host { * background-color: green; * } * } */ /** * A heuristic that applies CSS to mobile * viewports (i.e. phones, not tablets). * * Usage: * @include mobile-viewport() { * :host { * background-color: blue; * } * } */ /** * A heuristic that applies CSS to tablet * viewports. * * Usage: * @include tablet-viewport() { * :host { * background-color: green; * } * } */ /** * A heuristic that applies CSS to mobile * viewports (i.e. phones, not tablets). * * Usage: * @include mobile-viewport() { * :host { * background-color: blue; * } * } */ * { box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } html { width: 100%; height: 100%; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } html:not(.hydrated) body { display: none; } html.ion-ce body { display: block; } html.plt-pwa { height: 100vh; } body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; margin-left: 0; margin-right: 0; margin-top: 0; margin-bottom: 0; padding-left: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; position: fixed; width: 100%; max-width: 100%; height: 100%; max-height: 100%; /** * Because body has position: fixed, * it should be promoted to its own * layer. * * WebKit does not always promote * the body to its own layer on page * load in Ionic apps. Once scrolling on * ion-content starts, WebKit will promote * body. Unfortunately, this causes a re-paint * which results in scrolling being halted * until the next user gesture. * * This impacts the Custom Elements build. * The lazy loaded build causes the browser to * re-paint during hydration which causes WebKit * to promote body to its own layer. * In the CE Build, this hydration does not * happen, so the additional re-paint does not occur. */ transform: translateZ(0); text-rendering: optimizeLegibility; overflow: hidden; touch-action: manipulation; -webkit-user-drag: none; -ms-content-zooming: none; word-wrap: break-word; overscroll-behavior-y: none; -webkit-text-size-adjust: none; text-size-adjust: none; } /** * Convert a font size to a dynamic font size. * Fonts that participate in Dynamic Type should use * dynamic font sizes. * @param size - The initial font size including the unit (i.e. px or pt) * @param unit (optional) - The unit to convert to. Use this if you want to * convert to a unit other than $baselineUnit. */ /** * Convert a font size to a dynamic font size but impose * a maximum font size. * @param size - The initial font size including the unit (i.e. px or pt) * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale). * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to * convert to a unit other than $baselineUnit. */ /** * Convert a font size to a dynamic font size but impose * a minimum font size. * @param size - The initial font size including the unit (i.e. px or pt) * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale). * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to * convert to a unit other than $baselineUnit. */ /** * Convert a font size to a dynamic font size but impose * maximum and minimum font sizes. * @param size - The initial font size including the unit (i.e. px or pt) * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale). * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale). * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to * convert to a unit other than $baselineUnit. */ /** * A heuristic that applies CSS to tablet * viewports. * * Usage: * @include tablet-viewport() { * :host { * background-color: green; * } * } */ /** * A heuristic that applies CSS to mobile * viewports (i.e. phones, not tablets). * * Usage: * @include mobile-viewport() { * :host { * background-color: blue; * } * } */ /** * A heuristic that applies CSS to tablet * viewports. * * Usage: * @include tablet-viewport() { * :host { * background-color: green; * } * } */ /** * A heuristic that applies CSS to mobile * viewports (i.e. phones, not tablets). * * Usage: * @include mobile-viewport() { * :host { * background-color: blue; * } * } */ html { font-family: var(--ion-font-family); } /** * Dynamic Type is an iOS-only feature, so * this should only be enabled on iOS devices. */ @supports (-webkit-touch-callout: none) { html { /** * Includes fallback if Dynamic Type is not enabled. */ font: var(--ion-dynamic-font, 16px var(--ion-font-family)); } } a { background-color: transparent; color: var(--ion-color-primary, #3880ff); } h1, h2, h3, h4, h5, h6 { margin-top: 16px; margin-bottom: 10px; font-weight: 500; line-height: 1.2; } h1 { margin-top: 20px; font-size: 1.625rem; } h2 { margin-top: 18px; font-size: 1.5rem; } h3 { font-size: 1.375rem; } h4 { font-size: 1.25rem; } h5 { font-size: 1.125rem; } h6 { font-size: 1rem; } small { font-size: 75%; } sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /*# sourceMappingURL=global.bundle.css.map */