diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..48873f0 --- /dev/null +++ b/.gitignore @@ -0,0 +1,7 @@ +# Ignore dependencies +node_modules +vendor + +# Ignore operating system files +.DS_Store +Thumbs.db diff --git a/config.rb b/config.rb deleted file mode 100644 index 57ea7e5..0000000 --- a/config.rb +++ /dev/null @@ -1,11 +0,0 @@ -require 'compass/import-once/activate' -http_path = "/betternavigator/" -css_dir = "css" -sass_dir = "scss" -images_dir = "images" -javascripts_dir = "javascript" -fonts_dir = "fonts" -output_style = :compact -relative_assets = true -line_comments = false -sourcemap = true diff --git a/css/betternavigator.css b/css/betternavigator.css index d8b5eb5..1d6b25b 100644 --- a/css/betternavigator.css +++ b/css/betternavigator.css @@ -1,65 +1 @@ -.bn-icon-sprite, .bn-icon-close, .bn-icon-cog, .bn-icon-db, .bn-icon-devmode, .bn-icon-edit, .bn-icon-flush, .bn-icon-info, .bn-icon-tick, .bn-icon-tools, .bn-icon-user, .bn-icon-view { background-image: url('../images/bn-icon-sff60849a67.png'); background-repeat: no-repeat; } - -.bn-icon-close { background-position: 0 0; height: 12px; width: 12px; } - -.bn-icon-cog { background-position: 0 -12px; height: 17px; width: 17px; } - -.bn-icon-db { background-position: 0 -29px; height: 16px; width: 16px; } - -.bn-icon-devmode { background-position: 0 -45px; height: 16px; width: 16px; } - -.bn-icon-edit { background-position: 0 -61px; height: 16px; width: 16px; } - -.bn-icon-flush { background-position: 0 -77px; height: 16px; width: 16px; } - -.bn-icon-info { background-position: 0 -93px; height: 16px; width: 16px; } - -.bn-icon-tick { background-position: 0 -109px; height: 16px; width: 16px; } - -.bn-icon-tools { background-position: 0 -125px; height: 16px; width: 16px; } - -.bn-icon-user { background-position: 0 -141px; height: 16px; width: 16px; } - -.bn-icon-view { background-position: 0 -157px; height: 16px; width: 16px; } - -span[class^='bn-icon'], span[class*=' bn-icon'] { display: inline-block; } - -#BetterNavigator { position: fixed; z-index: 99999; max-height: 100%; overflow: auto; font-family: Helvetica, Arial, sans-serif; font-size: 12px; line-height: 16px; text-align: left; } -#BetterNavigator a { text-decoration: none; } -#BetterNavigator form { display: none; } -#BetterNavigator.collapsed { box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5); } -#BetterNavigator.collapsed.translucent { opacity: 0.5; transition: opacity 250ms; } -#BetterNavigator.collapsed.translucent:hover { opacity: 1; } -#BetterNavigator.collapsed #BetterNavigatorStatus { border-width: 1px; } -#BetterNavigator.collapsed #BetterNavigatorStatus .bn-icon-close { display: none; } -#BetterNavigator.collapsed #BetterNavigatorStatus .bn-icon-cog { display: inline-block; } -#BetterNavigator.collapsed #BetterNavigatorContent { display: none; } -#BetterNavigator.right-top { right: 0; top: 0; } -#BetterNavigator.right-top.collapsed { -moz-transform-origin: right top; -ms-transform-origin: right top; -webkit-transform-origin: right top; transform-origin: right top; -moz-transform: rotate(90deg) translate(100%, 0); -ms-transform: rotate(90deg) translate(100%, 0); -webkit-transform: rotate(90deg) translate(100%, 0); transform: rotate(90deg) translate(100%, 0); } -#BetterNavigator.right-bottom { right: 0; bottom: 0; } -#BetterNavigator.right-bottom.collapsed { -moz-transform-origin: right bottom; -ms-transform-origin: right bottom; -webkit-transform-origin: right bottom; transform-origin: right bottom; -moz-transform: rotate(90deg) translate(0, 100%); -ms-transform: rotate(90deg) translate(0, 100%); -webkit-transform: rotate(90deg) translate(0, 100%); transform: rotate(90deg) translate(0, 100%); } -#BetterNavigator.left-bottom { left: 0; bottom: 0; } -#BetterNavigator.left-bottom.collapsed { -moz-transform-origin: left bottom; -ms-transform-origin: left bottom; -webkit-transform-origin: left bottom; transform-origin: left bottom; -moz-transform: rotate(90deg) translate(-100%, 0); -ms-transform: rotate(90deg) translate(-100%, 0); -webkit-transform: rotate(90deg) translate(-100%, 0); transform: rotate(90deg) translate(-100%, 0); } -#BetterNavigator.left-top { left: 0; top: 0; } -#BetterNavigator.left-top.collapsed { -moz-transform-origin: left top; -ms-transform-origin: left top; -webkit-transform-origin: left top; transform-origin: left top; -moz-transform: rotate(90deg) translate(0, -100%); -ms-transform: rotate(90deg) translate(0, -100%); -webkit-transform: rotate(90deg) translate(0, -100%); transform: rotate(90deg) translate(0, -100%); } - -#BetterNavigatorStatus { color: #fff; background: #6f6f6f; border: 1px solid #646464; border-width: 0; text-transform: uppercase; cursor: pointer; padding: 10px 15px 8px; font-weight: bold; } -#BetterNavigatorStatus .bn-icon-cog { margin: -4px 8px -4px -4px; display: none; } -#BetterNavigatorStatus .bn-icon-close { float: right; margin: 1px 0 0 0; } -#BetterNavigatorStatus .bn-icon-cog, #BetterNavigatorStatus .bn-icon-close { opacity: .7; } -#BetterNavigatorStatus:hover { background: dimgray; } -#BetterNavigatorStatus:hover .bn-icon-cog, #BetterNavigatorStatus:hover .bn-icon-close { opacity: 1; } -#BetterNavigatorStatus.Live { background: #39b54a; border-color: #33a343; } -#BetterNavigatorStatus.Live:hover { background: #36ac46; } -#BetterNavigatorStatus.Draft { background: #f26c4f; border-color: #da6147; } -#BetterNavigatorStatus.Draft:hover { background: #e6674b; } - -#BetterNavigatorContent { padding: 6px; color: #71767a; background: #cfd8de; border: 1px solid #bac2c8; border-width: 0 0 1px 1px; } -#BetterNavigatorContent .bn-heading { text-align: center; text-transform: uppercase; font-size: 11px; margin: 8px 0 4px 0; } -#BetterNavigatorContent span[class^='bn-icon'], #BetterNavigatorContent span[class*=' bn-icon'] { margin: -2px 5px -3px -2px; } -#BetterNavigatorContent a, #BetterNavigatorContent span.bn-disabled { display: block; background: #eceff2; color: #313639; font-family: Helvetica, Arial, sans-serif; font-size: 12px; border-radius: 5px; border-bottom: 1px solid #a3aaaf; margin: 0 0 4px 0; padding: 6px 10px 5px 10px; line-height: 16px; font-weight: bold; } -#BetterNavigatorContent a .light, #BetterNavigatorContent span.bn-disabled .light { font-weight: normal; } -#BetterNavigatorContent a:focus, #BetterNavigatorContent a:hover, #BetterNavigatorContent a:active { background: #fff; color: #000; } -#BetterNavigatorContent span.bn-disabled { background: #afbac0; color: #51565a; cursor: default; } - -body > p.message { text-align: left; background: #fff; color: #222; padding: 10px 20px; margin: 0; border-bottom: 1px solid #ccc; border-left: 5px solid #1d8aff; } +.svg-images--bn-icon--view,#BetterNavigator .bn-icon-view,.svg-images--bn-icon--user,#BetterNavigator .bn-icon-user,.svg-images--bn-icon--tools,#BetterNavigator .bn-icon-tools,.svg-images--bn-icon--tick,#BetterNavigator .bn-icon-tick,.svg-images--bn-icon--info,#BetterNavigator .bn-icon-info,.svg-images--bn-icon--flush,#BetterNavigator .bn-icon-flush,.svg-images--bn-icon--edit,#BetterNavigator .bn-icon-edit,.svg-images--bn-icon--devmode,.svg-images--bn-icon--db,#BetterNavigator .bn-icon-db,.svg-images--bn-icon--cog,#BetterNavigator .bn-icon-cog,.svg-images--bn-icon--close,#BetterNavigator .bn-icon-close{background:url("svg/sprite.css-982681f2.svg") no-repeat}.svg-images--bn-icon--close,#BetterNavigator .bn-icon-close{background-position:0 0}.svg-images--bn-icon--close-dims,#BetterNavigator .bn-icon-close{width:16px;height:16px}.svg-images--bn-icon--cog,#BetterNavigator .bn-icon-cog{background-position:33.3333333333% 0}.svg-images--bn-icon--cog-dims,#BetterNavigator .bn-icon-cog{width:16px;height:16px}.svg-images--bn-icon--db,#BetterNavigator .bn-icon-db{background-position:0 50%}.svg-images--bn-icon--db-dims,#BetterNavigator .bn-icon-db{width:16px;height:16px}.svg-images--bn-icon--devmode{background-position:33.3333333333% 50%}.svg-images--bn-icon--devmode-dims{width:16px;height:16px}.svg-images--bn-icon--edit,#BetterNavigator .bn-icon-edit{background-position:66.6666666667% 0}.svg-images--bn-icon--edit-dims,#BetterNavigator .bn-icon-edit{width:16px;height:16px}.svg-images--bn-icon--flush,#BetterNavigator .bn-icon-flush{background-position:66.6666666667% 50%}.svg-images--bn-icon--flush-dims,#BetterNavigator .bn-icon-flush{width:16px;height:16px}.svg-images--bn-icon--info,#BetterNavigator .bn-icon-info{background-position:0 100%}.svg-images--bn-icon--info-dims,#BetterNavigator .bn-icon-info{width:16px;height:16px}.svg-images--bn-icon--tick,#BetterNavigator .bn-icon-tick{background-position:33.3333333333% 100%}.svg-images--bn-icon--tick-dims,#BetterNavigator .bn-icon-tick{width:16px;height:16px}.svg-images--bn-icon--tools,#BetterNavigator .bn-icon-tools{background-position:66.6666666667% 100%}.svg-images--bn-icon--tools-dims,#BetterNavigator .bn-icon-tools{width:16px;height:16px}.svg-images--bn-icon--user,#BetterNavigator .bn-icon-user{background-position:100% 0}.svg-images--bn-icon--user-dims,#BetterNavigator .bn-icon-user{width:16px;height:16px}.svg-images--bn-icon--view,#BetterNavigator .bn-icon-view{background-position:100% 50%}.svg-images--bn-icon--view-dims,#BetterNavigator .bn-icon-view{width:16px;height:16px}#BetterNavigator{position:fixed;z-index:99999;max-height:100%;text-align:left}#BetterNavigator *{all:initial;font-family:Helvetica,Arial,sans-serif;font-size:12px;line-height:1.2}#BetterNavigator a{text-decoration:none}#BetterNavigator form{display:none}#BetterNavigator.collapsed{box-shadow:0px 0px 3px rgba(0,0,0,.5)}#BetterNavigator.collapsed.translucent{opacity:.5;transition:opacity 250ms}#BetterNavigator.collapsed.translucent:hover{opacity:1}#BetterNavigator.collapsed #BetterNavigatorStatus{border-width:1px;padding:0 14px}#BetterNavigator.collapsed #BetterNavigatorContent{display:none}#BetterNavigator.right-top{right:0;top:0}#BetterNavigator.right-top.collapsed{transform-origin:right top;transform:rotate(90deg) translate(100%, 0)}#BetterNavigator.right-bottom{right:0;bottom:0}#BetterNavigator.right-bottom.collapsed{transform-origin:right bottom;transform:rotate(90deg) translate(0, 100%)}#BetterNavigator.left-bottom{left:0;bottom:0}#BetterNavigator.left-bottom.collapsed{transform-origin:left bottom;transform:rotate(90deg) translate(-100%, 0)}#BetterNavigator.left-top{left:0;top:0}#BetterNavigator.left-top.collapsed{transform-origin:left top;transform:rotate(90deg) translate(0, -100%)}#BetterNavigator span[class^=bn-icon],#BetterNavigator span[class*=" bn-icon"]{display:inline-block}#BetterNavigator .bn-icon-close{transform:scale(1.3)}#BetterNavigator .bn-icon-db{transform:scale(0.8)}#BetterNavigator .bn-icon-edit{transform:scale(0.9)}#BetterNavigator .bn-icon-flush{transform:scale(0.8)}#BetterNavigator .bn-icon-info{transform:scale(0.7)}#BetterNavigator .bn-icon-tick{transform:scale(0.7)}#BetterNavigator .bn-icon-tools{transform:scale(0.9)}#BetterNavigator .bn-icon-view{transform:scale(0.95)}#BetterNavigatorStatus{display:block;width:calc(100% - 15px - 15px);height:30px;appearance:none;background:#6f6f6f;border:1px solid #646464;cursor:pointer;padding:0 15px;margin:0;transition:100ms background-color ease-in-out;white-space:nowrap}#BetterNavigatorStatus .status-text{display:inline-block;text-align:left;color:#fff;text-transform:uppercase;font-family:inherit;font-weight:bold;font-size:18.5px;line-height:1.2;letter-spacing:.1px}#BetterNavigatorStatus:hover,#BetterNavigatorStatus:focus-visible{background:dimgray}#BetterNavigatorStatus:hover .bn-icon-cog,#BetterNavigatorStatus:hover .bn-icon-close,#BetterNavigatorStatus:focus-visible .bn-icon-cog,#BetterNavigatorStatus:focus-visible .bn-icon-close{opacity:1}#BetterNavigatorStatus:focus-visible{outline:3px solid #646464;outline-offset:2px}#BetterNavigatorStatus.Live{background:#06ad18;border-color:#059c16}#BetterNavigatorStatus.Live:hover{background:#06a417}#BetterNavigatorStatus.Live:focus-visible{outline:3px solid #059c16}#BetterNavigatorStatus.Draft{background:#e6674b;border-color:#cf5d44}#BetterNavigatorStatus.Draft:hover{background:#db6247}#BetterNavigatorStatus.Draft:focus-visible{outline:3px solid #cf5d44}#BetterNavigatorStatus .bn-icon-cog{margin:-4px 8px -1px -4px}#BetterNavigatorStatus .bn-icon-close{float:right;margin:3px -6px 0}#BetterNavigatorStatus .bn-icon-cog,#BetterNavigatorStatus .bn-icon-close{opacity:.7}#BetterNavigatorStatusIcon{display:inline-block;cursor:inherit;transition:100ms opacity ease-in-out}#BetterNavigatorContent{display:block;padding:6px;color:#595d61;background:#cfd8de;border:1px solid #bac2c8;border-width:0 0 1px 1px;min-width:140px;overflow:auto}#BetterNavigatorContent .bn-heading{display:block;text-transform:uppercase;font-size:11px;line-height:1.2;color:#595d61;margin:8px 0 4px 0;padding:0;font-weight:normal}#BetterNavigatorContent span[class^=bn-icon],#BetterNavigatorContent span[class*=" bn-icon"]{cursor:inherit;margin:-2px 5px -3px -2px}#BetterNavigatorContent a,#BetterNavigatorContent .bn-disabled{display:block;background:#eceff2;color:#313639;font-family:Helvetica,Arial,sans-serif;font-size:12px;line-height:1.4;border-radius:5px;border-bottom:1px solid #a3aaaf;margin:0 0 4px 0;padding:6px 10px 5px 10px;font-weight:bold;cursor:pointer;transition:100ms background-color ease-in-out}#BetterNavigatorContent a .light,#BetterNavigatorContent .bn-disabled .light{font-weight:normal}#BetterNavigatorContent a:focus-visible,#BetterNavigatorContent a:hover{background:#fff;color:#000}#BetterNavigatorContent a:focus-visible{border-bottom:1px solid rgba(0,0,0,0);outline:2px solid #93999e;outline-offset:1px}#BetterNavigatorContent a:active{background:#d4d7da;border-color:#acb3b7}#BetterNavigatorContent .bn-disabled{background:#c6d3da;color:#51565a;cursor:default;pointer-events:none}#BetterNavigatorContent .bn-links{display:block;margin:0;padding:0;list-style-type:none}#BetterNavigatorContent .bn-links>:last-child{margin-bottom:0}body>p.message{text-align:left;background:#fff;color:#222;padding:10px 20px;margin:0;border-bottom:1px solid #ccc;border-left:5px solid #1d8aff}/*# sourceMappingURL=betternavigator.css.map */ diff --git a/css/betternavigator.css.map b/css/betternavigator.css.map new file mode 100644 index 0000000..74223fb --- /dev/null +++ b/css/betternavigator.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["../scss/_iconsprite.scss","../scss/betternavigator.scss"],"names":[],"mappings":"AAAA,kmBACI,wDAGJ,4DAEI,wBAGJ,iEACI,WACA,YAGJ,wDAEI,qCAGJ,6DACI,WACA,YAGJ,sDAEI,0BAGJ,2DACI,WACA,YAGJ,8BAEI,uCAGJ,mCACI,WACA,YAGJ,0DAEI,qCAGJ,+DACI,WACA,YAGJ,4DAEI,uCAGJ,iEACI,WACA,YAGJ,0DAEI,2BAGJ,+DACI,WACA,YAGJ,0DAEI,wCAGJ,+DACI,WACA,YAGJ,4DAEI,wCAGJ,iEACI,WACA,YAGJ,0DAEI,2BAGJ,+DACI,WACA,YAGJ,0DAEI,6BAGJ,+DACI,WACA,YCtFJ,iBACI,eACA,cACA,gBACA,gBAEA,mBAGI,YACA,uCACA,eACA,gBAGJ,mBACI,qBAGJ,sBACI,aAKJ,2BACI,sCAEA,uCACI,WACA,yBAEA,6CACI,UAIR,kDACI,iBACA,eAGJ,mDACI,aAIR,2BACI,QACA,MAEA,qCACI,2BACA,2CAIR,8BACI,QACA,SAEA,wCACI,8BACA,2CAIR,6BACI,OACA,SAEA,uCACI,6BACA,4CAIR,0BACI,OACA,MAEA,oCACI,0BACA,4CAKR,+EAEI,qBAGJ,gCAGI,qBAQJ,6BAGI,qBAGJ,+BAGI,qBAGJ,gCAGI,qBAGJ,+BAGI,qBAGJ,+BAGI,qBAGJ,gCAGI,qBAQJ,+BAGI,sBAMR,uBACI,cACA,+BACA,YACA,gBACA,WAnKW,QAoKX,yBACA,eACA,eACA,SACA,8CACA,mBAEA,oCACI,qBACA,gBACA,MA1LA,KA2LA,yBACA,oBACA,iBACA,iBACA,gBACA,oBAGJ,kEAEI,mBAEA,4LAEI,UAIR,qCACI,0BACA,mBAGJ,4BACI,WAzMI,QA0MJ,qBAEA,kCACI,mBAGJ,0CACI,0BAIR,6BACI,WArNK,QAsNL,qBAEA,mCACI,mBAGJ,2CACI,0BAIR,oCACI,0BAGJ,sCACI,YACA,kBAGJ,0EAEI,WAIR,2BACI,qBACA,eACA,qCAKJ,wBACI,cACA,YACA,MAnQW,QAoQX,WAnQgB,QAoQhB,yBACA,yBACA,gBACA,cAEA,oCACI,cACA,yBACA,eACA,gBACA,MA/QO,QAgRP,mBACA,UACA,mBAGJ,6FAEI,eACA,0BAGJ,+DAEI,cACA,WA1RW,QA2RX,MA7RM,QA8RN,uCACA,eACA,gBACA,kBACA,gCACA,iBACA,0BACA,iBACA,eACA,8CAEA,6EACI,mBAIR,wEAEI,WArTA,KAsTA,MAvTA,KA0TJ,wCACI,sCACA,0BACA,mBAGJ,iCACI,mBACA,qBAGJ,qCACI,WA7TmB,QA8TnB,MAhUc,QAiUd,eACA,oBAGJ,kCACI,cACA,SACA,UACA,qBAEA,8CACI,gBAMZ,eACI,gBACA,gBACA,WACA,kBACA,SACA,6BACA","file":"betternavigator.css"} \ No newline at end of file diff --git a/css/svg/sprite.css-982681f2.svg b/css/svg/sprite.css-982681f2.svg new file mode 100644 index 0000000..6d0d1fa --- /dev/null +++ b/css/svg/sprite.css-982681f2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon-sff60849a67.png b/images/bn-icon-sff60849a67.png deleted file mode 100644 index ea6b169..0000000 Binary files a/images/bn-icon-sff60849a67.png and /dev/null differ diff --git a/images/bn-icon/close.png b/images/bn-icon/close.png deleted file mode 100644 index 17908a7..0000000 Binary files a/images/bn-icon/close.png and /dev/null differ diff --git a/images/bn-icon/close.svg b/images/bn-icon/close.svg new file mode 100644 index 0000000..f399899 --- /dev/null +++ b/images/bn-icon/close.svg @@ -0,0 +1 @@ + diff --git a/images/bn-icon/cog.png b/images/bn-icon/cog.png deleted file mode 100644 index 190ce55..0000000 Binary files a/images/bn-icon/cog.png and /dev/null differ diff --git a/images/bn-icon/cog.svg b/images/bn-icon/cog.svg new file mode 100644 index 0000000..2b3e574 --- /dev/null +++ b/images/bn-icon/cog.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon/db.png b/images/bn-icon/db.png deleted file mode 100644 index 5104f9b..0000000 Binary files a/images/bn-icon/db.png and /dev/null differ diff --git a/images/bn-icon/db.svg b/images/bn-icon/db.svg new file mode 100644 index 0000000..baf5816 --- /dev/null +++ b/images/bn-icon/db.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon/devmode.png b/images/bn-icon/devmode.png deleted file mode 100644 index 5a3aa65..0000000 Binary files a/images/bn-icon/devmode.png and /dev/null differ diff --git a/images/bn-icon/devmode.svg b/images/bn-icon/devmode.svg new file mode 100644 index 0000000..10df7da --- /dev/null +++ b/images/bn-icon/devmode.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon/edit.png b/images/bn-icon/edit.png deleted file mode 100644 index 13f8348..0000000 Binary files a/images/bn-icon/edit.png and /dev/null differ diff --git a/images/bn-icon/edit.svg b/images/bn-icon/edit.svg new file mode 100644 index 0000000..d343db6 --- /dev/null +++ b/images/bn-icon/edit.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon/flush.png b/images/bn-icon/flush.png deleted file mode 100644 index 34716ad..0000000 Binary files a/images/bn-icon/flush.png and /dev/null differ diff --git a/images/bn-icon/flush.svg b/images/bn-icon/flush.svg new file mode 100644 index 0000000..134ff9d --- /dev/null +++ b/images/bn-icon/flush.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon/info.png b/images/bn-icon/info.png deleted file mode 100644 index 89a1cc3..0000000 Binary files a/images/bn-icon/info.png and /dev/null differ diff --git a/images/bn-icon/info.svg b/images/bn-icon/info.svg new file mode 100644 index 0000000..c3cebfc --- /dev/null +++ b/images/bn-icon/info.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon/tick.png b/images/bn-icon/tick.png deleted file mode 100644 index 0f811c2..0000000 Binary files a/images/bn-icon/tick.png and /dev/null differ diff --git a/images/bn-icon/tick.svg b/images/bn-icon/tick.svg new file mode 100644 index 0000000..978ae64 --- /dev/null +++ b/images/bn-icon/tick.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon/tools.png b/images/bn-icon/tools.png deleted file mode 100644 index a70cee4..0000000 Binary files a/images/bn-icon/tools.png and /dev/null differ diff --git a/images/bn-icon/tools.svg b/images/bn-icon/tools.svg new file mode 100644 index 0000000..67fc79e --- /dev/null +++ b/images/bn-icon/tools.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon/user.png b/images/bn-icon/user.png deleted file mode 100644 index d7c2edb..0000000 Binary files a/images/bn-icon/user.png and /dev/null differ diff --git a/images/bn-icon/user.svg b/images/bn-icon/user.svg new file mode 100644 index 0000000..2f03d79 --- /dev/null +++ b/images/bn-icon/user.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/bn-icon/view.png b/images/bn-icon/view.png deleted file mode 100644 index 07e6da7..0000000 Binary files a/images/bn-icon/view.png and /dev/null differ diff --git a/images/bn-icon/view.svg b/images/bn-icon/view.svg new file mode 100644 index 0000000..29c872c --- /dev/null +++ b/images/bn-icon/view.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/demo.png b/images/demo.png index 4d2a6bb..78579b3 100644 Binary files a/images/demo.png and b/images/demo.png differ diff --git a/javascript/betternavigator.js b/javascript/betternavigator.js index d830351..65e8b55 100755 --- a/javascript/betternavigator.js +++ b/javascript/betternavigator.js @@ -18,6 +18,7 @@ function initialiseBetterNavigator() { // Dom elements var BetterNavigator = document.getElementById("BetterNavigator"); var BetterNavigatorStatus = document.getElementById("BetterNavigatorStatus"); + var BetterNavigatorStatusIcon = document.getElementById("BetterNavigatorStatusIcon"); var BetterNavigatorLogoutLink = document.getElementById("BetterNavigatorLogoutLink"); var BetterNavigatorLogoutForm = document.getElementById("LogoutForm_BetterNavigatorLogoutForm"); @@ -26,10 +27,22 @@ function initialiseBetterNavigator() { if (BetterNavigator.classList.contains('collapsed')) { BetterNavigator.classList.add('open'); BetterNavigator.classList.remove('collapsed'); + + // update the button state + BetterNavigatorStatus.setAttribute('aria-expanded', 'true'); + BetterNavigatorStatusIcon.classList.remove('bn-icon-cog'); + BetterNavigatorStatusIcon.classList.add('bn-icon-close'); + document.cookie = "BetterNavigator=open;path=/"; } else { BetterNavigator.classList.add('collapsed'); BetterNavigator.classList.remove('open'); + + // update the button state + BetterNavigatorStatus.setAttribute('aria-expanded', 'false'); + BetterNavigatorStatusIcon.classList.remove('bn-icon-close'); + BetterNavigatorStatusIcon.classList.add('bn-icon-cog'); + document.cookie = "BetterNavigator=collapsed;path=/"; } }; @@ -38,6 +51,11 @@ function initialiseBetterNavigator() { if (getCookie('BetterNavigator') === 'open') { BetterNavigator.classList.add('open'); BetterNavigator.classList.remove('collapsed'); + + // update the button state + BetterNavigatorStatus.setAttribute('aria-expanded', 'true'); + BetterNavigatorStatusIcon.classList.remove('bn-icon-cog'); + BetterNavigatorStatusIcon.classList.add('bn-icon-close'); } if (BetterNavigatorLogoutForm) { diff --git a/lang/de.yml b/lang/de.yml index 99bd9f3..a4022b0 100644 --- a/lang/de.yml +++ b/lang/de.yml @@ -4,6 +4,8 @@ de: VIEWING_DRAFT: 'Entwurf' VIEWING_ARCHIVED: 'Archiviert' + ARIA_MENU_LABEL: 'Werkzeugmenü' + DEVELOPER_TOOLS_HEADING: 'Entwickler Tools' DEBUGGING_HEADING: 'Debugging' diff --git a/lang/en.yml b/lang/en.yml index 3ba914e..98b1a3d 100644 --- a/lang/en.yml +++ b/lang/en.yml @@ -4,6 +4,8 @@ en: VIEWING_DRAFT: 'Draft' VIEWING_ARCHIVED: 'Archived' + ARIA_MENU_LABEL: 'Tool menu' + DEVELOPER_TOOLS_HEADING: 'Developer tools' DEBUGGING_HEADING: 'Debugging' diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..e2c9251 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,1107 @@ +{ + "name": "silverstripe-betternavigator", + "requires": true, + "lockfileVersion": 1, + "dependencies": { + "@colors/colors": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz", + "integrity": "sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==", + "dev": true + }, + "@dabh/diagnostics": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/@dabh/diagnostics/-/diagnostics-2.0.3.tgz", + "integrity": "sha512-hrlQOIi7hAfzsMqlGSFyVucrx38O+j6wiGOf//H2ecvIEqYN4ADBSS2iLMh5UFyDunCNniUIPk/q3riFv45xRA==", + "dev": true, + "requires": { + "colorspace": "1.1.x", + "enabled": "2.0.x", + "kuler": "^2.0.0" + } + }, + "@resvg/resvg-js": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js/-/resvg-js-2.4.1.tgz", + "integrity": "sha512-wTOf1zerZX8qYcMmLZw3czR4paI4hXqPjShNwJRh5DeHxvgffUS5KM7XwxtbIheUW6LVYT5fhT2AJiP6mU7U4A==", + "dev": true, + "requires": { + "@resvg/resvg-js-android-arm-eabi": "2.4.1", + "@resvg/resvg-js-android-arm64": "2.4.1", + "@resvg/resvg-js-darwin-arm64": "2.4.1", + "@resvg/resvg-js-darwin-x64": "2.4.1", + "@resvg/resvg-js-linux-arm-gnueabihf": "2.4.1", + "@resvg/resvg-js-linux-arm64-gnu": "2.4.1", + "@resvg/resvg-js-linux-arm64-musl": "2.4.1", + "@resvg/resvg-js-linux-x64-gnu": "2.4.1", + "@resvg/resvg-js-linux-x64-musl": "2.4.1", + "@resvg/resvg-js-win32-arm64-msvc": "2.4.1", + "@resvg/resvg-js-win32-ia32-msvc": "2.4.1", + "@resvg/resvg-js-win32-x64-msvc": "2.4.1" + } + }, + "@resvg/resvg-js-android-arm-eabi": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-android-arm-eabi/-/resvg-js-android-arm-eabi-2.4.1.tgz", + "integrity": "sha512-AA6f7hS0FAPpvQMhBCf6f1oD1LdlqNXKCxAAPpKh6tR11kqV0YIB9zOlIYgITM14mq2YooLFl6XIbbvmY+jwUw==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-android-arm64": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-android-arm64/-/resvg-js-android-arm64-2.4.1.tgz", + "integrity": "sha512-/QleoRdPfsEuH9jUjilYcDtKK/BkmWcK+1LXM8L2nsnf/CI8EnFyv7ZzCj4xAIvZGAy9dTYr/5NZBcTwxG2HQg==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-darwin-arm64": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-darwin-arm64/-/resvg-js-darwin-arm64-2.4.1.tgz", + "integrity": "sha512-U1oMNhea+kAXgiEXgzo7EbFGCD1Edq5aSlQoe6LMly6UjHzgx2W3N5kEXCwU/CgN5FiQhZr7PlSJSlcr7mdhfg==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-darwin-x64": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-darwin-x64/-/resvg-js-darwin-x64-2.4.1.tgz", + "integrity": "sha512-avyVh6DpebBfHHtTQTZYSr6NG1Ur6TEilk1+H0n7V+g4F7x7WPOo8zL00ZhQCeRQ5H4f8WXNWIEKL8fwqcOkYw==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-linux-arm-gnueabihf": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-linux-arm-gnueabihf/-/resvg-js-linux-arm-gnueabihf-2.4.1.tgz", + "integrity": "sha512-isY/mdKoBWH4VB5v621co+8l101jxxYjuTkwOLsbW+5RK9EbLciPlCB02M99ThAHzI2MYxIUjXNmNgOW8btXvw==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-linux-arm64-gnu": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-linux-arm64-gnu/-/resvg-js-linux-arm64-gnu-2.4.1.tgz", + "integrity": "sha512-uY5voSCrFI8TH95vIYBm5blpkOtltLxLRODyhKJhGfskOI7XkRw5/t1u0sWAGYD8rRSNX+CA+np86otKjubrNg==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-linux-arm64-musl": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-linux-arm64-musl/-/resvg-js-linux-arm64-musl-2.4.1.tgz", + "integrity": "sha512-6mT0+JBCsermKMdi/O2mMk3m7SqOjwi9TKAwSngRZ/nQoL3Z0Z5zV+572ztgbWr0GODB422uD8e9R9zzz38dRQ==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-linux-x64-gnu": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-linux-x64-gnu/-/resvg-js-linux-x64-gnu-2.4.1.tgz", + "integrity": "sha512-60KnrscLj6VGhkYOJEmmzPlqqfcw1keDh6U+vMcNDjPhV3B5vRSkpP/D/a8sfokyeh4VEacPSYkWGezvzS2/mg==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-linux-x64-musl": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-linux-x64-musl/-/resvg-js-linux-x64-musl-2.4.1.tgz", + "integrity": "sha512-0AMyZSICC1D7ge115cOZQW8Pcad6PjWuZkBFF3FJuSxC6Dgok0MQnLTs2MfMdKBlAcwO9dXsf3bv9tJZj8pATA==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-win32-arm64-msvc": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-win32-arm64-msvc/-/resvg-js-win32-arm64-msvc-2.4.1.tgz", + "integrity": "sha512-76XDFOFSa3d0QotmcNyChh2xHwk+JTFiEQBVxMlHpHMeq7hNrQJ1IpE1zcHSQvrckvkdfLboKRrlGB86B10Qjw==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-win32-ia32-msvc": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-win32-ia32-msvc/-/resvg-js-win32-ia32-msvc-2.4.1.tgz", + "integrity": "sha512-odyVFGrEWZIzzJ89KdaFtiYWaIJh9hJRW/frcEcG3agJ464VXkN/2oEVF5ulD+5mpGlug9qJg7htzHcKxDN8sg==", + "dev": true, + "optional": true + }, + "@resvg/resvg-js-win32-x64-msvc": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@resvg/resvg-js-win32-x64-msvc/-/resvg-js-win32-x64-msvc-2.4.1.tgz", + "integrity": "sha512-vY4kTLH2S3bP+puU5x7hlAxHv+ulFgcK6Zn3efKSr0M0KnZ9A3qeAjZteIpkowEFfUeMPNg2dvvoFRJA9zqxSw==", + "dev": true, + "optional": true + }, + "@trysound/sax": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz", + "integrity": "sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==", + "dev": true + }, + "@types/triple-beam": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/@types/triple-beam/-/triple-beam-1.3.2.tgz", + "integrity": "sha512-txGIh+0eDFzKGC25zORnswy+br1Ha7hj5cMVwKIU7+s0U2AxxJru/jZSMU6OC9MJWP6+pc/hc6ZjyZShpsyY2g==", + "dev": true + }, + "@xmldom/xmldom": { + "version": "0.8.10", + "resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.8.10.tgz", + "integrity": "sha512-2WALfTl4xo2SkGCYRt6rDTFfk9R1czmBvUQy12gK2KuRKIpWEhcbbzy8EZXtz/jkRqHX8bFEc6FC1HjX4TUWYw==", + "dev": true + }, + "anymatch": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz", + "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==", + "dev": true, + "requires": { + "normalize-path": "^3.0.0", + "picomatch": "^2.0.4" + } + }, + "argparse": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", + "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", + "dev": true + }, + "async": { + "version": "3.2.4", + "resolved": "https://registry.npmjs.org/async/-/async-3.2.4.tgz", + "integrity": "sha512-iAB+JbDEGXhyIUavoDl9WP/Jj106Kz9DEn1DPgYw5ruDn0e3Wgi3sKFm55sASdGBNOQB8F59d9qQ7deqrHA8wQ==", + "dev": true + }, + "balanced-match": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", + "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", + "dev": true + }, + "binary-extensions": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", + "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", + "dev": true + }, + "boolbase": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz", + "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==", + "dev": true + }, + "brace-expansion": { + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", + "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "dev": true, + "requires": { + "balanced-match": "^1.0.0", + "concat-map": "0.0.1" + } + }, + "braces": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", + "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "dev": true, + "requires": { + "fill-range": "^7.0.1" + } + }, + "chokidar": { + "version": "3.5.3", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", + "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==", + "dev": true, + "requires": { + "anymatch": "~3.1.2", + "braces": "~3.0.2", + "fsevents": "~2.3.2", + "glob-parent": "~5.1.2", + "is-binary-path": "~2.1.0", + "is-glob": "~4.0.1", + "normalize-path": "~3.0.0", + "readdirp": "~3.6.0" + } + }, + "cliui": { + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz", + "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==", + "dev": true, + "requires": { + "string-width": "^4.2.0", + "strip-ansi": "^6.0.1", + "wrap-ansi": "^7.0.0" + }, + "dependencies": { + "ansi-regex": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", + "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", + "dev": true + }, + "strip-ansi": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", + "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", + "dev": true, + "requires": { + "ansi-regex": "^5.0.1" + } + } + } + }, + "clone": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz", + "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==", + "dev": true + }, + "clone-buffer": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz", + "integrity": "sha512-KLLTJWrvwIP+OPfMn0x2PheDEP20RPUcGXj/ERegTgdmPEZylALQldygiqrPPu8P45uNuPs7ckmReLY6v/iA5g==", + "dev": true + }, + "clone-stats": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz", + "integrity": "sha512-au6ydSpg6nsrigcZ4m8Bc9hxjeW+GJ8xh5G3BJCMt4WXe1H10UNaVOamqQTmrx1kjVuxAHIQSNU6hY4Nsn9/ag==", + "dev": true + }, + "cloneable-readable": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.1.3.tgz", + "integrity": "sha512-2EF8zTQOxYq70Y4XKtorQupqF0m49MBz2/yf5Bj+MHjvpG3Hy7sImifnqD6UA+TKYxeSV+u6qqQPawN5UvnpKQ==", + "dev": true, + "requires": { + "inherits": "^2.0.1", + "process-nextick-args": "^2.0.0", + "readable-stream": "^2.3.5" + }, + "dependencies": { + "readable-stream": { + "version": "2.3.8", + "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz", + "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==", + "dev": true, + "requires": { + "core-util-is": "~1.0.0", + "inherits": "~2.0.3", + "isarray": "~1.0.0", + "process-nextick-args": "~2.0.0", + "safe-buffer": "~5.1.1", + "string_decoder": "~1.1.1", + "util-deprecate": "~1.0.1" + } + }, + "safe-buffer": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", + "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==", + "dev": true + }, + "string_decoder": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", + "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", + "dev": true, + "requires": { + "safe-buffer": "~5.1.0" + } + } + } + }, + "color": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/color/-/color-3.2.1.tgz", + "integrity": "sha512-aBl7dZI9ENN6fUGC7mWpMTPNHmWUSNan9tuWN6ahh5ZLNk9baLJOnSMlrQkHcrfFgz2/RigjUVAjdx36VcemKA==", + "dev": true, + "requires": { + "color-convert": "^1.9.3", + "color-string": "^1.6.0" + } + }, + "color-convert": { + "version": "1.9.3", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", + "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==", + "dev": true, + "requires": { + "color-name": "1.1.3" + } + }, + "color-name": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", + "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==", + "dev": true + }, + "color-string": { + "version": "1.9.1", + "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.9.1.tgz", + "integrity": "sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==", + "dev": true, + "requires": { + "color-name": "^1.0.0", + "simple-swizzle": "^0.2.2" + } + }, + "colorspace": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/colorspace/-/colorspace-1.1.4.tgz", + "integrity": "sha512-BgvKJiuVu1igBUF2kEjRCZXol6wiiGbY5ipL/oVPwm0BL9sIpMIzM8IK7vwuxIIzOXMV3Ey5w+vxhm0rR/TN8w==", + "dev": true, + "requires": { + "color": "^3.1.3", + "text-hex": "1.0.x" + } + }, + "commander": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz", + "integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==", + "dev": true + }, + "concat-map": { + "version": "0.0.1", + "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", + "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==", + "dev": true + }, + "core-util-is": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz", + "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==", + "dev": true + }, + "css-select": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/css-select/-/css-select-4.3.0.tgz", + "integrity": "sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==", + "dev": true, + "requires": { + "boolbase": "^1.0.0", + "css-what": "^6.0.1", + "domhandler": "^4.3.1", + "domutils": "^2.8.0", + "nth-check": "^2.0.1" + }, + "dependencies": { + "dom-serializer": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz", + "integrity": "sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==", + "dev": true, + "requires": { + "domelementtype": "^2.0.1", + "domhandler": "^4.2.0", + "entities": "^2.0.0" + } + }, + "domelementtype": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz", + "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==", + "dev": true + }, + "domhandler": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.3.1.tgz", + "integrity": "sha512-GrwoxYN+uWlzO8uhUXRl0P+kHE4GtVPfYzVLcUxPL7KNdHKj66vvlhiweIHqYYXWlw+T8iLMp42Lm67ghw4WMQ==", + "dev": true, + "requires": { + "domelementtype": "^2.2.0" + } + }, + "domutils": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.8.0.tgz", + "integrity": "sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==", + "dev": true, + "requires": { + "dom-serializer": "^1.0.1", + "domelementtype": "^2.2.0", + "domhandler": "^4.2.0" + } + }, + "entities": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz", + "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==", + "dev": true + } + } + }, + "css-selector-parser": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/css-selector-parser/-/css-selector-parser-1.4.1.tgz", + "integrity": "sha512-HYPSb7y/Z7BNDCOrakL4raGO2zltZkbeXyAd6Tg9obzix6QhzxCotdBl6VT0Dv4vZfJGVz3WL/xaEI9Ly3ul0g==", + "dev": true + }, + "css-tree": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-1.1.3.tgz", + "integrity": "sha512-tRpdppF7TRazZrjJ6v3stzv93qxRcSsFmW6cX0Zm2NVKpxE1WV1HblnghVv9TreireHkqI/VDEsfolRF1p6y7Q==", + "dev": true, + "requires": { + "mdn-data": "2.0.14", + "source-map": "^0.6.1" + }, + "dependencies": { + "source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "dev": true + } + } + }, + "css-what": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz", + "integrity": "sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==", + "dev": true + }, + "csso": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/csso/-/csso-4.2.0.tgz", + "integrity": "sha512-wvlcdIbf6pwKEk7vHj8/Bkc0B4ylXZruLvOgs9doS5eOsOpuodOV2zJChSpkp+pRpYQLQMeF04nr3Z68Sta9jA==", + "dev": true, + "requires": { + "css-tree": "^1.1.2" + } + }, + "cssom": { + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.5.0.tgz", + "integrity": "sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==", + "dev": true + }, + "emoji-regex": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", + "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==", + "dev": true + }, + "enabled": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/enabled/-/enabled-2.0.0.tgz", + "integrity": "sha512-AKrN98kuwOzMIdAizXGI86UFBoo26CL21UM763y1h/GMSJ4/OHU9k2YlsmBpyScFo/wbLzWQJBMCW4+IO3/+OQ==", + "dev": true + }, + "escalade": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz", + "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==", + "dev": true + }, + "fecha": { + "version": "4.2.3", + "resolved": "https://registry.npmjs.org/fecha/-/fecha-4.2.3.tgz", + "integrity": "sha512-OP2IUU6HeYKJi3i0z4A19kHMQoLVs4Hc+DPqqxI2h/DPZHTm/vjsfC6P0b4jCMy14XizLBqvndQ+UilD7707Jw==", + "dev": true + }, + "fill-range": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", + "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "dev": true, + "requires": { + "to-regex-range": "^5.0.1" + } + }, + "fn.name": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/fn.name/-/fn.name-1.1.0.tgz", + "integrity": "sha512-GRnmB5gPyJpAhTQdSZTSp9uaPSvl09KoYcMQtsB9rQoOmzs9dH6ffeccH+Z+cv6P68Hu5bC6JjRh4Ah/mHSNRw==", + "dev": true + }, + "fs.realpath": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", + "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==", + "dev": true + }, + "fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "optional": true + }, + "get-caller-file": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz", + "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==", + "dev": true + }, + "glob": { + "version": "7.2.3", + "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", + "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", + "dev": true, + "requires": { + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^3.1.1", + "once": "^1.3.0", + "path-is-absolute": "^1.0.0" + } + }, + "glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "requires": { + "is-glob": "^4.0.1" + } + }, + "immutable": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.1.tgz", + "integrity": "sha512-lj9cnmB/kVS0QHsJnYKD1uo3o39nrbKxszjnqS9Fr6NB7bZzW45U6WSGBPKXDL/CvDKqDNPA4r3DoDQ8GTxo2A==", + "dev": true + }, + "inflight": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", + "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==", + "dev": true, + "requires": { + "once": "^1.3.0", + "wrappy": "1" + } + }, + "inherits": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", + "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", + "dev": true + }, + "is-arrayish": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz", + "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==", + "dev": true + }, + "is-binary-path": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", + "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", + "dev": true, + "requires": { + "binary-extensions": "^2.0.0" + } + }, + "is-extglob": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", + "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", + "dev": true + }, + "is-fullwidth-code-point": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz", + "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==", + "dev": true + }, + "is-glob": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", + "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", + "dev": true, + "requires": { + "is-extglob": "^2.1.1" + } + }, + "is-number": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", + "dev": true + }, + "is-stream": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz", + "integrity": "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==", + "dev": true + }, + "isarray": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", + "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==", + "dev": true + }, + "js-yaml": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz", + "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==", + "dev": true, + "requires": { + "argparse": "^2.0.1" + } + }, + "kuler": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/kuler/-/kuler-2.0.0.tgz", + "integrity": "sha512-Xq9nH7KlWZmXAtodXDDRE7vs6DU1gTU8zYDHDiWLSip45Egwq3plLHzPn27NgvzL2r1LMPC1vdqh98sQxtqj4A==", + "dev": true + }, + "lodash.escape": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-4.0.1.tgz", + "integrity": "sha512-nXEOnb/jK9g0DYMr1/Xvq6l5xMD7GDG55+GSYIYmS0G4tBk/hURD4JR9WCavs04t33WmJx9kCyp9vJ+mr4BOUw==", + "dev": true + }, + "lodash.merge": { + "version": "4.6.2", + "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz", + "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==", + "dev": true + }, + "lodash.trim": { + "version": "4.5.1", + "resolved": "https://registry.npmjs.org/lodash.trim/-/lodash.trim-4.5.1.tgz", + "integrity": "sha512-nJAlRl/K+eiOehWKDzoBVrSMhK0K3A3YQsUNXHQa5yIrKBAhsZgSu3KoAFoFT+mEgiyBHddZ0pRk1ITpIp90Wg==", + "dev": true + }, + "lodash.trimstart": { + "version": "4.5.1", + "resolved": "https://registry.npmjs.org/lodash.trimstart/-/lodash.trimstart-4.5.1.tgz", + "integrity": "sha512-b/+D6La8tU76L/61/aN0jULWHkT0EeJCmVstPBn/K9MtD2qBW83AsBNrr63dKuWYwVMO7ucv13QNO/Ek/2RKaQ==", + "dev": true + }, + "logform": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/logform/-/logform-2.5.1.tgz", + "integrity": "sha512-9FyqAm9o9NKKfiAKfZoYo9bGXXuwMkxQiQttkT4YjjVtQVIQtK6LmVtlxmCaFswo6N4AfEkHqZTV0taDtPotNg==", + "dev": true, + "requires": { + "@colors/colors": "1.5.0", + "@types/triple-beam": "^1.3.2", + "fecha": "^4.2.0", + "ms": "^2.1.1", + "safe-stable-stringify": "^2.3.1", + "triple-beam": "^1.3.0" + }, + "dependencies": { + "ms": { + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", + "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==", + "dev": true + } + } + }, + "mdn-data": { + "version": "2.0.14", + "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.14.tgz", + "integrity": "sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==", + "dev": true + }, + "minimatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", + "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "dev": true, + "requires": { + "brace-expansion": "^1.1.7" + } + }, + "mustache": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/mustache/-/mustache-4.2.0.tgz", + "integrity": "sha512-71ippSywq5Yb7/tVYyGbkBggbU8H3u5Rz56fH60jGFgr8uHwxs+aSKeqmluIVzM0m0kB7xQjKS6qPfd0b2ZoqQ==", + "dev": true + }, + "normalize-path": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", + "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", + "dev": true + }, + "nth-check": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz", + "integrity": "sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==", + "dev": true, + "requires": { + "boolbase": "^1.0.0" + } + }, + "once": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", + "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==", + "dev": true, + "requires": { + "wrappy": "1" + } + }, + "one-time": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/one-time/-/one-time-1.0.0.tgz", + "integrity": "sha512-5DXOiRKwuSEcQ/l0kGCF6Q3jcADFv5tSmRaJck/OqkVFcOzutB134KRSfF0xDrL39MNnqxbHBbUUcjZIhTgb2g==", + "dev": true, + "requires": { + "fn.name": "1.x.x" + } + }, + "path-is-absolute": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", + "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==", + "dev": true + }, + "picocolors": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", + "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==", + "dev": true + }, + "picomatch": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "dev": true + }, + "prettysize": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/prettysize/-/prettysize-2.0.0.tgz", + "integrity": "sha512-VVtxR7sOh0VsG8o06Ttq5TrI1aiZKmC+ClSn4eBPaNf4SHr5lzbYW+kYGX3HocBL/MfpVrRfFZ9V3vCbLaiplg==", + "dev": true + }, + "process-nextick-args": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz", + "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==", + "dev": true + }, + "readable-stream": { + "version": "3.6.2", + "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz", + "integrity": "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==", + "dev": true, + "requires": { + "inherits": "^2.0.3", + "string_decoder": "^1.1.1", + "util-deprecate": "^1.0.1" + } + }, + "readdirp": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", + "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "dev": true, + "requires": { + "picomatch": "^2.2.1" + } + }, + "remove-trailing-separator": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz", + "integrity": "sha512-/hS+Y0u3aOfIETiaiirUFwDBDzmXPvO+jAfKTitUngIPzdKc6Z0LoFjM/CK5PL4C+eKwHohlHAb6H0VFfmmUsw==", + "dev": true + }, + "replace-ext": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.1.tgz", + "integrity": "sha512-yD5BHCe7quCgBph4rMQ+0KkIRKwWCrHDOX1p1Gp6HwjPM5kVoCdKGNhN7ydqqsX6lJEnQDKZ/tFMiEdQ1dvPEw==", + "dev": true + }, + "require-directory": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz", + "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==", + "dev": true + }, + "safe-buffer": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz", + "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==", + "dev": true + }, + "safe-stable-stringify": { + "version": "2.4.3", + "resolved": "https://registry.npmjs.org/safe-stable-stringify/-/safe-stable-stringify-2.4.3.tgz", + "integrity": "sha512-e2bDA2WJT0wxseVd4lsDP4+3ONX6HpMXQa1ZhFQ7SU+GjvORCmShbCMltrtIDfkYhVHrOcPtj+KhmDBdPdZD1g==", + "dev": true + }, + "sass": { + "version": "1.64.1", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.64.1.tgz", + "integrity": "sha512-16rRACSOFEE8VN7SCgBu1MpYCyN7urj9At898tyzdXFhC+a+yOX5dXwAR7L8/IdPJ1NB8OYoXmD55DM30B2kEQ==", + "dev": true, + "requires": { + "chokidar": ">=3.0.0 <4.0.0", + "immutable": "^4.0.0", + "source-map-js": ">=0.6.2 <2.0.0" + } + }, + "simple-swizzle": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz", + "integrity": "sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==", + "dev": true, + "requires": { + "is-arrayish": "^0.3.1" + } + }, + "source-map-js": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", + "dev": true + }, + "stable": { + "version": "0.1.8", + "resolved": "https://registry.npmjs.org/stable/-/stable-0.1.8.tgz", + "integrity": "sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w==", + "dev": true + }, + "stack-trace": { + "version": "0.0.10", + "resolved": "https://registry.npmjs.org/stack-trace/-/stack-trace-0.0.10.tgz", + "integrity": "sha512-KGzahc7puUKkzyMt+IqAep+TVNbKP+k2Lmwhub39m1AsTSkaDutx56aDCo+HLDzf/D26BIHTJWNiTG1KAJiQCg==", + "dev": true + }, + "string-width": { + "version": "4.2.3", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", + "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", + "dev": true, + "requires": { + "emoji-regex": "^8.0.0", + "is-fullwidth-code-point": "^3.0.0", + "strip-ansi": "^6.0.1" + }, + "dependencies": { + "ansi-regex": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", + "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", + "dev": true + }, + "strip-ansi": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", + "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", + "dev": true, + "requires": { + "ansi-regex": "^5.0.1" + } + } + } + }, + "string_decoder": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz", + "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==", + "dev": true, + "requires": { + "safe-buffer": "~5.2.0" + } + }, + "svg-sprite": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/svg-sprite/-/svg-sprite-2.0.2.tgz", + "integrity": "sha512-vLFP/t4YCu62mvOzUt6g9bqpKrPjYsLuzegw5WsIsv3DkulAI/fRC+k7Atk//rIkUDbvKo572nJ6o4YT+FbKig==", + "dev": true, + "requires": { + "@resvg/resvg-js": "^2.1.0", + "@xmldom/xmldom": "^0.8.3", + "async": "^3.2.4", + "css-selector-parser": "^1.4.1", + "csso": "^4.2.0", + "cssom": "^0.5.0", + "glob": "^7.2.3", + "js-yaml": "^4.1.0", + "lodash.escape": "^4.0.1", + "lodash.merge": "^4.6.2", + "lodash.trim": "^4.5.1", + "lodash.trimstart": "^4.5.1", + "mustache": "^4.2.0", + "prettysize": "^2.0.0", + "svgo": "^2.8.0", + "vinyl": "^2.2.1", + "winston": "^3.8.2", + "xpath": "^0.0.32", + "yargs": "^17.5.1" + } + }, + "svgo": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/svgo/-/svgo-2.8.0.tgz", + "integrity": "sha512-+N/Q9kV1+F+UeWYoSiULYo4xYSDQlTgb+ayMobAXPwMnLvop7oxKMo9OzIrX5x3eS4L4f2UHhc9axXwY8DpChg==", + "dev": true, + "requires": { + "@trysound/sax": "0.2.0", + "commander": "^7.2.0", + "css-select": "^4.1.3", + "css-tree": "^1.1.3", + "csso": "^4.2.0", + "picocolors": "^1.0.0", + "stable": "^0.1.8" + } + }, + "text-hex": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/text-hex/-/text-hex-1.0.0.tgz", + "integrity": "sha512-uuVGNWzgJ4yhRaNSiubPY7OjISw4sw4E5Uv0wbjp+OzcbmVU/rsT8ujgcXJhn9ypzsgr5vlzpPqP+MBBKcGvbg==", + "dev": true + }, + "to-regex-range": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "dev": true, + "requires": { + "is-number": "^7.0.0" + } + }, + "triple-beam": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/triple-beam/-/triple-beam-1.4.1.tgz", + "integrity": "sha512-aZbgViZrg1QNcG+LULa7nhZpJTZSLm/mXnHXnbAbjmN5aSa0y7V+wvv6+4WaBtpISJzThKy+PIPxc1Nq1EJ9mg==", + "dev": true + }, + "util-deprecate": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", + "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==", + "dev": true + }, + "vinyl": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.2.1.tgz", + "integrity": "sha512-LII3bXRFBZLlezoG5FfZVcXflZgWP/4dCwKtxd5ky9+LOtM4CS3bIRQsmR1KMnMW07jpE8fqR2lcxPZ+8sJIcw==", + "dev": true, + "requires": { + "clone": "^2.1.1", + "clone-buffer": "^1.0.0", + "clone-stats": "^1.0.0", + "cloneable-readable": "^1.0.0", + "remove-trailing-separator": "^1.0.1", + "replace-ext": "^1.0.0" + } + }, + "winston": { + "version": "3.10.0", + "resolved": "https://registry.npmjs.org/winston/-/winston-3.10.0.tgz", + "integrity": "sha512-nT6SIDaE9B7ZRO0u3UvdrimG0HkB7dSTAgInQnNR2SOPJ4bvq5q79+pXLftKmP52lJGW15+H5MCK0nM9D3KB/g==", + "dev": true, + "requires": { + "@colors/colors": "1.5.0", + "@dabh/diagnostics": "^2.0.2", + "async": "^3.2.3", + "is-stream": "^2.0.0", + "logform": "^2.4.0", + "one-time": "^1.0.0", + "readable-stream": "^3.4.0", + "safe-stable-stringify": "^2.3.1", + "stack-trace": "0.0.x", + "triple-beam": "^1.3.0", + "winston-transport": "^4.5.0" + } + }, + "winston-transport": { + "version": "4.5.0", + "resolved": "https://registry.npmjs.org/winston-transport/-/winston-transport-4.5.0.tgz", + "integrity": "sha512-YpZzcUzBedhlTAfJg6vJDlyEai/IFMIVcaEZZyl3UXIl4gmqRpU7AE89AHLkbzLUsv0NVmw7ts+iztqKxxPW1Q==", + "dev": true, + "requires": { + "logform": "^2.3.2", + "readable-stream": "^3.6.0", + "triple-beam": "^1.3.0" + } + }, + "wrap-ansi": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz", + "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==", + "dev": true, + "requires": { + "ansi-styles": "^4.0.0", + "string-width": "^4.1.0", + "strip-ansi": "^6.0.0" + }, + "dependencies": { + "ansi-regex": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", + "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", + "dev": true + }, + "ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dev": true, + "requires": { + "color-convert": "^2.0.1" + } + }, + "color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dev": true, + "requires": { + "color-name": "~1.1.4" + } + }, + "color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", + "dev": true + }, + "strip-ansi": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", + "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", + "dev": true, + "requires": { + "ansi-regex": "^5.0.1" + } + } + } + }, + "wrappy": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", + "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==", + "dev": true + }, + "xpath": { + "version": "0.0.32", + "resolved": "https://registry.npmjs.org/xpath/-/xpath-0.0.32.tgz", + "integrity": "sha512-rxMJhSIoiO8vXcWvSifKqhvV96GjiD5wYb8/QHdoRyQvraTpp4IEv944nhGausZZ3u7dhQXteZuZbaqfpB7uYw==", + "dev": true + }, + "y18n": { + "version": "5.0.8", + "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz", + "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==", + "dev": true + }, + "yargs": { + "version": "17.7.2", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz", + "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==", + "dev": true, + "requires": { + "cliui": "^8.0.1", + "escalade": "^3.1.1", + "get-caller-file": "^2.0.5", + "require-directory": "^2.1.1", + "string-width": "^4.2.3", + "y18n": "^5.0.5", + "yargs-parser": "^21.1.1" + } + }, + "yargs-parser": { + "version": "21.1.1", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz", + "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==", + "dev": true + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..278cb3a --- /dev/null +++ b/package.json @@ -0,0 +1,27 @@ +{ + "name": "silverstripe-betternavigator", + "description": "Front-end utility menu for SilverStripe websites featuring administration and development tools", + "scripts": { + "build:svg": "svg-sprite --css --css-render-scss --css-render-scss-dest=../scss/_iconsprite --css-bust ./images/bn-icon/*.svg", + "build:scss": "sass --style compressed scss/betternavigator.scss css/betternavigator.css", + "build": "npm run build:svg && npm run build:scss", + "watch": "sass --watch scss/betternavigator.scss css/betternavigator.css" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/jonom/silverstripe-betternavigator.git" + }, + "keywords": [ + "silverstripe", + "navigator" + ], + "author": "https://github.com/jonom", + "bugs": { + "url": "https://github.com/jonom/silverstripe-betternavigator/issues" + }, + "homepage": "https://github.com/jonom/silverstripe-betternavigator#readme", + "devDependencies": { + "sass": "^1.64.1", + "svg-sprite": "^2.0.2" + } +} diff --git a/scss/_iconsprite.md b/scss/_iconsprite.md new file mode 100644 index 0000000..53c43b5 --- /dev/null +++ b/scss/_iconsprite.md @@ -0,0 +1,38 @@ +# SVG Sprites + +An SVG sprite is used for icons, this is generated by the [svg-sprite](https://github.com/svg-sprite/svg-sprite) node module. This means icons can be easily pre-loaded when the navigator is collapsed. + +## Using the icons + +After compilation, a `_iconsprite.scss` file is created. This should be included in the main scss. + +To include an icon as background image in an element, extend the icon and the dimensions + +```scss +.bn-icon-close { + @extend .svg-images--bn-icon--close; + @extend .svg-images--bn-icon--close-dims; +} +``` + +## Adding or removing icons + +If you need to add or remove an icon, then add or remove it from the `./images/bn-icon/` directory and re-compile. + +Only SVG is supported, and it is recommended to compress the SVG first using a tool such as [svgo](https://github.com/svg/svgo) or [svgomg](https://jakearchibald.github.io/svgomg/) first. + +## Compiling the icon sprite + +This can be done by running `npm run build:svg` from the root of the module. + +All icons in the `./images/bn-icon/` directory are compiled into a single SVG and output to `./css/svg/`. + +The `./scss/_iconsprite.scss` file is generated with the correct background positions based on the size of each icon. + +## License + +Icons are sourced from [IcoMoon](https://icomoon.io/) and are from the following packs: +* [IcoMoon - Free](https://icomoon.io/#icons) by [Keyamoon](http://keyamoon.com/) (GPL / CC BY 4.0) +* [Entypo+](http://www.entypo.com/) by [Daniel Bruce](http://danielbruce.se/) (CC BY-SA 4.0) + +The icons have been compressed and resized. diff --git a/scss/_iconsprite.scss b/scss/_iconsprite.scss new file mode 100644 index 0000000..bb32804 --- /dev/null +++ b/scss/_iconsprite.scss @@ -0,0 +1,114 @@ +%svg-common { + background: url("svg/sprite.css-982681f2.svg") no-repeat; +} + +.svg-images--bn-icon--close { + @extend %svg-common; + background-position: 0 0; +} + +.svg-images--bn-icon--close-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--cog { + @extend %svg-common; + background-position: 33.333333333333336% 0; +} + +.svg-images--bn-icon--cog-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--db { + @extend %svg-common; + background-position: 0 50%; +} + +.svg-images--bn-icon--db-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--devmode { + @extend %svg-common; + background-position: 33.333333333333336% 50%; +} + +.svg-images--bn-icon--devmode-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--edit { + @extend %svg-common; + background-position: 66.66666666666667% 0; +} + +.svg-images--bn-icon--edit-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--flush { + @extend %svg-common; + background-position: 66.66666666666667% 50%; +} + +.svg-images--bn-icon--flush-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--info { + @extend %svg-common; + background-position: 0 100%; +} + +.svg-images--bn-icon--info-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--tick { + @extend %svg-common; + background-position: 33.333333333333336% 100%; +} + +.svg-images--bn-icon--tick-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--tools { + @extend %svg-common; + background-position: 66.66666666666667% 100%; +} + +.svg-images--bn-icon--tools-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--user { + @extend %svg-common; + background-position: 100% 0; +} + +.svg-images--bn-icon--user-dims { + width: 16px; + height: 16px; +} + +.svg-images--bn-icon--view { + @extend %svg-common; + background-position: 100% 50%; +} + +.svg-images--bn-icon--view-dims { + width: 16px; + height: 16px; +} + diff --git a/scss/betternavigator.scss b/scss/betternavigator.scss index 78c144d..a299e1d 100644 --- a/scss/betternavigator.scss +++ b/scss/betternavigator.scss @@ -1,26 +1,43 @@ -@import "compass/css3"; -@import "compass/utilities/sprites"; - -//Icons -$bn-icon-sprite-dimensions: true; -@import "bn-icon/*.png"; -@include all-bn-icon-sprites; -span[class^='bn-icon'],span[class*=' bn-icon']{ - display: inline-block; -} +/** + * Better navigator styles + */ + +@import "_iconsprite"; + +// Variables + +$black: #000; +$white: #FFF; + +$textColor: $white; +$contentColor: #595D61; +$contentBackground: #CFD8DE; +$buttonColor: #313639; +$buttonColorDisabled: #51565A; +$buttonBackground: #ECEFF2; +$buttonBackgroundDisabled: #C6D3DA; +$buttonBorder: #A3AAAF; +$liveColor: #06AD18; +$stageColor: #E6674B; +$archiveColor: #6F6F6F; -//Container +// Container #BetterNavigator { position: fixed; z-index: 99999; max-height: 100%; - overflow: auto; - font-family: Helvetica, Arial, sans-serif; - font-size: 12px; - line-height: 16px; text-align: left; + * { + // Reset all styles to avoid inheriting from + // the parent page theme + all: initial; + font-family: Helvetica, Arial, sans-serif; + font-size: 12px; + line-height: 1.2; + } + a { text-decoration: none; } @@ -29,7 +46,7 @@ span[class^='bn-icon'],span[class*=' bn-icon']{ display:none; } - //Toggle states + // Toggle states &.collapsed { box-shadow: 0px 0px 3px rgba(0,0,0,0.5); @@ -45,13 +62,7 @@ span[class^='bn-icon'],span[class*=' bn-icon']{ #BetterNavigatorStatus { border-width: 1px; - - .bn-icon-close { - display: none; - } - .bn-icon-cog { - display: inline-block; - } + padding: 0 14px; } #BetterNavigatorContent { @@ -64,8 +75,8 @@ span[class^='bn-icon'],span[class*=' bn-icon']{ top: 0; &.collapsed { - @include transform-origin(right, top); - @include transform(rotate(90deg) translate(100%, 0)); + transform-origin: right top; + transform: rotate(90deg) translate(100%, 0); } } @@ -74,8 +85,8 @@ span[class^='bn-icon'],span[class*=' bn-icon']{ bottom: 0; &.collapsed { - @include transform-origin(right, bottom); - @include transform(rotate(90deg) translate(0, 100%)); + transform-origin: right bottom; + transform: rotate(90deg) translate(0, 100%); } } @@ -84,8 +95,8 @@ span[class^='bn-icon'],span[class*=' bn-icon']{ bottom: 0; &.collapsed { - @include transform-origin(left, bottom); - @include transform(rotate(90deg) translate(-100%, 0)); + transform-origin: left bottom; + transform: rotate(90deg) translate(-100%, 0); } } @@ -94,126 +105,252 @@ span[class^='bn-icon'],span[class*=' bn-icon']{ top: 0; &.collapsed { - @include transform-origin(left, top); - @include transform(rotate(90deg) translate(0, -100%)); + transform-origin: left top; + transform: rotate(90deg) translate(0, -100%); } } -} - -//Status -$liveColor: #39b54a; -$stageColor: #f26c4f; -$archiveColor: #6f6f6f; + // Icons + span[class^='bn-icon'], + span[class*=' bn-icon']{ + display: inline-block; + } -#BetterNavigatorStatus { - color: #fff; - background: $archiveColor; - border: 1px solid shade($archiveColor, 10); - border-width: 0; - text-transform: uppercase; - cursor: pointer; - padding: 10px 15px 8px; - font-weight: bold; + .bn-icon-close { + @extend .svg-images--bn-icon--close; + @extend .svg-images--bn-icon--close-dims; + transform: scale(1.3); + } .bn-icon-cog { - margin: -4px 8px -4px -4px; - display: none; + @extend .svg-images--bn-icon--cog; + @extend .svg-images--bn-icon--cog-dims; } - .bn-icon-close { - float: right; - margin: 1px 0 0 0; + .bn-icon-db { + @extend .svg-images--bn-icon--db; + @extend .svg-images--bn-icon--db-dims; + transform: scale(0.8); } - .bn-icon-cog, - .bn-icon-close { - opacity: .7; + .bn-icon-edit { + @extend .svg-images--bn-icon--edit; + @extend .svg-images--bn-icon--edit-dims; + transform: scale(0.9); } - &:hover { - background: shade($archiveColor, 5); + .bn-icon-flush { + @extend .svg-images--bn-icon--flush; + @extend .svg-images--bn-icon--flush-dims; + transform: scale(0.8); + } + + .bn-icon-info { + @extend .svg-images--bn-icon--info; + @extend .svg-images--bn-icon--info-dims; + transform: scale(0.7); + } + + .bn-icon-tick { + @extend .svg-images--bn-icon--tick; + @extend .svg-images--bn-icon--tick-dims; + transform: scale(0.7); + } + + .bn-icon-tools { + @extend .svg-images--bn-icon--tools; + @extend .svg-images--bn-icon--tools-dims; + transform: scale(0.9); + } + + .bn-icon-user { + @extend .svg-images--bn-icon--user; + @extend .svg-images--bn-icon--user-dims; + } + + .bn-icon-view { + @extend .svg-images--bn-icon--view; + @extend .svg-images--bn-icon--view-dims; + transform: scale(0.95); + } +} + +// Status + +#BetterNavigatorStatus { + display: block; + width: calc(100% - 15px - 15px); + height: 30px; + appearance: none; + background: $archiveColor; + border: 1px solid mix($black, $archiveColor, 10%); + cursor: pointer; + padding: 0 15px; + margin: 0; + transition: 100ms background-color ease-in-out; + white-space: nowrap; + + .status-text { + display: inline-block; + text-align: left; + color: $textColor; + text-transform: uppercase; + font-family: inherit; + font-weight: bold; + font-size: 18.5px; + line-height: 1.2; + letter-spacing: 0.1px; + } + + &:hover, + &:focus-visible { + background: mix($black, $archiveColor, 5%); .bn-icon-cog, .bn-icon-close { - opacity: 1; + opacity: 1; } } + &:focus-visible { + outline: 3px solid mix($black, $archiveColor, 10%); + outline-offset: 2px; + } + &.Live { background: $liveColor; - border-color: shade($liveColor, 10); + border-color: mix($black, $liveColor, 10%); &:hover { - background: shade($liveColor, 5); + background: mix($black, $liveColor, 5%); + } + + &:focus-visible { + outline: 3px solid mix($black, $liveColor, 10%); } } &.Draft { background: $stageColor; - border-color: shade($stageColor, 10); + border-color: mix($black, $stageColor, 10%); &:hover { - background: shade($stageColor, 5); + background: mix($black, $stageColor, 5%); + } + + &:focus-visible { + outline: 3px solid mix($black, $stageColor, 10%); } } + + .bn-icon-cog { + margin: -4px 8px -1px -4px; + } + + .bn-icon-close { + float: right; + margin: 3px -6px 0; + } + + .bn-icon-cog, + .bn-icon-close { + opacity: .7; + } +} + +#BetterNavigatorStatusIcon { + display: inline-block; + cursor: inherit; + transition: 100ms opacity ease-in-out; } -//Content +// Content #BetterNavigatorContent { + display: block; padding: 6px; - color: #71767a; - background: #cfd8de; - border: 1px solid shade(#cfd8de, 10); + color: $contentColor; + background: $contentBackground; + border: 1px solid mix($black, $contentBackground, 10%); border-width: 0 0 1px 1px; + min-width: 140px; + overflow: auto; .bn-heading { - text-align: center; + display: block; text-transform: uppercase; font-size: 11px; + line-height: 1.2; + color: $contentColor; margin: 8px 0 4px 0; + padding: 0; + font-weight: normal; } span[class^='bn-icon'], span[class*=' bn-icon'] { - margin: -2px 5px -3px -2px; + cursor: inherit; + margin: -2px 5px -3px -2px; } a, - span.bn-disabled { + .bn-disabled { display: block; - background: #eceff2; - color: #313639; + background: $buttonBackground; + color: $buttonColor; font-family: Helvetica, Arial, sans-serif; font-size: 12px; + line-height: 1.4; border-radius: 5px; - border-bottom: 1px solid #a3aaaf; + border-bottom: 1px solid $buttonBorder; margin: 0 0 4px 0; padding: 6px 10px 5px 10px; - line-height: 16px; font-weight: bold; + cursor: pointer; + transition: 100ms background-color ease-in-out; .light { font-weight: normal; } } - a:focus, - a:hover, + a:focus-visible, + a:hover { + background: $white; + color: $black; + } + + a:focus-visible { + border-bottom: 1px solid transparent; + outline: 2px solid mix($black, $buttonBorder, 10%); + outline-offset: 1px; + } + a:active { - background: #fff; - color: #000; + background: mix($black, $buttonBackground, 10%); + border-color: mix($white, $buttonBorder, 10%); } - span.bn-disabled { - background: #afbac0; - color: #51565a; + .bn-disabled { + background: $buttonBackgroundDisabled; + color: $buttonColorDisabled; cursor: default; + pointer-events: none; + } + + .bn-links { + display: block; + margin: 0; + padding: 0; + list-style-type: none; + + > :last-child { + margin-bottom: 0; + } } } -//Some help for debugging info +// Some help for debugging info body > p.message { text-align: left; background: #fff; diff --git a/templates/JonoM/BetterNavigator/BetterNavigator.ss b/templates/JonoM/BetterNavigator/BetterNavigator.ss index c7ce87c..f8c4152 100644 --- a/templates/JonoM/BetterNavigator/BetterNavigator.ss +++ b/templates/JonoM/BetterNavigator/BetterNavigator.ss @@ -1,10 +1,9 @@ - + - - + +