@ozo/react-rock
Version:
React 移动端开发脚手架，基于CRA3，通用、开箱即用。
1 lines • 3.02 kB
Source Map (JSON)
{"version":3,"sources":["LoadSpinner.module.scss"],"names":[],"mappings":"AAQA,4BACI,YAAa,CACb,WAAY,CACZ,qBAAsB,CACtB,kBAAmB,CACnB,sBAAuB,CAC1B,2BAGG,iBAAkB,CAClB,WAjBQ,CAkBR,YAlBQ,CAmBR,gCAAA,CAAA,wBAAyB,CAJ7B,mEAQQ,UAAW,CACX,iBAAkB,CAClB,OAAQ,CACR,QAAS,CACT,aAAc,CACd,UA3BS,CA4BT,WA5BS,CA6BT,mBAA6B,CAC7B,sCAAA,CAAA,8BAAgC,CAhBxC,kCAoBQ,uDAAA,CAAA,+CAA6B,CApBrC,iCAwBQ,sDAAA,CAAA,8CAA4B,CAC/B,0BAID,aAAc,CACd,cAAe,CACf,yBAA0B,CAC7B,6CAGG,GACI,UAlDS,CAmDT,wEArDwE,CAuD5E,IACI,WAvDI,CAwDJ,mEAzDwE,CA2D5E,IACI,UA1DS,CA2DT,wEA7DwE,CA+D5E,GACI,wEAhEwE,CAAA,CAgD/E,qCAGG,GACI,UAlDS,CAmDT,wEArDwE,CAuD5E,IACI,WAvDI,CAwDJ,mEAzDwE,CA2D5E,IACI,UA1DS,CA2DT,wEA7DwE,CA+D5E,GACI,wEAhEwE,CAAA,CAoEhF,4CACI,GACI,WApES,CAqET,wEAvE+F,CAyEnG,IACI,YAzEI,CA0EJ,mEA3E+F,CA6EnG,IACI,WA5ES,CA6ET,wEA/E+F,CAiFnG,GACI,wEAlF+F,CAAA,CAoEvG,oCACI,GACI,WApES,CAqET,wEAvE+F,CAyEnG,IACI,YAzEI,CA0EJ,mEA3E+F,CA6EnG,IACI,WA5ES,CA6ET,wEA/E+F,CAiFnG,GACI,wEAlF+F,CAAA","file":"1ef7.bf5a948d.chunk.css","sourcesContent":["$colors: hsla(337, 84, 48, 0.75) hsla(160, 50, 48, 0.75) hsla(190, 61, 65, 0.75) hsla(41, 82, 52, 0.75);\n$size: 2.5em;\n$thickness: 0.5em;\n\n// Calculated variables.\n$lat: ($size - $thickness) / 2;\n$offset: $lat - $thickness;\n\n.wrapper {\n display: flex;\n height: 100%;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.loader {\n position: relative;\n width: $size;\n height: $size;\n transform: rotate(165deg);\n\n &:before,\n &:after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n display: block;\n width: $thickness;\n height: $thickness;\n border-radius: $thickness / 2;\n transform: translate(-50%, -50%);\n }\n\n &:before {\n animation: before 2s infinite;\n }\n\n &:after {\n animation: after 2s infinite;\n }\n}\n\n.error {\n color: #2d78f4;\n cursor: pointer;\n text-decoration: underline;\n}\n\n@keyframes before {\n 0% {\n width: $thickness;\n box-shadow: $lat (-$offset) nth($colors, 1), (-$lat) $offset nth($colors, 3);\n }\n 35% {\n width: $size;\n box-shadow: 0 (-$offset) nth($colors, 1), 0 $offset nth($colors, 3);\n }\n 70% {\n width: $thickness;\n box-shadow: (-$lat) (-$offset) nth($colors, 1), $lat $offset nth($colors, 3);\n }\n 100% {\n box-shadow: $lat (-$offset) nth($colors, 1), (-$lat) $offset nth($colors, 3);\n }\n}\n\n@keyframes after {\n 0% {\n height: $thickness;\n box-shadow: $offset $lat nth($colors, 2), (-$offset) (-$lat) nth($colors, 4);\n }\n 35% {\n height: $size;\n box-shadow: $offset 0 nth($colors, 2), (-$offset) 0 nth($colors, 4);\n }\n 70% {\n height: $thickness;\n box-shadow: $offset (-$lat) nth($colors, 2), (-$offset) $lat nth($colors, 4);\n }\n 100% {\n box-shadow: $offset $lat nth($colors, 2), (-$offset) (-$lat) nth($colors, 4);\n }\n}\n"]}