diff options
Diffstat (limited to 'app/static/css/eternal.css')
-rw-r--r-- | app/static/css/eternal.css | 81 |
1 files changed, 81 insertions, 0 deletions
diff --git a/app/static/css/eternal.css b/app/static/css/eternal.css new file mode 100644 index 0000000..e2c5895 --- /dev/null +++ b/app/static/css/eternal.css @@ -0,0 +1,81 @@ +.eternal-progress-bg { + background: none; + filter: blur(3px); + -moz-filter: blur(3px); + -webkit-filter: blur(3px); + position: absolute; + width: 100px; + height: 100px; +} + +.eternal-progress-svg { + animation: progress-rotate 2s linear infinite; + height: 100px; + width: 100px; + position: relative; +} + +.eternal-progress-path { + stroke-dasharray: 0, calc(20 * 7); + stroke-linecap: round; + stroke: #888a; + -moz-transition: stroke-dasharray 0.3s ease; + -webkit-transition: stroke-dasharray 0.3s ease; + transition: stroke-dasharray 0.3s ease; +} + +@keyframes progress-rotate { + 100% { + transform: rotate(360deg); + } +} +.eternal-progress-wrapper { + display: inline-block; +} + +.eternal-progress-status { + width: 100%; + text-align: center; + font-size: 0.9em; +} + +.eternal-url { + position: relative; + display: inline; +} + +.eternal-url-input { + min-width: 40%; + color: white; + background-color: transparent; + border: 1px solid transparent; + border-bottom-color: rgba(252, 49, 113, 0.2); +} + +.eternal-url-input:focus { + outline: none; +} + +.eternal-url-input::placeholder { + color: rgba(255, 255, 255, 0.3); +} + +.eternal-url-input ~ span { + position: absolute; + bottom: 0; + left: 50%; + width: 100%; + height: 1px; + opacity: 0; + background-color: #fc2f70; + transform-origin: center; + transform: translate(-50%, 0) scaleX(0); + transition: all 0.3s ease; +} + +.eternal-url-input:focus ~ span { + transform: translate(-50%, 0) scaleX(1); + opacity: 1; +} + +/*# sourceMappingURL=eternal.css.map */ |