X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=assets%2Fvintage%2Fcss%2Fshaarli.css;h=5b02ab5b2a573096a4196d6bc6616edf4523e737;hb=1e49a65a2a930390cf00114cc30d8516626331c2;hp=c919339b95ca3b10f064227fcf029add52135540;hpb=c81f1afc0a3a16daf98741a63c7524b27835da99;p=github%2Fshaarli%2FShaarli.git diff --git a/assets/vintage/css/shaarli.css b/assets/vintage/css/shaarli.css index c919339b..5b02ab5b 100644 --- a/assets/vintage/css/shaarli.css +++ b/assets/vintage/css/shaarli.css @@ -701,8 +701,8 @@ a.bigbutton, #pageheader a.bigbutton { position: relative; display: table-cell; vertical-align: middle; - width: 90px; - height: 90px; + width: 120px; + height: 120px; overflow: hidden; text-align: center; float: left; @@ -739,15 +739,13 @@ a.bigbutton, #pageheader a.bigbutton { position: absolute; top: 0; left: 0; - width: 90px; + width: 120px; font-weight: bold; - font-size: 8pt; + font-size: 9pt; color: #fff; text-align: left; background-color: transparent; background-color: rgba(0, 0, 0, 0.4); - /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */ - filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#66000000, endColorstr=#66000000); /* IE6–IE9 */ text-shadow: 2px 2px 1px #000000; } @@ -1210,3 +1208,94 @@ ul.errors { width: 13px; height: 13px; } + +.thumbnails-update-container { + padding: 20px 0; + width: 50%; + margin: auto; +} + +.thumbnails-update-container .thumbnail-placeholder { + background: grey; + margin: auto; +} + +.thumbnails-update-container .thumbnail-link-title { + width: 75%; + margin: auto; + + padding-bottom: 20px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.progressbar { + border-radius: 6px; + background-color: #111; + padding: 1px; +} + +.progressbar > div { + border-radius: 10px; + background: repeating-linear-gradient( + -45deg, + #f5f5f5, + #f5f5f5 6px, + #d0d0d0 6px, + #d0d0d0 12px + ); + width: 0%; + height: 10px; +} + +.loading-input { + position: relative; +} + +@keyframes around { + 0% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(360deg); + } +} + +.loading-input .icon-container { + position: absolute; + right: 60px; + top: calc(50% - 10px); +} + +.loading-input .loader { + position: relative; + height: 20px; + width: 20px; + display: inline-block; + animation: around 5.4s infinite; +} + +.loading-input .loader::after, +.loading-input .loader::before { + content: ""; + background: #eee; + position: absolute; + display: inline-block; + width: 100%; + height: 100%; + border-width: 2px; + border-color: #333 #333 transparent transparent; + border-style: solid; + border-radius: 20px; + box-sizing: border-box; + top: 0; + left: 0; + animation: around 0.7s ease-in-out infinite; +} + +.loading-input .loader::after { + animation: around 0.7s ease-in-out 0.1s infinite; + background: transparent; +}