UNPKG

@material-git/all

Version:
1 lines 5.78 kB
{"version":3,"file":"progress-circle/progress-circle.css","sources":["progress-circle/progress-circle.scss","core/style/_variables.scss","core/typography/_typography.scss"],"sourcesContent":["@import '../core/style/variables';\r\n\r\n\r\n// Animation Durations \r\n$md-progress-circle-duration: 5250ms !default;\r\n$md-progress-circle-constant-rotate-duration: $md-progress-circle-duration * 0.55 !default;\r\n$md-progress-circle-sporadic-rotate-duration: $md-progress-circle-duration !default;\r\n\r\n// Component sizing \r\n$md-progress-circle-stroke-width: 10px !default;\r\n// Height and weight of the viewport for md-progress-circle.\r\n$md-progress-circle-viewport-size: 100px !default;\r\n\r\n\r\n:host {\r\n display: block;\r\n // Height and width are provided for md-progress-circle to act as a default.\r\n // The height and width are expected to be overwritten by application css.\r\n height: $md-progress-circle-viewport-size;\r\n width: $md-progress-circle-viewport-size;\r\n\r\n // SVG's viewBox is defined as 0 0 100 100, this means that all SVG children will placed\r\n // based on a 100px by 100px box. Additionally all SVG sizes and locations are in reference to\r\n // this viewBox.\r\n svg {\r\n height: 100%;\r\n width: 100%;\r\n transform-origin: center;\r\n }\r\n\r\n\r\n path {\r\n fill: transparent;\r\n\r\n // Stroke width of 10px defines stroke as 10% of the viewBox.\r\n stroke-width: $md-progress-circle-stroke-width;\r\n }\r\n\r\n\r\n &[mode='indeterminate'] {\r\n animation-duration: $md-progress-circle-sporadic-rotate-duration,\r\n $md-progress-circle-constant-rotate-duration;\r\n animation-name: md-progress-circle-sporadic-rotate,\r\n md-progress-circle-linear-rotate;\r\n animation-timing-function: $ease-in-out-curve-function,\r\n linear;\r\n animation-iteration-count: infinite;\r\n transition: none;\r\n }\r\n}\r\n\r\n\r\n// Animations for indeterminate mode \r\n@keyframes md-progress-circle-linear-rotate {\r\n 0% { transform: rotate(0deg); }\r\n 100% { transform: rotate(360deg); }\r\n}\r\n@keyframes md-progress-circle-sporadic-rotate {\r\n 12.5% { transform: rotate( 135deg); }\r\n 25% { transform: rotate( 270deg); }\r\n 37.5% { transform: rotate( 405deg); }\r\n 50% { transform: rotate( 540deg); }\r\n 62.5% { transform: rotate( 675deg); }\r\n 75% { transform: rotate( 810deg); }\r\n 87.5% { transform: rotate( 945deg); }\r\n 100% { transform: rotate(1080deg); }\r\n}\r\n","@import '../typography/typography';\r\n\r\n\r\n// Typography\r\n$md-body-font-size-base: rem(1.4) !default;\r\n$md-font-family: Roboto, 'Helvetica Neue', sans-serif !default;\r\n\r\n// Media queries\r\n$md-xsmall: 'max-width: 600px';\r\n\r\n// TODO: Revisit all z-indices before beta\r\n// z-index master list\r\n\r\n$z-index-fab: 20 !default;\r\n$z-index-drawer: 100 !default;\r\n\r\n// Overlay z indices.\r\n$md-z-index-overlay: 1000;\r\n$md-z-index-overlay-container: 1;\r\n$md-z-index-overlay-backdrop: 1;\r\n\r\n\r\n// Global constants\r\n$pi: 3.14159265;\r\n\r\n// Padding between input toggles and their labels\r\n$md-toggle-padding: 8px !default;\r\n// Width and height of input toggles\r\n$md-toggle-size: 20px !default;\r\n\r\n// Easing Curves\r\n// TODO(jelbourn): all of these need to be revisited\r\n\r\n// The default animation curves used by material design.\r\n$md-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 0.1) !default;\r\n$md-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;\r\n$md-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1) !default;\r\n\r\n$ease-in-out-curve-function: cubic-bezier(0.35, 0, 0.25, 1) !default;\r\n\r\n$swift-ease-out-duration: 400ms !default;\r\n$swift-ease-out-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;\r\n$swift-ease-out: all $swift-ease-out-duration $swift-ease-out-timing-function !default;\r\n\r\n$swift-ease-in-duration: 300ms !default;\r\n$swift-ease-in-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2) !default;\r\n$swift-ease-in: all $swift-ease-in-duration $swift-ease-in-timing-function !default;\r\n\r\n$swift-ease-in-out-duration: 500ms !default;\r\n$swift-ease-in-out-timing-function: $ease-in-out-curve-function !default;\r\n$swift-ease-in-out: all $swift-ease-in-out-duration $swift-ease-in-out-timing-function !default;\r\n\r\n$swift-linear-duration: 80ms !default;\r\n$swift-linear-timing-function: linear !default;\r\n$swift-linear: all $swift-linear-duration $swift-linear-timing-function !default;\r\n","// Implement the rem unit with SCSS so we don't have to actually set a font-size on\r\n// the user's body element.\r\n@function rem($multiplier) {\r\n $font-size: 10px;\r\n @return $multiplier * $font-size;\r\n}\r\n"],"mappings":"AAcA,AAAA,KAAK,CAAC;EACJ,OAAO,EAAE,KAAM;EAGf,MAAM,EAP2B,KAAK;EAQtC,KAAK,EAR4B,KAAK,GAsCvC;EAnCD,AAUE,KAVG,CAUH,GAAG,CAAC;IACF,MAAM,EAAE,IAAK;IACb,KAAK,EAAE,IAAK;IACZ,gBAAgB,EAAE,MAAO,GAC1B;EAdH,AAiBE,KAjBG,CAiBH,IAAI,CAAC;IACH,IAAI,EAAE,WAAY;IAGlB,YAAY,EA1BkB,IAAI,GA2BnC;EAtBH,AAAA,KAAK,CAyBF,AAAA,IAAC,CAAK,eAAe,AAApB,EAAsB;IACtB,kBAAkB,EApCQ,MAAM,EACU,QAA4B;IAqCtE,cAAc,EAAE,qEACiC;IACjD,yBAAyB,ECNA,8BAAY,EDOV,MAAM;IACjC,yBAAyB,EAAE,QAAS;IACpC,UAAU,EAAE,IAAK,GAClB;;AAKH,UAAU,CAAV,gCAAU;EACR,AAAA,EAAE;IAAS,SAAS,EAAE,YAAM;EAC5B,AAAA,IAAI;IAAO,SAAS,EAAE,cAAM;;AAE9B,UAAU,CAAV,kCAAU;EACR,AAAA,KAAK;IAAM,SAAS,EAAE,cAAM;EAC5B,AAAA,GAAG;IAAQ,SAAS,EAAE,cAAM;EAC5B,AAAA,KAAK;IAAM,SAAS,EAAE,cAAM;EAC5B,AAAA,GAAG;IAAQ,SAAS,EAAE,cAAM;EAC5B,AAAA,KAAK;IAAM,SAAS,EAAE,cAAM;EAC5B,AAAA,GAAG;IAAQ,SAAS,EAAE,cAAM;EAC5B,AAAA,KAAK;IAAM,SAAS,EAAE,cAAM;EAC5B,AAAA,IAAI;IAAO,SAAS,EAAE,eAAM","names":[],"sourceRoot":"/source/"}