diff --git a/dist/css/changelog.css b/dist/css/changelog.css index 31b81e83..dd82cff0 100644 --- a/dist/css/changelog.css +++ b/dist/css/changelog.css @@ -1 +1 @@ -section.infobox{opacity:0;pointer-events:none}section.infobox.visible{opacity:1;pointer-events:auto}section.infobox{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;transform:translate3d(0, -40px, 0);transition:opacity 0.5s, transform 0.5s}section.infobox.visible{transform:translate3d(0, 0, 0)}section.infobox>div{position:relative;max-width:650px;padding:40px 30px;background:linear-gradient(45deg, #7b5fa4 0%, #2b35c8 100%);color:#fff;text-align:center;box-shadow:0 0 50px rgba(0,0,0,0.3)}@media (max-width: 650px){section.infobox>div{width:100%}}section.infobox>div span.icon{display:block;background:url(chrome-extension://__MSG_@@extension_id__/img/icon/icon.webp) no-repeat center/96px;height:96px;margin:40px 0}section.infobox>div h1{font-size:250%;font-weight:200}@media (max-width: 650px){section.infobox>div h1{font-size:200%}}@media (max-width: 400px){section.infobox>div h1{font-size:170%}}section.infobox>div a.cta{display:block;margin:0 auto 30px;width:250px;background:#fff;box-shadow:0 0 15px rgba(0,0,0,0.6);color:#7b5fa4;font-size:140%;font-weight:300;text-decoration:none;padding:10px 20px;border-radius:3px}@media (max-width: 650px){section.infobox>div a.cta{font-size:120%;width:220px}}section.infobox>div a.close{text-decoration:none;color:#fff;opacity:0.5}*,*::after,*::before{padding:0;margin:0;box-sizing:border-box}body,input,textarea,select,button{font-size:14px;font-family:Roboto,sans-serif;color:#666;font-weight:300}ul{list-style:none}strong{font-weight:400}a{color:#666;text-decoration:none}body{background:#f2f2f2;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}section.infobox{perspective:800px}section.infobox>div{position:relative;width:100%;max-width:650px;height:430px;transform-style:preserve-3d;transition:transform 1s}section.infobox>div>div{position:absolute;width:100%;height:100%;top:0;left:0;padding:40px 30px;transform-style:preserve-3d;backface-visibility:hidden}section.infobox>div>div.back{text-align:left;transform:rotateX(180deg)}section.infobox>div>div.back a.close{position:absolute;top:40px;right:45px;display:block;width:42px;height:42px;background:url(chrome-extension://__MSG_@@extension_id__/img/icon-close.webp) no-repeat center;background-size:22px;cursor:pointer;border-radius:50%;transition:background-color 0.3s;z-index:2}section.infobox>div>div.back a.close:hover{background-color:rgba(255,255,255,0.1)}section.infobox.flipped>div{transform:rotateX(180deg)}section.infobox ul.changelog{margin-top:70px}section.infobox ul.changelog>li{padding:10px 0}section.infobox ul.changelog>li::before{content:"-";margin:0 10px 0 0} +section.infobox{opacity:0;pointer-events:none}section.infobox.visible{opacity:1;pointer-events:auto}section.infobox{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;transform:translate3d(0, -40px, 0);transition:opacity 0.5s, transform 0.5s}section.infobox.visible{transform:translate3d(0, 0, 0)}section.infobox>div{position:relative;max-width:650px;padding:40px 30px;background:linear-gradient(45deg, #7b5fa4 0%, #2b35c8 100%);color:#fff;text-align:center;box-shadow:0 0 50px rgba(0,0,0,0.3)}@media (max-width: 650px){section.infobox>div{width:100%}}section.infobox>div span.icon{display:block;background:url(chrome-extension://__MSG_@@extension_id__/img/icon/icon.webp) no-repeat center/96px;height:96px;margin:40px 0}section.infobox>div h1{font-size:250%;line-height:130%;font-weight:200}@media (max-width: 650px){section.infobox>div h1{font-size:200%}}@media (max-width: 400px){section.infobox>div h1{font-size:170%}}section.infobox>div a.cta{display:block;margin:0 auto 30px;width:250px;background:#fff;box-shadow:0 0 15px rgba(0,0,0,0.6);color:#7b5fa4;font-size:140%;font-weight:300;text-decoration:none;padding:10px 20px;border-radius:3px}@media (max-width: 650px){section.infobox>div a.cta{font-size:120%;width:220px}}section.infobox>div a.close{text-decoration:none;color:#fff;opacity:0.5}*,*::after,*::before{padding:0;margin:0;box-sizing:border-box}body,input,textarea,select,button{font-size:14px;font-family:Roboto,sans-serif;color:#666;font-weight:300}ul{list-style:none}strong{font-weight:400}a{color:#666;text-decoration:none}body{background:#f2f2f2;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}section.infobox{perspective:800px}section.infobox>div{position:relative;width:100%;max-width:650px;height:430px;transform-style:preserve-3d;transition:transform 1s}section.infobox>div>div{position:absolute;width:100%;height:100%;top:0;left:0;padding:40px 30px;transform-style:preserve-3d;backface-visibility:hidden}section.infobox>div>div.back{text-align:left;transform:rotateX(180deg)}section.infobox>div>div.back a.close{position:absolute;top:40px;right:45px;display:block;width:42px;height:42px;background:url(chrome-extension://__MSG_@@extension_id__/img/icon-close.webp) no-repeat center;background-size:22px;cursor:pointer;border-radius:50%;transition:background-color 0.3s;z-index:2}section.infobox>div>div.back a.close:hover{background-color:rgba(255,255,255,0.1)}section.infobox.flipped>div{transform:rotateX(180deg)}section.infobox ul.changelog{margin-top:70px}section.infobox ul.changelog li{padding:10px 0}section.infobox ul.changelog li:not(.noIndicator)::before{content:"-";margin:0 10px 0 0}section.infobox ul.changelog li ul{margin:10px 0 0 25px} diff --git a/dist/css/howto.css b/dist/css/howto.css index bd30c391..68b20237 100644 --- a/dist/css/howto.css +++ b/dist/css/howto.css @@ -1 +1 @@ -section.infobox,section#tutorial,section#tutorial>*:not(#background),section#tutorial>div#cursor::after,section#tutorial>div#cursor::before{opacity:0;pointer-events:none}section.infobox.visible,section#tutorial.visible,section#tutorial>*.visible:not(#background),section#tutorial>div#cursor[data-step='2']::after,section#tutorial>div#cursor[data-step='2']::before{opacity:1;pointer-events:auto}section.infobox{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;transform:translate3d(0, -40px, 0);transition:opacity 0.5s, transform 0.5s}section.infobox.visible{transform:translate3d(0, 0, 0)}section.infobox>div{position:relative;max-width:650px;padding:40px 30px;background:linear-gradient(45deg, #7b5fa4 0%, #2b35c8 100%);color:#fff;text-align:center;box-shadow:0 0 50px rgba(0,0,0,0.3)}@media (max-width: 650px){section.infobox>div{width:100%}}section.infobox>div span.icon{display:block;background:url(chrome-extension://__MSG_@@extension_id__/img/icon/icon.webp) no-repeat center/96px;height:96px;margin:40px 0}section.infobox>div h1{font-size:250%;font-weight:200}@media (max-width: 650px){section.infobox>div h1{font-size:200%}}@media (max-width: 400px){section.infobox>div h1{font-size:170%}}section.infobox>div a.cta{display:block;margin:0 auto 30px;width:250px;background:#fff;box-shadow:0 0 15px rgba(0,0,0,0.6);color:#7b5fa4;font-size:140%;font-weight:300;text-decoration:none;padding:10px 20px;border-radius:3px}@media (max-width: 650px){section.infobox>div a.cta{font-size:120%;width:220px}}section.infobox>div a.close{text-decoration:none;color:#fff;opacity:0.5}*,*::after,*::before{padding:0;margin:0;box-sizing:border-box}body,input,textarea,select,button{font-size:14px;font-family:Roboto,sans-serif;color:#666;font-weight:300}ul{list-style:none}strong{font-weight:400}a{color:#666;text-decoration:none}body{background:#f2f2f2;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}@keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}section#tutorial{position:absolute;top:0;left:0;width:100%;height:100%;transition:opacity 0.5s;background:#e9e9e9}section#tutorial>*:not(#background){transition:opacity 0.5s}section#tutorial>p.text{position:absolute;top:20px;left:calc(50% - 300px);font-size:150%;font-weight:300;padding:25px 30px;width:600px;background:linear-gradient(45deg, #7b5fa4 0%, #2b35c8 100%);color:#fff;box-shadow:0 0 15px rgba(0,0,0,0.6);z-index:5}section#tutorial>p.text:first-letter{text-transform:uppercase}@media (max-width: 650px){section#tutorial>p.text{width:100%;top:0;left:0}}section#tutorial>div#sidebar{position:absolute;top:0;left:0;width:300px;height:100%;background:#fff;padding:30px 30px 0 80px;box-shadow:0 0 30px rgba(0,0,0,0.2);transform:translate3d(-350px, 0, 0);transition:transform 0.5s;z-index:3}section#tutorial>div#sidebar.visible{transform:translate3d(0, 0, 0) !important}section#tutorial>div#sidebar>p{position:relative;width:100%;height:12px;background:#f1f2f4;margin:50px 0}section#tutorial>div#sidebar>p::before{content:"";position:absolute;top:-10px;left:-50px;width:32px;height:32px;border-radius:50%;background:#f1f2f4}section#tutorial>div#cursor{position:absolute;top:calc(50% - 18px);left:calc(50% - 12px);display:block;width:24px;height:36px;background:url(chrome-extension://__MSG_@@extension_id__/img/howto/cursor.webp) no-repeat center;background-size:24px;transition:opacity 0.5s, left 2s, right 2s, top 2s;z-index:4}section#tutorial>div#cursor::after,section#tutorial>div#cursor::before{content:"";position:absolute;top:0;right:-55px;width:50px;height:50px;border-radius:50%;transition:opacity 0.5s;visibility:hidden}section#tutorial>div#cursor::after{background-image:url(chrome-extension://__MSG_@@extension_id__/img/howto/mouse.webp),linear-gradient(45deg, #7b5fa4 0%, #2b35c8 100%);background-size:20px, 100%;background-position:center, 0 0;background-repeat:no-repeat}section#tutorial>div#cursor::before{background:url(chrome-extension://__MSG_@@extension_id__/img/howto/mouse-active.webp) no-repeat center/20px;animation:blink 1s infinite;z-index:2}section#tutorial>div#cursor.reversed::before{transform:scaleX(-1)}section#tutorial>div#cursor[data-step='1'],section#tutorial>div#cursor[data-step='2']{top:30%;left:0}section#tutorial>div#cursor[data-step='3']{top:calc(30% - 20px);left:40px}section#tutorial>div#cursor[data-step='2']::after,section#tutorial>div#cursor[data-step='2']::before{visibility:visible}section#tutorial[data-pos='right']>div#sidebar{left:auto;right:0;transform:translate3d(350px, 0, 0)}section#tutorial[data-pos='right']>div#cursor{left:auto;right:calc(50% - 12px)}section#tutorial[data-pos='right']>div#cursor[data-step='1'],section#tutorial[data-pos='right']>div#cursor[data-step='2']{right:0}section#tutorial[data-pos='right']>div#cursor[data-step='3']{right:40px}section#tutorial[data-pos='right']>div#cursor::after,section#tutorial[data-pos='right']>div#cursor::before{right:auto;left:-55px}section#tutorial>div#mask{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);display:flex;align-items:center;justify-content:center;z-index:5}section#tutorial>div#mask>div{text-align:center;padding:0 20px}section#tutorial>div#mask>div>a{display:inline-block;background:#fff;box-shadow:0 0 15px rgba(0,0,0,0.6);color:#7b5fa4;font-size:140%;font-weight:300;padding:10px 20px;border-radius:3px;margin:0 10px}@media (max-width: 500px){section#tutorial>div#mask>div>a{display:block;margin:25px 0}}section#tutorial>div#background{position:absolute;top:0;left:0;width:100%;height:100%;padding:60px 0 0 0}section#tutorial>div#background>div{position:absolute;top:0;left:0;width:100%;height:60px;background:#fff}section#tutorial>div#background>p{background:#fff url(chrome-extension://__MSG_@@extension_id__/img/howto/placeholder.webp) no-repeat 30px 30px/calc(100% - 60px);max-width:750px;height:350px;margin:30px auto} +section.infobox,section#tutorial,section#tutorial>*:not(#background),section#tutorial>div#cursor::after,section#tutorial>div#cursor::before{opacity:0;pointer-events:none}section.infobox.visible,section#tutorial.visible,section#tutorial>*.visible:not(#background),section#tutorial>div#cursor[data-step='2']::after,section#tutorial>div#cursor[data-step='2']::before{opacity:1;pointer-events:auto}section.infobox{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;transform:translate3d(0, -40px, 0);transition:opacity 0.5s, transform 0.5s}section.infobox.visible{transform:translate3d(0, 0, 0)}section.infobox>div{position:relative;max-width:650px;padding:40px 30px;background:linear-gradient(45deg, #7b5fa4 0%, #2b35c8 100%);color:#fff;text-align:center;box-shadow:0 0 50px rgba(0,0,0,0.3)}@media (max-width: 650px){section.infobox>div{width:100%}}section.infobox>div span.icon{display:block;background:url(chrome-extension://__MSG_@@extension_id__/img/icon/icon.webp) no-repeat center/96px;height:96px;margin:40px 0}section.infobox>div h1{font-size:250%;line-height:130%;font-weight:200}@media (max-width: 650px){section.infobox>div h1{font-size:200%}}@media (max-width: 400px){section.infobox>div h1{font-size:170%}}section.infobox>div a.cta{display:block;margin:0 auto 30px;width:250px;background:#fff;box-shadow:0 0 15px rgba(0,0,0,0.6);color:#7b5fa4;font-size:140%;font-weight:300;text-decoration:none;padding:10px 20px;border-radius:3px}@media (max-width: 650px){section.infobox>div a.cta{font-size:120%;width:220px}}section.infobox>div a.close{text-decoration:none;color:#fff;opacity:0.5}*,*::after,*::before{padding:0;margin:0;box-sizing:border-box}body,input,textarea,select,button{font-size:14px;font-family:Roboto,sans-serif;color:#666;font-weight:300}ul{list-style:none}strong{font-weight:400}a{color:#666;text-decoration:none}body{background:#f2f2f2;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}@keyframes blink{0%{opacity:1}50%{opacity:0}100%{opacity:1}}section#tutorial{position:absolute;top:0;left:0;width:100%;height:100%;transition:opacity 0.5s;background:#e9e9e9}section#tutorial>*:not(#background){transition:opacity 0.5s}section#tutorial>p.text{position:absolute;top:20px;left:calc(50% - 300px);font-size:150%;font-weight:300;padding:25px 30px;width:600px;background:linear-gradient(45deg, #7b5fa4 0%, #2b35c8 100%);color:#fff;box-shadow:0 0 15px rgba(0,0,0,0.6);z-index:5}section#tutorial>p.text:first-letter{text-transform:uppercase}@media (max-width: 650px){section#tutorial>p.text{width:100%;top:0;left:0}}section#tutorial>div#sidebar{position:absolute;top:0;left:0;width:300px;height:100%;background:#fff;padding:30px 30px 0 80px;box-shadow:0 0 30px rgba(0,0,0,0.2);transform:translate3d(-350px, 0, 0);transition:transform 0.5s;z-index:3}section#tutorial>div#sidebar.visible{transform:translate3d(0, 0, 0) !important}section#tutorial>div#sidebar>p{position:relative;width:100%;height:12px;background:#f1f2f4;margin:50px 0}section#tutorial>div#sidebar>p::before{content:"";position:absolute;top:-10px;left:-50px;width:32px;height:32px;border-radius:50%;background:#f1f2f4}section#tutorial>div#cursor{position:absolute;top:calc(50% - 18px);left:calc(50% - 12px);display:block;width:24px;height:36px;background:url(chrome-extension://__MSG_@@extension_id__/img/howto/cursor.webp) no-repeat center;background-size:24px;transition:opacity 0.5s, left 2s, right 2s, top 2s;z-index:4}section#tutorial>div#cursor::after,section#tutorial>div#cursor::before{content:"";position:absolute;top:0;right:-55px;width:50px;height:50px;border-radius:50%;transition:opacity 0.5s;visibility:hidden}section#tutorial>div#cursor::after{background-image:url(chrome-extension://__MSG_@@extension_id__/img/howto/mouse.webp),linear-gradient(45deg, #7b5fa4 0%, #2b35c8 100%);background-size:20px, 100%;background-position:center, 0 0;background-repeat:no-repeat}section#tutorial>div#cursor::before{background:url(chrome-extension://__MSG_@@extension_id__/img/howto/mouse-active.webp) no-repeat center/20px;animation:blink 1s infinite;z-index:2}section#tutorial>div#cursor.reversed::before{transform:scaleX(-1)}section#tutorial>div#cursor[data-step='1'],section#tutorial>div#cursor[data-step='2']{top:30%;left:0}section#tutorial>div#cursor[data-step='3']{top:calc(30% - 20px);left:40px}section#tutorial>div#cursor[data-step='2']::after,section#tutorial>div#cursor[data-step='2']::before{visibility:visible}section#tutorial[data-pos='right']>div#sidebar{left:auto;right:0;transform:translate3d(350px, 0, 0)}section#tutorial[data-pos='right']>div#cursor{left:auto;right:calc(50% - 12px)}section#tutorial[data-pos='right']>div#cursor[data-step='1'],section#tutorial[data-pos='right']>div#cursor[data-step='2']{right:0}section#tutorial[data-pos='right']>div#cursor[data-step='3']{right:40px}section#tutorial[data-pos='right']>div#cursor::after,section#tutorial[data-pos='right']>div#cursor::before{right:auto;left:-55px}section#tutorial>div#mask{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);display:flex;align-items:center;justify-content:center;z-index:5}section#tutorial>div#mask>div{text-align:center;padding:0 20px}section#tutorial>div#mask>div>a{display:inline-block;background:#fff;box-shadow:0 0 15px rgba(0,0,0,0.6);color:#7b5fa4;font-size:140%;font-weight:300;padding:10px 20px;border-radius:3px;margin:0 10px}@media (max-width: 500px){section#tutorial>div#mask>div>a{display:block;margin:25px 0}}section#tutorial>div#background{position:absolute;top:0;left:0;width:100%;height:100%;padding:60px 0 0 0}section#tutorial>div#background>div{position:absolute;top:0;left:0;width:100%;height:60px;background:#fff}section#tutorial>div#background>p{background:#fff url(chrome-extension://__MSG_@@extension_id__/img/howto/placeholder.webp) no-repeat 30px 30px/calc(100% - 60px);max-width:750px;height:350px;margin:30px auto} diff --git a/dist/css/overlay.css b/dist/css/overlay.css index 599b3ccb..9052d194 100644 --- a/dist/css/overlay.css +++ b/dist/css/overlay.css @@ -1 +1 @@ -div.modal[data-type='infos']>ul>li>ul,div.modal>menu>a::before{opacity:0;pointer-events:none}@keyframes container-rotate{to{transform:rotate(360deg)}}@keyframes left-spin{from, to{transform:rotate(130deg)}50%{transform:rotate(-5deg)}}@keyframes right-spin{from, to{transform:rotate(-130deg)}50%{transform:rotate(5deg)}}@keyframes fill-unfill-rotate{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}to{transform:rotate(1080deg)}}div.loading{display:block;position:relative;width:36px;height:36px;animation:container-rotate 1568ms linear infinite}div.loading>div{position:absolute;top:0;left:0;width:100%;height:100%;border-color:"%colorScheme";animation:fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both}div.loading>div>div.circle-clipper{position:relative;display:inline-block;width:50%;height:100%;overflow:hidden;float:left}div.loading>div>div.circle-clipper>div{width:200%;height:100%;border:3px solid "%colorScheme";border-bottom-color:transparent;border-radius:50%;position:absolute;top:0;right:0;bottom:0}div.loading>div>div.circle-clipper.left>div{left:0;border-right-color:transparent;transform:rotate(129deg);animation:left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both}div.loading>div>div.circle-clipper.right>div{left:-100%;border-left-color:transparent;transform:rotate(-129deg);animation:right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both}div.loading>div>div.gap-patch{position:absolute;top:0;left:45%;width:10%;height:100%;border-color:inherit;overflow:hidden}div.loading>div>div.gap-patch>div{width:1000%;left:-450%}div.scrollBox{position:relative;overflow:hidden}div.scrollBox>div.scrollbar{position:absolute;top:0;right:0;width:15px;padding:4px 0;height:100%;transition:opacity 0.5s, background 0.3s;cursor:pointer;z-index:2}div.scrollBox>div.scrollbar.inactive{display:none}div.scrollBox>div.scrollbar.hidden:not(:hover){opacity:0}div.scrollBox>div.scrollbar>div{position:absolute;top:0;right:3px;width:5px;height:0;background:#ccc;border-radius:3px;transition:transform 0.3s, width 0.3s, height 0.3s, border-radius 0.3s, background 0.3s}div.scrollBox>div.scrollbar:hover{background:#f2f2f2}div.scrollBox>div.scrollbar:hover>div{width:8px;border-radius:6px;background:#bbb}div.scrollBox.scrollDrag>div.scrollbar{background:#f2f2f2;opacity:1}div.scrollBox.scrollDrag>div.scrollbar>div{width:8px;border-radius:6px;background:#bbb}div.scrollBox.scrollDrag>div.scrollbar>div{transition:none}div.scrollBox.scrollTrackpad>div.scrollbar>div{transition:none}div.checkbox{position:relative;width:18px;height:18px;border:2px solid #6d6d6d;border-radius:2px;cursor:pointer;background-repeat:no-repeat;background-position:center;background-size:100%;transition:background 0.3s, border-color 0.3s}div.checkbox::before{content:"";position:absolute;top:calc(50% - 1px);left:calc(50% - 1px);width:2px;height:2px;border-radius:50%;pointer-events:none;box-shadow:0 0 0 0 rgba(0,0,0,0.5);transition:background 0.2s, box-shadow 0.2s, opacity 0.5s;opacity:0.2}div.checkbox.focus::before,div.checkbox.clicked::before{background:rgba(0,0,0,0.5);box-shadow:0 0 0 22px rgba(0,0,0,0.5)}div.checkbox.clicked::before{opacity:0}div.checkbox.active{background-color:"%colorScheme";background-image:url(chrome-extension://__MSG_@@extension_id__/img/icon-check.webp);border-color:"%colorScheme"}div.checkbox.active::before{box-shadow:0 0 0 0 "%colorScheme"}div.checkbox.active.focus::before,div.checkbox.active.clicked::before{background:"%colorScheme";box-shadow:0 0 0 22px "%colorScheme"}div.checkbox>input[type='checkbox']{display:none}*,*::after,*::before{padding:0;margin:0;box-sizing:border-box}body,input,textarea,select,button{font-size:14px;font-family:Roboto,sans-serif;color:#666;font-weight:300}ul{list-style:none}strong{font-weight:400}a{color:#666;text-decoration:none}body{height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}body::before{content:"";position:relative;display:block;height:1px}div.modal{position:relative;width:500px;height:400px;background:#fff;box-shadow:0 12px 50px rgba(0,0,0,0.3);overflow:hidden;z-index:2;transform:scale(0.7);transition:transform 0.3s}div.modal.visible{transform:scale(1)}div.modal>h1{color:#fff;font-size:170%;font-weight:200;height:60px;padding:15px 75px 14px 55px;background:"%colorScheme" url(chrome-extension://__MSG_@@extension_id__/img/bookmark.webp) no-repeat 20px center;background-size:24px}div.modal>a.close{position:absolute;top:9px;right:20px;display:block;width:42px;height:42px;background:url(chrome-extension://__MSG_@@extension_id__/img/icon-close.webp) no-repeat center;background-size:22px;cursor:pointer;border-radius:50%;transition:background-color 0.3s;z-index:2}div.modal>a.close:hover{background-color:rgba(255,255,255,0.1)}div.modal>a.preview,div.modal>span.preview{display:block;font-size:140%;font-weight:300;margin:30px 30px 20px 30px;background-color:rgba(0,0,0,0.05);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:17px 15px}div.modal>a.preview>img,div.modal>span.preview>img{vertical-align:top;display:inline-block;width:24px;margin:0 20px 0 0}div.modal>a.preview{transition:background-color 0.3s;cursor:pointer}div.modal>a.preview:hover{background-color:rgba(0,0,0,0.1)}div.modal>a.preview+a.previewUrl{display:block;margin:-15px 30px 20px 30px;font-size:80%;opacity:0.7;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;cursor:pointer}div.modal[data-type='updateUrls']>p{text-align:center;margin-top:40px;font-size:140%;line-height:170%}div.modal[data-type='updateUrls']>div.progressBar{position:relative;background:rgba(0,0,0,0.1);height:3px;margin:40px 30px 0}div.modal[data-type='updateUrls']>div.progressBar>div{position:absolute;top:0;left:0;height:100%;background:"%colorScheme";transition:width 0.5s}div.modal[data-type='updateUrls']>span.progressLabel{display:block;text-align:center;font-size:120%;margin-top:20px;color:#ccc}div.modal[data-type='updateUrls']>span.progressLabel>span{margin:0 3px;color:#b3b3b3}div.modal[data-type='updateUrls']>div.loading{margin:60px auto 0;transition:margin-top 0.5s}div.modal[data-type='updateUrls']>div#urlList{height:calc(100% - 60px - 57px);transition:box-shadow 0.3s}div.modal[data-type='updateUrls']>div#urlList::before{content:"";position:absolute;top:0;left:0;width:100%;height:12px;pointer-events:none;box-shadow:none;transition:box-shadow 0.3s;z-index:3}div.modal[data-type='updateUrls']>div#urlList::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:12px;pointer-events:none;box-shadow:inset 0 -10px 10px -10px rgba(0,0,0,0.2);transition:box-shadow 0.3s;z-index:3}div.modal[data-type='updateUrls']>div#urlList.scrolled::before{box-shadow:inset 0 10px 10px -10px rgba(0,0,0,0.5)}div.modal[data-type='updateUrls']>div#urlList.scrolledEnd::after{box-shadow:none}div.modal[data-type='updateUrls']>div#urlList>ul{margin:12px 0}div.modal[data-type='updateUrls']>div#urlList>ul>li{transition:background 0.3s;padding:0 16px 7px 16px}div.modal[data-type='updateUrls']>div#urlList>ul>li:hover{background:#f5f5f5}div.modal[data-type='updateUrls']>div#urlList>ul>li>div.checkbox{display:inline-block;vertical-align:top;margin:10px 16px 0 0}div.modal[data-type='updateUrls']>div#urlList>ul>li>img{vertical-align:top;display:inline-block;width:16px;margin:11px 20px 0 0}div.modal[data-type='updateUrls']>div#urlList>ul>li>strong{display:inline-block;width:calc(100% - 70px);line-height:40px;margin-bottom:-10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}div.modal[data-type='updateUrls']>div#urlList>ul>li>a,div.modal[data-type='updateUrls']>div#urlList>ul>li>span{display:block;color:#aaa;margin-left:70px;line-height:20px;width:calc(100% - 36px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:18px}div.modal[data-type='updateUrls']>div#urlList>ul>li>a{transition:color 0.5s;background-size:12px;background-repeat:no-repeat;background-position:0 center}div.modal[data-type='updateUrls']>div#urlList>ul>li>a:hover{color:"%colorScheme"}div.modal[data-type='updateUrls']>div#urlList>ul>li>a:last-of-type{background-image:url(chrome-extension://__MSG_@@extension_id__/img/icon-success.webp)}div.modal[data-type='updateUrls']>div#urlList>ul>li>a:first-of-type{text-decoration:line-through;background-image:url(chrome-extension://__MSG_@@extension_id__/img/icon-error.webp)}div.modal[data-type='updateUrls']>div#urlList>ul>li>span{font-style:italic}div.modal[data-type='updateUrls']>div#urlList:not(.scrollDrag)>ul{transition:transform 0.3s}div.modal[data-type='updateUrls'].urlCheckLoading{transition:width 0.5s, height 0.5s, margin-top 0.5s}div.modal[data-type='updateUrls'].urlCheckFinished{width:600px;height:600px;margin-top:calc(50vh - 300px)}div.modal[data-type='updateUrls'].urlCheckFinished::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:57px;z-index:2;background:#f5f5f5}div.modal[data-type='updateUrls'].urlCheckFinished>div.loading{margin-top:150px}div.modal[data-type='delete']>p{padding:30px 30px 5px 30px;font-size:140%;line-height:170%}div.modal[data-type='infos']>ul{display:flex;flex-flow:row;font-size:120%;margin-top:70px;padding:0 30px;justify-content:space-between}div.modal[data-type='infos']>ul>li{position:relative}div.modal[data-type='infos']>ul>li.tooltip{cursor:help;background:url(chrome-extension://__MSG_@@extension_id__/img/icon-infos.webp) no-repeat right center;background-size:16px;padding-right:18px}div.modal[data-type='infos']>ul>li>ul{position:absolute;top:27px;right:-14px;background:#333;color:#fff;font-size:70%;padding:4px 10px;transform:translate3d(0, -5px, 0);transition:opacity 0.3s, transform 0.3s}div.modal[data-type='infos']>ul>li>ul::before{content:"";position:absolute;top:-14px;right:15px;border:7px solid transparent;border-bottom-color:#333}div.modal[data-type='infos']>ul>li>ul>li{white-space:nowrap;margin:5px 0}div.modal[data-type='infos']>ul>li:hover>ul{opacity:1;transform:translate3d(0, 0, 0)}div.modal[data-type='edit']>ul{padding:2px 30px}div.modal[data-type='edit']>ul>li{margin:20px 0 30px 0}div.modal[data-type='edit']>ul>li>label{font-size:140%;display:inline-block;width:80px}div.modal[data-type='edit']>ul>li>input{display:inline-block;font-size:140%;width:calc(100% - 80px);padding:5px 8px;outline:none;box-shadow:none;transition:border-color 0.5s;border:1px solid rgba(0,0,0,0.1)}div.modal[data-type='edit']>ul>li>input.error{border-color:#f99}div.modal[data-type='edit']>ul>li>input:focus{border-color:rgba(0,0,0,0.25)}div.modal>menu{position:absolute;bottom:16px;right:20px;z-index:3}div.modal>menu>a{position:relative;display:inline-block;padding:5px 10px 4px;margin:0 5px;color:"%colorScheme";font-weight:400;text-transform:uppercase;border-radius:3px;cursor:pointer}div.modal>menu>a::before{content:"";position:absolute;display:block;top:0;left:0;width:100%;height:100%;border-radius:3px;background:"%colorScheme";transition:opacity 0.5s}div.modal>menu>a:hover::before{opacity:0.15} +div.modal[data-type='infos']>ul>li>ul,div.modal>menu>a::before{opacity:0;pointer-events:none}@keyframes container-rotate{to{transform:rotate(360deg)}}@keyframes left-spin{from, to{transform:rotate(130deg)}50%{transform:rotate(-5deg)}}@keyframes right-spin{from, to{transform:rotate(-130deg)}50%{transform:rotate(5deg)}}@keyframes fill-unfill-rotate{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}to{transform:rotate(1080deg)}}div.loading{display:block;position:relative;width:36px;height:36px;animation:container-rotate 1568ms linear infinite}div.loading>div{position:absolute;top:0;left:0;width:100%;height:100%;border-color:"%colorScheme";animation:fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both}div.loading>div>div.circle-clipper{position:relative;display:inline-block;width:50%;height:100%;overflow:hidden;float:left}div.loading>div>div.circle-clipper>div{width:200%;height:100%;border:3px solid "%colorScheme";border-bottom-color:transparent;border-radius:50%;position:absolute;top:0;right:0;bottom:0}div.loading>div>div.circle-clipper.left>div{left:0;border-right-color:transparent;transform:rotate(129deg);animation:left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both}div.loading>div>div.circle-clipper.right>div{left:-100%;border-left-color:transparent;transform:rotate(-129deg);animation:right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both}div.loading>div>div.gap-patch{position:absolute;top:0;left:45%;width:10%;height:100%;border-color:inherit;overflow:hidden}div.loading>div>div.gap-patch>div{width:1000%;left:-450%}div.scrollBox{position:relative;overflow:hidden}div.scrollBox>div.scrollbar{position:absolute;top:0;right:0;width:15px;padding:4px 0;height:100%;transition:opacity 0.5s, background 0.3s;cursor:pointer;z-index:2}div.scrollBox>div.scrollbar.inactive{display:none}div.scrollBox>div.scrollbar.hidden:not(:hover){opacity:0}div.scrollBox>div.scrollbar>div{position:absolute;top:0;right:3px;width:5px;height:0;background:#ccc;border-radius:3px;transition:transform 0.3s, width 0.3s, height 0.3s, border-radius 0.3s, background 0.3s}div.scrollBox>div.scrollbar:hover{background:#f2f2f2}div.scrollBox>div.scrollbar:hover>div{width:8px;border-radius:6px;background:#bbb}div.scrollBox.scrollDrag>div.scrollbar{background:#f2f2f2;opacity:1}div.scrollBox.scrollDrag>div.scrollbar>div{width:8px;border-radius:6px;background:#bbb}div.scrollBox.scrollDrag>div.scrollbar>div{transition:none}div.scrollBox.scrollTrackpad>div.scrollbar>div{transition:none}div.checkbox{position:relative;width:18px;height:18px;border:2px solid #6d6d6d;border-radius:2px;cursor:pointer;background-repeat:no-repeat;background-position:center;background-size:100%;transition:background 0.3s, border-color 0.3s}div.checkbox::before{content:"";position:absolute;top:calc(50% - 1px);left:calc(50% - 1px);width:2px;height:2px;border-radius:50%;pointer-events:none;box-shadow:0 0 0 0 rgba(0,0,0,0.5);transition:background 0.2s, box-shadow 0.2s, opacity 0.5s;opacity:0.2}div.checkbox.focus::before,div.checkbox.clicked::before{background:rgba(0,0,0,0.5);box-shadow:0 0 0 22px rgba(0,0,0,0.5)}div.checkbox.clicked::before{opacity:0}div.checkbox.active{background-color:"%colorScheme";background-image:url(chrome-extension://__MSG_@@extension_id__/img/icon-check.webp);border-color:"%colorScheme"}div.checkbox.active::before{box-shadow:0 0 0 0 "%colorScheme"}div.checkbox.active.focus::before,div.checkbox.active.clicked::before{background:"%colorScheme";box-shadow:0 0 0 22px "%colorScheme"}div.checkbox>input[type='checkbox']{display:none}*,*::after,*::before{padding:0;margin:0;box-sizing:border-box}body,input,textarea,select,button{font-size:14px;font-family:Roboto,sans-serif;color:#666;font-weight:300}ul{list-style:none}strong{font-weight:400}a{color:#666;text-decoration:none}body{height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}body::before{content:"";position:relative;display:block;height:1px}div.modal{position:relative;width:500px;height:400px;background:#fff;box-shadow:0 12px 50px rgba(0,0,0,0.3);overflow:hidden;z-index:2;transform:scale(0.7);transition:transform 0.3s}div.modal.visible{transform:scale(1)}div.modal>h1{color:#fff;font-size:170%;font-weight:200;height:60px;padding:15px 75px 14px 55px;background:"%colorScheme" url(chrome-extension://__MSG_@@extension_id__/img/bookmark.webp) no-repeat 20px center;background-size:24px}div.modal>a.close{position:absolute;top:9px;right:20px;display:block;width:42px;height:42px;background:url(chrome-extension://__MSG_@@extension_id__/img/icon-close.webp) no-repeat center;background-size:22px;cursor:pointer;border-radius:50%;transition:background-color 0.3s;z-index:2}div.modal>a.close:hover{background-color:rgba(255,255,255,0.1)}div.modal>a.preview,div.modal>span.preview{display:block;font-size:140%;font-weight:300;margin:30px 30px 20px 30px;background-color:rgba(0,0,0,0.05);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:17px 15px}div.modal>a.preview>img,div.modal>span.preview>img{vertical-align:top;display:inline-block;width:24px;margin:0 20px 0 0}div.modal>a.preview{transition:background-color 0.3s;cursor:pointer}div.modal>a.preview:hover{background-color:rgba(0,0,0,0.1)}div.modal>a.preview+a.previewUrl{display:block;margin:-15px 30px 20px 30px;font-size:80%;opacity:0.7;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;cursor:pointer}div.modal[data-type='updateUrls']>p{text-align:center;margin-top:40px;font-size:140%;line-height:170%}div.modal[data-type='updateUrls']>div.progressBar{position:relative;background:rgba(0,0,0,0.1);height:3px;margin:40px 30px 0}div.modal[data-type='updateUrls']>div.progressBar>div{position:absolute;top:0;left:0;height:100%;background:"%colorScheme";transition:width 0.5s}div.modal[data-type='updateUrls']>span.progressLabel{display:block;text-align:center;font-size:120%;margin-top:20px;color:#ccc}div.modal[data-type='updateUrls']>span.progressLabel>span{margin:0 3px;color:#b3b3b3}div.modal[data-type='updateUrls']>div.loading{margin:60px auto 0;transition:margin-top 0.5s}div.modal[data-type='updateUrls']>div#urlList{height:calc(100% - 60px - 57px);transition:box-shadow 0.3s}div.modal[data-type='updateUrls']>div#urlList::before{content:"";position:absolute;top:0;left:0;width:100%;height:12px;pointer-events:none;box-shadow:none;transition:box-shadow 0.3s;z-index:3}div.modal[data-type='updateUrls']>div#urlList::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:12px;pointer-events:none;box-shadow:inset 0 -10px 10px -10px rgba(0,0,0,0.2);transition:box-shadow 0.3s;z-index:3}div.modal[data-type='updateUrls']>div#urlList.scrolled::before{box-shadow:inset 0 10px 10px -10px rgba(0,0,0,0.5)}div.modal[data-type='updateUrls']>div#urlList.scrolledEnd::after{box-shadow:none}div.modal[data-type='updateUrls']>div#urlList>ul{margin:12px 0}div.modal[data-type='updateUrls']>div#urlList>ul>li{transition:background 0.3s;padding:0 16px 7px 16px}div.modal[data-type='updateUrls']>div#urlList>ul>li:hover{background:#f5f5f5}div.modal[data-type='updateUrls']>div#urlList>ul>li>div.checkbox{display:inline-block;vertical-align:top;margin:10px 16px 0 0}div.modal[data-type='updateUrls']>div#urlList>ul>li>img{vertical-align:top;display:inline-block;width:16px;margin:11px 20px 0 0}div.modal[data-type='updateUrls']>div#urlList>ul>li>strong{display:inline-block;width:calc(100% - 70px);line-height:40px;margin-bottom:-10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}div.modal[data-type='updateUrls']>div#urlList>ul>li>a,div.modal[data-type='updateUrls']>div#urlList>ul>li>span{display:block;color:#aaa;margin-left:70px;line-height:20px;width:calc(100% - 36px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:18px}div.modal[data-type='updateUrls']>div#urlList>ul>li>a{transition:color 0.5s;background-size:12px;background-repeat:no-repeat;background-position:0 center}div.modal[data-type='updateUrls']>div#urlList>ul>li>a:hover{color:"%colorScheme"}div.modal[data-type='updateUrls']>div#urlList>ul>li>a:last-of-type{background-image:url(chrome-extension://__MSG_@@extension_id__/img/icon-success.webp)}div.modal[data-type='updateUrls']>div#urlList>ul>li>a:first-of-type{text-decoration:line-through;background-image:url(chrome-extension://__MSG_@@extension_id__/img/icon-error.webp)}div.modal[data-type='updateUrls']>div#urlList>ul>li>span{font-style:italic}div.modal[data-type='updateUrls']>div#urlList:not(.scrollDrag)>ul{transition:transform 0.3s}div.modal[data-type='updateUrls'].urlCheckLoading{transition:width 0.5s, height 0.5s, margin-top 0.5s}div.modal[data-type='updateUrls'].urlCheckFinished{width:600px;height:600px}div.modal[data-type='updateUrls'].urlCheckFinished::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:57px;z-index:2;background:#f5f5f5}div.modal[data-type='updateUrls'].urlCheckFinished>div.loading{margin-top:150px}div.modal[data-type='delete']>p{padding:30px 30px 5px 30px;font-size:140%;line-height:170%}div.modal[data-type='infos']>ul{display:flex;flex-flow:row;font-size:120%;margin-top:70px;padding:0 30px;justify-content:space-between}div.modal[data-type='infos']>ul>li{position:relative}div.modal[data-type='infos']>ul>li.tooltip{cursor:help;background:url(chrome-extension://__MSG_@@extension_id__/img/icon-infos.webp) no-repeat right center;background-size:16px;padding-right:18px}div.modal[data-type='infos']>ul>li>ul{position:absolute;top:27px;right:-14px;background:#333;color:#fff;font-size:70%;padding:4px 10px;transform:translate3d(0, -5px, 0);transition:opacity 0.3s, transform 0.3s}div.modal[data-type='infos']>ul>li>ul::before{content:"";position:absolute;top:-14px;right:15px;border:7px solid transparent;border-bottom-color:#333}div.modal[data-type='infos']>ul>li>ul>li{white-space:nowrap;margin:5px 0}div.modal[data-type='infos']>ul>li:hover>ul{opacity:1;transform:translate3d(0, 0, 0)}div.modal[data-type='edit']>ul{padding:2px 30px}div.modal[data-type='edit']>ul>li{margin:20px 0 30px 0}div.modal[data-type='edit']>ul>li>label{font-size:140%;display:inline-block;width:80px}div.modal[data-type='edit']>ul>li>input{display:inline-block;font-size:140%;width:calc(100% - 80px);padding:5px 8px;outline:none;box-shadow:none;transition:border-color 0.5s;border:1px solid rgba(0,0,0,0.1)}div.modal[data-type='edit']>ul>li>input.error{border-color:#f99}div.modal[data-type='edit']>ul>li>input:focus{border-color:rgba(0,0,0,0.25)}div.modal>menu{position:absolute;bottom:16px;right:20px;z-index:3}div.modal>menu>a{position:relative;display:inline-block;padding:5px 10px 4px;margin:0 5px;color:"%colorScheme";font-weight:400;text-transform:uppercase;border-radius:3px;cursor:pointer}div.modal>menu>a::before{content:"";position:absolute;display:block;top:0;left:0;width:100%;height:100%;border-radius:3px;background:"%colorScheme";transition:opacity 0.5s}div.modal>menu>a:hover::before{opacity:0.15} diff --git a/dist/html/changelog.html b/dist/html/changelog.html index 7951afa5..57abd0dc 100644 --- a/dist/html/changelog.html +++ b/dist/html/changelog.html @@ -1 +1 @@ -