From 93fa66907170bfc906414fb8a9429d5408cf8d55 Mon Sep 17 00:00:00 2001 From: groovecoder Date: Tue, 20 Dec 2016 11:05:37 -0600 Subject: [PATCH 1/7] for #5: start browser action UI --- .gitignore | 1 + icon.png | Bin 0 -> 677 bytes webextension/css/foundation.min.css | 2 ++ webextension/css/popup.css | 42 ++++++++++++++++++++++ webextension/img/container-add.svg | 13 +++++++ webextension/img/container-delete.svg | 10 ++++++ webextension/img/container-edit.svg | 12 +++++++ webextension/img/container-hide.svg | 19 ++++++++++ webextension/img/container-site-d-192.png | Bin 0 -> 2329 bytes webextension/img/container-site-d-24.png | Bin 0 -> 441 bytes webextension/img/container-site-d-48.png | Bin 0 -> 677 bytes webextension/img/container-site-d-96.png | Bin 0 -> 1208 bytes webextension/img/container-site-w-192.png | Bin 0 -> 2281 bytes webextension/img/container-site-w-24.png | Bin 0 -> 406 bytes webextension/img/container-site-w-48.png | Bin 0 -> 633 bytes webextension/img/container-site-w-96.png | Bin 0 -> 1163 bytes webextension/img/container-sort.svg | 17 +++++++++ webextension/img/container-unhide.svg | 12 +++++++ webextension/img/icon-50x50.png | Bin 1296 -> 0 bytes webextension/js/popup.js | 8 ++++- webextension/manifest.json | 8 ++--- webextension/popup.html | 25 ++++++++++--- 22 files changed, 160 insertions(+), 9 deletions(-) create mode 100644 icon.png create mode 100644 webextension/css/foundation.min.css create mode 100644 webextension/css/popup.css create mode 100644 webextension/img/container-add.svg create mode 100644 webextension/img/container-delete.svg create mode 100644 webextension/img/container-edit.svg create mode 100644 webextension/img/container-hide.svg create mode 100644 webextension/img/container-site-d-192.png create mode 100644 webextension/img/container-site-d-24.png create mode 100644 webextension/img/container-site-d-48.png create mode 100644 webextension/img/container-site-d-96.png create mode 100644 webextension/img/container-site-w-192.png create mode 100644 webextension/img/container-site-w-24.png create mode 100644 webextension/img/container-site-w-48.png create mode 100644 webextension/img/container-site-w-96.png create mode 100644 webextension/img/container-sort.svg create mode 100644 webextension/img/container-unhide.svg delete mode 100644 webextension/img/icon-50x50.png diff --git a/.gitignore b/.gitignore index 13f22bd..51acf5d 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ +.DS_Store node_modules README.html *.xpi diff --git a/icon.png b/icon.png new file mode 100644 index 0000000000000000000000000000000000000000..ec33b617bf86759febb34450758a0dd2a1560847 GIT binary patch literal 677 zcmV;W0$TlvP)004R>004l5008;`004mK004C`008P>0026e000+ooVrmw00006 zVoOIv00000008+zyMF)x010qNS#tmY3labT3lag+-G2N400Id~L_t(&-tCw@PZUuU zhM!$0ia>%jI;|IIa04egm(7hX<(r1Z+0E z{sJt8dLttLEv3*6Yxf4n9Ah@ktO8JybQBl^hJh~EU|vRHlY9bF(dt<=O7WL@>Mu4AXV5mi*joi&xyXB$JjWTf3L-27)=?BFf z9{Thgiff^^CJGcy6eyY~P&84XXre&TM1i95DeyOxz_N$jH8a~tt*v_Kvs?z=cnF@% zSo6_mA_1NP6{@#[type=checkbox],label>[type=radio]{margin-right:.5rem}[type=file]{width:100%}label{display:block;margin:0;font-size:.875rem;font-weight:400;line-height:1.8;color:#0a0a0a}label.middle{margin:0 0 1rem;padding:.5625rem 0}.help-text{margin-top:-.5rem;font-size:.8125rem;font-style:italic;color:#0a0a0a}.input-group{display:-webkit-flex;display:-ms-flexbox;display:flex;width:100%;margin-bottom:1rem;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch}.input-group>:first-child{border-radius:3px 0 0 3px}.input-group>:last-child>*{border-radius:0 3px 3px 0}.input-group-button,.input-group-field,.input-group-label{margin:0;white-space:nowrap}.input-group-label{text-align:center;padding:0 1rem;background:#e6e6e6;color:#0a0a0a;border:1px solid #cacaca;white-space:nowrap;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.input-group-label:first-child{border-right:0}.input-group-label:last-child{border-left:0}.input-group-field{border-radius:0;-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px;width:auto;height:auto}.input-group-button{padding-top:0;padding-bottom:0;text-align:center;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.input-group-button a,.input-group-button button,.input-group-button input{margin:0}.input-group .input-group-button{display:table-cell}fieldset{border:0;padding:0;margin:0}legend{margin-bottom:.5rem;max-width:100%}.fieldset{border:1px solid #cacaca;padding:1.25rem;margin:1.125rem 0}.fieldset legend{background:#fefefe;padding:0 .1875rem;margin:0;margin-left:-.1875rem}select{height:2.4375rem;padding:.5rem;border:1px solid #cacaca;margin:0 0 1rem;font-size:1rem;font-family:inherit;line-height:normal;color:#0a0a0a;background-color:#fefefe;border-radius:3px;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;utf8,");background-size:9px 6px;background-position:right -1rem center;background-origin:content-box;background-repeat:no-repeat;padding-right:1.5rem}@media screen and (min-width:0\0){select{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg==")}}select:disabled{background-color:#e6e6e6;cursor:not-allowed}select::-ms-expand{display:none}select[multiple]{height:auto;background-image:none}.is-invalid-input:not(:focus){background-color:rgba(198,15,19,.1);border-color:#c60f13}.form-error,.is-invalid-label{color:#c60f13}.form-error{display:none;margin-top:-.5rem;margin-bottom:1rem;font-size:.75rem;font-weight:700}.form-error.is-visible{display:block}.float-left{float:left!important}.float-right{float:right!important}.float-center{display:block;margin-left:auto;margin-right:auto}.clearfix:after,.clearfix:before{content:' ';display:table;-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;-webkit-order:1;-ms-flex-order:1;order:1}.clearfix:after{clear:both}.hide{display:none!important}.invisible{visibility:hidden}@media screen and (max-width:39.9375em){.hide-for-small-only{display:none!important}}@media screen and (max-width:0em),screen and (min-width:40em){.show-for-small-only{display:none!important}}@media screen and (min-width:40em){.hide-for-medium{display:none!important}}@media screen and (max-width:39.9375em){.show-for-medium{display:none!important}}@media screen and (min-width:40em) and (max-width:63.9375em){.hide-for-medium-only{display:none!important}}@media screen and (max-width:39.9375em),screen and (min-width:64em){.show-for-medium-only{display:none!important}}@media screen and (min-width:64em){.hide-for-large{display:none!important}}@media screen and (max-width:63.9375em){.show-for-large{display:none!important}}@media screen and (min-width:64em) and (max-width:74.9375em){.hide-for-large-only{display:none!important}}@media screen and (max-width:63.9375em),screen and (min-width:75em){.show-for-large-only{display:none!important}}.show-for-sr,.show-on-focus{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.show-on-focus:active,.show-on-focus:focus{position:static!important;height:auto;width:auto;overflow:visible;clip:auto}.hide-for-portrait,.show-for-landscape{display:block!important}@media screen and (orientation:landscape){.hide-for-portrait,.show-for-landscape{display:block!important}}@media screen and (orientation:portrait){.hide-for-portrait,.show-for-landscape{display:none!important}}.hide-for-landscape,.show-for-portrait{display:none!important}@media screen and (orientation:landscape){.hide-for-landscape,.show-for-portrait{display:none!important}}@media screen and (orientation:portrait){.hide-for-landscape,.show-for-portrait{display:block!important}}.button{display:inline-block;text-align:center;line-height:1;cursor:pointer;-webkit-appearance:none;transition:background-color .25s ease-out,color .25s ease-out;vertical-align:middle;border:1px solid transparent;border-radius:3px;padding:.85em 1em;margin:0 0 1rem;font-size:.9rem;background-color:#2ba6cb;color:#fefefe}[data-whatinput=mouse] .button{outline:0}.button:focus,.button:hover{background-color:#258dad;color:#fefefe}.button.tiny{font-size:.6rem}.button.small{font-size:.75rem}.button.large{font-size:1.25rem}.button.expanded{display:block;width:100%;margin-left:0;margin-right:0}.button.primary{background-color:#2ba6cb;color:#fefefe}.button.primary:focus,.button.primary:hover{background-color:#2285a2;color:#fefefe}.button.secondary{background-color:#e9e9e9;color:#0a0a0a}.button.secondary:focus,.button.secondary:hover{background-color:#bababa;color:#0a0a0a}.button.alert{background-color:#c60f13;color:#fefefe}.button.alert:focus,.button.alert:hover{background-color:#9e0c0f;color:#fefefe}.button.success{background-color:#5da423;color:#fefefe}.button.success:focus,.button.success:hover{background-color:#4a831c;color:#fefefe}.button.warning{background-color:#ffae00;color:#fefefe}.button.warning:focus,.button.warning:hover{background-color:#cc8b00;color:#fefefe}.button.body-font{background-color:#222;color:#fefefe}.button.body-font:focus,.button.body-font:hover{background-color:#1b1b1b;color:#fefefe}.button.header{background-color:#222;color:#fefefe}.button.header:focus,.button.header:hover{background-color:#1b1b1b;color:#fefefe}.button.hollow{border:1px solid #2ba6cb;color:#2ba6cb}.button.hollow,.button.hollow:focus,.button.hollow:hover{background-color:transparent}.button.hollow:focus,.button.hollow:hover{border-color:#165366;color:#165366}.button.hollow.primary{border:1px solid #2ba6cb;color:#2ba6cb}.button.hollow.primary:focus,.button.hollow.primary:hover{border-color:#165366;color:#165366}.button.hollow.secondary{border:1px solid #e9e9e9;color:#e9e9e9}.button.hollow.secondary:focus,.button.hollow.secondary:hover{border-color:#757575;color:#757575}.button.hollow.alert{border:1px solid #c60f13;color:#c60f13}.button.hollow.alert:focus,.button.hollow.alert:hover{border-color:#63080a;color:#63080a}.button.hollow.success{border:1px solid #5da423;color:#5da423}.button.hollow.success:focus,.button.hollow.success:hover{border-color:#2f5212;color:#2f5212}.button.hollow.warning{border:1px solid #ffae00;color:#ffae00}.button.hollow.warning:focus,.button.hollow.warning:hover{border-color:#805700;color:#805700}.button.hollow.body-font{border:1px solid #222;color:#222}.button.hollow.body-font:focus,.button.hollow.body-font:hover{border-color:#111;color:#111}.button.hollow.header{border:1px solid #222;color:#222}.button.hollow.header:focus,.button.hollow.header:hover{border-color:#111;color:#111}.button.disabled,.button[disabled]{opacity:.25;cursor:not-allowed}.button.disabled:focus,.button.disabled:hover,.button[disabled]:focus,.button[disabled]:hover{background-color:#2ba6cb;color:#fefefe}.button.dropdown:after{content:'';display:block;width:0;height:0;border:.4em inset;border-color:#fefefe transparent transparent;border-top-style:solid;border-bottom-width:0;position:relative;top:.4em;float:right;margin-left:1em;display:inline-block}.button.arrow-only:after{margin-left:0;float:none;top:-.1em}.close-button{position:absolute;color:#8a8a8a;right:1rem;top:.5rem;font-size:2em;line-height:1;cursor:pointer}[data-whatinput=mouse] .close-button{outline:0}.close-button:focus,.close-button:hover{color:#0a0a0a}.button-group{margin-bottom:1rem;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch}.button-group:after,.button-group:before{content:' ';display:table;-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;-webkit-order:1;-ms-flex-order:1;order:1}.button-group:after{clear:both}.button-group .button{margin:0;margin-right:1px;margin-bottom:1px;font-size:.9rem;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.button-group .button:last-child{margin-right:0}.button-group.tiny .button{font-size:.6rem}.button-group.small .button{font-size:.75rem}.button-group.large .button{font-size:1.25rem}.button-group.expanded .button{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px}.button-group.primary .button{background-color:#2ba6cb;color:#fefefe}.button-group.primary .button:focus,.button-group.primary .button:hover{background-color:#2285a2;color:#fefefe}.button-group.secondary .button{background-color:#e9e9e9;color:#0a0a0a}.button-group.secondary .button:focus,.button-group.secondary .button:hover{background-color:#bababa;color:#0a0a0a}.button-group.alert .button{background-color:#c60f13;color:#fefefe}.button-group.alert .button:focus,.button-group.alert .button:hover{background-color:#9e0c0f;color:#fefefe}.button-group.success .button{background-color:#5da423;color:#fefefe}.button-group.success .button:focus,.button-group.success .button:hover{background-color:#4a831c;color:#fefefe}.button-group.warning .button{background-color:#ffae00;color:#fefefe}.button-group.warning .button:focus,.button-group.warning .button:hover{background-color:#cc8b00;color:#fefefe}.button-group.body-font .button{background-color:#222;color:#fefefe}.button-group.body-font .button:focus,.button-group.body-font .button:hover{background-color:#1b1b1b;color:#fefefe}.button-group.header .button{background-color:#222;color:#fefefe}.button-group.header .button:focus,.button-group.header .button:hover{background-color:#1b1b1b;color:#fefefe}.button-group.stacked,.button-group.stacked-for-medium,.button-group.stacked-for-small{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.button-group.stacked-for-medium .button,.button-group.stacked-for-small .button,.button-group.stacked .button{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%}.button-group.stacked-for-medium .button:last-child,.button-group.stacked-for-small .button:last-child,.button-group.stacked .button:last-child{margin-bottom:0}@media screen and (min-width:40em){.button-group.stacked-for-small .button{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px;margin-bottom:0}}@media screen and (min-width:64em){.button-group.stacked-for-medium .button{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px;margin-bottom:0}}@media screen and (max-width:39.9375em){.button-group.stacked-for-small.expanded{display:block}.button-group.stacked-for-small.expanded .button{display:block;margin-right:0}}.slider{position:relative;height:.5rem;margin-top:1.25rem;margin-bottom:2.25rem;background-color:#e6e6e6;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-ms-touch-action:none;touch-action:none}.slider-fill{position:absolute;top:0;left:0;display:inline-block;max-width:100%;height:.5rem;background-color:#cacaca;transition:all .2s ease-in-out}.slider-fill.is-dragging{transition:all 0s linear}.slider-handle{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);position:absolute;left:0;z-index:1;display:inline-block;width:1.4rem;height:1.4rem;background-color:#2ba6cb;transition:all .2s ease-in-out;-ms-touch-action:manipulation;touch-action:manipulation;border-radius:3px}[data-whatinput=mouse] .slider-handle{outline:0}.slider-handle:hover{background-color:#258dad}.slider-handle.is-dragging{transition:all 0s linear}.slider.disabled,.slider[disabled]{opacity:.25;cursor:not-allowed}.slider.vertical{display:inline-block;width:.5rem;height:12.5rem;margin:0 1.25rem;-webkit-transform:scaleY(-1);transform:scaleY(-1)}.slider.vertical .slider-fill{top:0;width:.5rem;max-height:100%}.slider.vertical .slider-handle{position:absolute;top:0;left:50%;width:1.4rem;height:1.4rem;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.switch{margin-bottom:1rem;outline:0;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:#fefefe;font-weight:700;font-size:.875rem}.switch-input{opacity:0;position:absolute}.switch-paddle{background:#cacaca;cursor:pointer;display:block;position:relative;width:4rem;height:2rem;transition:all .25s ease-out;border-radius:3px;color:inherit;font-weight:inherit}input+.switch-paddle{margin:0}.switch-paddle:after{background:#fefefe;content:'';display:block;position:absolute;height:1.5rem;left:.25rem;top:.25rem;width:1.5rem;transition:all .25s ease-out;-webkit-transform:translateZ(0);transform:translateZ(0);border-radius:3px}input:checked~.switch-paddle{background:#2ba6cb}input:checked~.switch-paddle:after{left:2.25rem}[data-whatinput=mouse] input:focus~.switch-paddle{outline:0}.switch-active,.switch-inactive{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.switch-active{left:8%;display:none}input:checked+label>.switch-active{display:block}.switch-inactive{right:15%}input:checked+label>.switch-inactive{display:none}.switch.tiny .switch-paddle{width:3rem;height:1.5rem;font-size:.625rem}.switch.tiny .switch-paddle:after{width:1rem;height:1rem}.switch.tiny input:checked~.switch-paddle:after{left:1.75rem}.switch.small .switch-paddle{width:3.5rem;height:1.75rem;font-size:.75rem}.switch.small .switch-paddle:after{width:1.25rem;height:1.25rem}.switch.small input:checked~.switch-paddle:after{left:2rem}.switch.large .switch-paddle{width:5rem;height:2.5rem;font-size:1rem}.switch.large .switch-paddle:after{width:2rem;height:2rem}.switch.large input:checked~.switch-paddle:after{left:2.75rem}.menu{margin:0;list-style-type:none;width:100%;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap}[data-whatinput=mouse] .menu>li{outline:0}.menu>li>a{display:block;padding:.7rem 1rem;line-height:1}.menu a,.menu button,.menu input{margin-bottom:0}.menu>li>a{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row}.menu>li>a i,.menu>li>a img,.menu>li>a svg{margin-right:.25rem}.menu>li{-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.menu.vertical{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.menu.vertical>li{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.menu.vertical>li>a{-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}@media screen and (min-width:40em){.menu.medium-horizontal{-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.menu.medium-horizontal>li{-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.menu.medium-vertical{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.menu.medium-vertical>li{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.menu.medium-vertical>li>a{-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}}@media screen and (min-width:64em){.menu.large-horizontal{-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.menu.large-horizontal>li{-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.menu.large-vertical{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.menu.large-vertical>li{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.menu.large-vertical>li>a{-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}}.menu.simple li{line-height:1;display:inline-block;margin-right:1rem}.menu.simple a{padding:0}.menu.align-right{-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}.menu.expanded>li{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px}.menu.expanded>li:first-child:last-child{width:100%}.menu.icon-top>li>a{-webkit-flex-flow:column nowrap;-ms-flex-flow:column nowrap;flex-flow:column}.menu.icon-top>li>a i,.menu.icon-top>li>a img,.menu.icon-top>li>a svg{-webkit-align-self:stretch;-ms-flex-item-align:stretch;align-self:stretch;text-align:center;margin-bottom:.25rem}.menu.nested{margin-left:1rem}.menu .active>a{color:#fefefe;background:#2ba6cb}.menu-text{font-weight:700;color:inherit;line-height:1;padding-top:0;padding-bottom:0;padding:.7rem 1rem}.menu-centered{text-align:center}.menu-centered>.menu{display:inline-block}.no-js [data-responsive-menu] ul{display:none}.is-drilldown{position:relative;overflow:hidden}.is-drilldown li{display:block!important}.is-drilldown-submenu{position:absolute;top:0;left:100%;z-index:-1;height:100%;width:100%;background:#fefefe;transition:-webkit-transform .15s linear;transition:transform .15s linear}.is-drilldown-submenu.is-active{z-index:1;display:block;-webkit-transform:translateX(-100%);transform:translateX(-100%)}.is-drilldown-submenu.is-closing{-webkit-transform:translateX(100%);transform:translateX(100%)}.is-drilldown-submenu-parent>a{position:relative}.is-drilldown-submenu-parent>a:after{content:'';display:block;width:0;height:0;border:6px inset;border-color:transparent transparent transparent #2ba6cb;border-left-style:solid;border-right-width:0;position:absolute;top:50%;margin-top:-6px;right:1rem}.js-drilldown-back>a:before{content:'';display:block;width:0;height:0;border:6px inset;border-color:transparent #2ba6cb transparent transparent;border-right-style:solid;border-left-width:0;display:inline-block;vertical-align:middle;margin-right:.75rem}.is-accordion-submenu-parent>a{position:relative}.is-accordion-submenu-parent>a:after{content:'';display:block;width:0;height:0;border:6px inset;border-color:#2ba6cb transparent transparent;border-top-style:solid;border-bottom-width:0;position:absolute;top:50%;margin-top:-4px;right:1rem}.is-accordion-submenu-parent[aria-expanded=true]>a:after{-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scaleY(-1);transform:scaleY(-1)}.dropdown.menu>li.opens-left>.is-dropdown-submenu{left:auto;right:0;top:100%}.dropdown.menu>li.opens-right>.is-dropdown-submenu{right:auto;left:0;top:100%}.dropdown.menu>li.is-dropdown-submenu-parent>a{padding-right:1.5rem;position:relative}.dropdown.menu>li.is-dropdown-submenu-parent>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:#2ba6cb transparent transparent;border-top-style:solid;border-bottom-width:0;right:5px;margin-top:-2px}[data-whatinput=mouse] .dropdown.menu a{outline:0}.no-js .dropdown.menu ul{display:none}.dropdown.menu.vertical>li .is-dropdown-submenu{top:0}.dropdown.menu.vertical>li.opens-left>.is-dropdown-submenu{left:auto;right:100%}.dropdown.menu.vertical>li.opens-right>.is-dropdown-submenu{right:auto;left:100%}.dropdown.menu.vertical>li>a:after{right:14px;margin-top:-3px}.dropdown.menu.vertical>li.opens-left>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:transparent #2ba6cb transparent transparent;border-right-style:solid;border-left-width:0}.dropdown.menu.vertical>li.opens-right>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:transparent transparent transparent #2ba6cb;border-left-style:solid;border-right-width:0}@media screen and (min-width:40em){.dropdown.menu.medium-horizontal>li.opens-left>.is-dropdown-submenu{left:auto;right:0;top:100%}.dropdown.menu.medium-horizontal>li.opens-right>.is-dropdown-submenu{right:auto;left:0;top:100%}.dropdown.menu.medium-horizontal>li.is-dropdown-submenu-parent>a{padding-right:1.5rem;position:relative}.dropdown.menu.medium-horizontal>li.is-dropdown-submenu-parent>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:#2ba6cb transparent transparent;border-top-style:solid;border-bottom-width:0;right:5px;margin-top:-2px}.dropdown.menu.medium-vertical>li .is-dropdown-submenu{top:0}.dropdown.menu.medium-vertical>li.opens-left>.is-dropdown-submenu{left:auto;right:100%}.dropdown.menu.medium-vertical>li.opens-right>.is-dropdown-submenu{right:auto;left:100%}.dropdown.menu.medium-vertical>li>a:after{right:14px;margin-top:-3px}.dropdown.menu.medium-vertical>li.opens-left>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:transparent #2ba6cb transparent transparent;border-right-style:solid;border-left-width:0}.dropdown.menu.medium-vertical>li.opens-right>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:transparent transparent transparent #2ba6cb;border-left-style:solid;border-right-width:0}}@media screen and (min-width:64em){.dropdown.menu.large-horizontal>li.opens-left>.is-dropdown-submenu{left:auto;right:0;top:100%}.dropdown.menu.large-horizontal>li.opens-right>.is-dropdown-submenu{right:auto;left:0;top:100%}.dropdown.menu.large-horizontal>li.is-dropdown-submenu-parent>a{padding-right:1.5rem;position:relative}.dropdown.menu.large-horizontal>li.is-dropdown-submenu-parent>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:#2ba6cb transparent transparent;border-top-style:solid;border-bottom-width:0;right:5px;margin-top:-2px}.dropdown.menu.large-vertical>li .is-dropdown-submenu{top:0}.dropdown.menu.large-vertical>li.opens-left>.is-dropdown-submenu{left:auto;right:100%}.dropdown.menu.large-vertical>li.opens-right>.is-dropdown-submenu{right:auto;left:100%}.dropdown.menu.large-vertical>li>a:after{right:14px;margin-top:-3px}.dropdown.menu.large-vertical>li.opens-left>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:transparent #2ba6cb transparent transparent;border-right-style:solid;border-left-width:0}.dropdown.menu.large-vertical>li.opens-right>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:transparent transparent transparent #2ba6cb;border-left-style:solid;border-right-width:0}}.dropdown.menu.align-right .is-dropdown-submenu.first-sub{top:100%;left:auto;right:0}.is-dropdown-menu.vertical{width:100px}.is-dropdown-menu.vertical.align-right{float:right}.is-dropdown-submenu-parent{position:relative}.is-dropdown-submenu-parent a:after{position:absolute;top:50%;right:5px;margin-top:-2px}.is-dropdown-submenu-parent.opens-inner>.is-dropdown-submenu{top:100%;left:auto}.is-dropdown-submenu-parent.opens-left>.is-dropdown-submenu{left:auto;right:100%}.is-dropdown-submenu-parent.opens-right>.is-dropdown-submenu{right:auto;left:100%}.is-dropdown-submenu{display:none;position:absolute;top:0;left:100%;min-width:200px;z-index:1;background:#fefefe;border:1px solid #cacaca}.is-dropdown-submenu .is-dropdown-submenu-parent>a:after{right:14px;margin-top:-3px}.is-dropdown-submenu .is-dropdown-submenu-parent.opens-left>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:transparent #2ba6cb transparent transparent;border-right-style:solid;border-left-width:0}.is-dropdown-submenu .is-dropdown-submenu-parent.opens-right>a:after{content:'';display:block;width:0;height:0;border:5px inset;border-color:transparent transparent transparent #2ba6cb;border-left-style:solid;border-right-width:0}.is-dropdown-submenu .is-dropdown-submenu{margin-top:-1px}.is-dropdown-submenu>li{width:100%}.is-dropdown-submenu.js-dropdown-active{display:block}.title-bar{background:#0a0a0a;color:#fefefe;padding:.5rem;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.title-bar .menu-icon{margin-left:.25rem;margin-right:.25rem}.title-bar-left,.title-bar-right{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px}.title-bar-right{text-align:right}.title-bar-title{font-weight:700;vertical-align:middle;display:inline-block}.top-bar{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;padding:.5rem;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.top-bar,.top-bar ul{background-color:#e6e6e6}.top-bar input{max-width:200px;margin-right:1rem}.top-bar .input-group-field{width:100%;margin-right:0}.top-bar input.button{width:auto}.top-bar .top-bar-left,.top-bar .top-bar-right{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}@media screen and (min-width:40em){.top-bar{-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.top-bar .top-bar-left,.top-bar .top-bar-right{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px}}@media screen and (max-width:63.9375em){.top-bar.stacked-for-medium{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.top-bar.stacked-for-medium .top-bar-left,.top-bar.stacked-for-medium .top-bar-right{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}}@media screen and (max-width:74.9375em){.top-bar.stacked-for-large{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.top-bar.stacked-for-large .top-bar-left,.top-bar.stacked-for-large .top-bar-right{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}}.top-bar-title{margin-right:1rem}.top-bar-left,.top-bar-right,.top-bar-title{-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.breadcrumbs{list-style:none;margin:0 0 1rem}.breadcrumbs:after,.breadcrumbs:before{content:' ';display:table;-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;-webkit-order:1;-ms-flex-order:1;order:1}.breadcrumbs:after{clear:both}.breadcrumbs li{float:left;color:#0a0a0a;font-size:.6875rem;cursor:default;text-transform:uppercase}.breadcrumbs li:not(:last-child):after{color:#cacaca;content:"/";margin:0 .75rem;position:relative;top:1px;opacity:1}.breadcrumbs a{color:#2ba6cb}.breadcrumbs a:hover{text-decoration:underline}.breadcrumbs .disabled{color:#cacaca;cursor:not-allowed}.pagination{margin-left:0;margin-bottom:1rem}.pagination:after,.pagination:before{content:' ';display:table;-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;-webkit-order:1;-ms-flex-order:1;order:1}.pagination:after{clear:both}.pagination li{font-size:.875rem;margin-right:.0625rem;border-radius:3px;display:none}.pagination li:first-child,.pagination li:last-child{display:inline-block}@media screen and (min-width:40em){.pagination li{display:inline-block}}.pagination a,.pagination button{color:#0a0a0a;display:block;padding:.1875rem .625rem;border-radius:3px}.pagination a:hover,.pagination button:hover{background:#e6e6e6}.pagination .current{padding:.1875rem .625rem;background:#2ba6cb;color:#fefefe;cursor:default}.pagination .disabled{padding:.1875rem .625rem;color:#cacaca;cursor:not-allowed}.pagination .disabled:hover{background:transparent}.pagination .ellipsis:after{content:'\2026';padding:.1875rem .625rem;color:#0a0a0a}.pagination-previous.disabled:before,.pagination-previous a:before{content:'\00ab';display:inline-block;margin-right:.5rem}.pagination-next.disabled:after,.pagination-next a:after{content:'\00bb';display:inline-block;margin-left:.5rem}.accordion{list-style-type:none;background:#fefefe;margin-left:0}.accordion-item:first-child>:first-child{border-radius:3px 3px 0 0}.accordion-item:last-child>:last-child{border-radius:0 0 3px 3px}.accordion-title{display:block;padding:1.25rem 1rem;line-height:1;font-size:.75rem;color:#2ba6cb;position:relative;border:1px solid #e6e6e6;border-bottom:0}:last-child:not(.is-active)>.accordion-title{border-radius:0 0 3px 3px;border-bottom:1px solid #e6e6e6}.accordion-title:focus,.accordion-title:hover{background-color:#e6e6e6}.accordion-title:before{content:'+';position:absolute;right:1rem;top:50%;margin-top:-.5rem}.is-active>.accordion-title:before{content:'–'}.accordion-content{padding:1rem;display:none;border:1px solid #e6e6e6;border-bottom:0;background-color:#fefefe;color:#0a0a0a}:last-child>.accordion-content:last-child{border-bottom:1px solid #e6e6e6}.dropdown-pane{background-color:#fefefe;border:1px solid #cacaca;border-radius:3px;display:block;font-size:1rem;padding:1rem;position:absolute;visibility:hidden;width:300px;z-index:3}.dropdown-pane.is-open{visibility:visible}.dropdown-pane.tiny{width:100px}.dropdown-pane.small{width:200px}.dropdown-pane.large{width:400px}body,html{height:100%}.off-canvas-wrapper{width:100%;overflow-x:hidden;position:relative;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-overflow-scrolling:auto}.off-canvas-wrapper-inner{position:relative;width:100%;transition:-webkit-transform .5s ease;transition:transform .5s ease}.off-canvas-wrapper-inner:after,.off-canvas-wrapper-inner:before{content:' ';display:table;-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;-webkit-order:1;-ms-flex-order:1;order:1}.off-canvas-wrapper-inner:after{clear:both}.off-canvas-content{min-height:100%;background:#fefefe;transition:-webkit-transform .5s ease;transition:transform .5s ease;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;padding-bottom:.1px;box-shadow:0 0 10px hsla(0,0%,4%,.5)}.js-off-canvas-exit{display:none;position:absolute;top:0;left:0;width:100%;height:100%;background:hsla(0,0%,100%,.25);cursor:pointer;transition:background .5s ease}.off-canvas{position:absolute;background:#e6e6e6;z-index:-1;max-height:100%;overflow-y:auto;-webkit-transform:translateX(0);transform:translateX(0)}[data-whatinput=mouse] .off-canvas{outline:0}.off-canvas.position-left{left:-250px;top:0;width:250px}.is-open-left{-webkit-transform:translateX(250px);transform:translateX(250px)}.off-canvas.position-right{right:-250px;top:0;width:250px}.is-open-right{-webkit-transform:translateX(-250px);transform:translateX(-250px)}@media screen and (min-width:40em){.position-left.reveal-for-medium{left:0;z-index:auto;position:fixed}.position-left.reveal-for-medium~.off-canvas-content{margin-left:250px}.position-right.reveal-for-medium{right:0;z-index:auto;position:fixed}.position-right.reveal-for-medium~.off-canvas-content{margin-right:250px}}@media screen and (min-width:64em){.position-left.reveal-for-large{left:0;z-index:auto;position:fixed}.position-left.reveal-for-large~.off-canvas-content{margin-left:250px}.position-right.reveal-for-large{right:0;z-index:auto;position:fixed}.position-right.reveal-for-large~.off-canvas-content{margin-right:250px}}.tabs{margin:0;list-style-type:none;background:#fefefe;border:1px solid #e6e6e6}.tabs:after,.tabs:before{content:' ';display:table;-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;-webkit-order:1;-ms-flex-order:1;order:1}.tabs:after{clear:both}.tabs.vertical>li{width:auto;float:none;display:block}.tabs.simple>li>a{padding:0}.tabs.simple>li>a:hover{background:transparent}.tabs.primary{background:#2ba6cb}.tabs.primary>li>a{color:#fefefe}.tabs.primary>li>a:focus,.tabs.primary>li>a:hover{background:#299ec1}.tabs-title{float:left}.tabs-title>a{display:block;padding:1.25rem 1.5rem;line-height:1;font-size:.75rem}.tabs-title>a:hover{background:#fefefe}.tabs-title>a:focus,.tabs-title>a[aria-selected=true]{background:#e6e6e6}.tabs-content{background:#fefefe;transition:all .5s ease;border:1px solid #e6e6e6;border-top:0}.tabs-content.vertical{border:1px solid #e6e6e6;border-left:0}.tabs-panel{display:none;padding:1rem}.tabs-panel.is-active{display:block}.callout{margin:0 0 1rem;padding:1rem;border:1px solid hsla(0,0%,4%,.25);border-radius:3px;position:relative;color:#0a0a0a;background-color:#fff}.callout>:first-child{margin-top:0}.callout>:last-child{margin-bottom:0}.callout.primary{background-color:#def2f8}.callout.secondary{background-color:#fcfcfc}.callout.alert{background-color:#fcd6d6}.callout.success{background-color:#e6f7d9}.callout.warning{background-color:#fff3d9}.callout.body-font,.callout.header{background-color:#dedede}.callout.small{padding:.5rem}.callout.large{padding:3rem}.media-object{margin-bottom:1rem;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.media-object img{max-width:none}@media screen and (max-width:39.9375em){.media-object.stack-for-small{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}}@media screen and (max-width:39.9375em){.media-object.stack-for-small .media-object-section{padding:0;padding-bottom:1rem;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.media-object.stack-for-small .media-object-section img{width:100%}}.media-object-section{-webkit-flex:0 1 auto;-ms-flex:0 1 auto;flex:0 1 auto}.media-object-section:first-child{padding-right:1rem}.media-object-section:last-child:not(:nth-child(2)){padding-left:1rem}.media-object-section>:last-child{margin-bottom:0}.media-object-section.main-section{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px}body.is-reveal-open{overflow:hidden}html.is-reveal-open,html.is-reveal-open body{height:100%;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.reveal-overlay{display:none;position:fixed;top:0;bottom:0;left:0;right:0;z-index:4;background-color:hsla(0,0%,4%,.45);overflow-y:scroll}.reveal{display:none;z-index:5;padding:1rem;border:1px solid #cacaca;background-color:#fefefe;border-radius:3px;position:relative;top:100px;margin-left:auto;margin-right:auto;overflow-y:auto}[data-whatinput=mouse] .reveal{outline:0}@media screen and (min-width:40em){.reveal{min-height:0}}.reveal .column,.reveal .columns{min-width:0}.reveal>:last-child{margin-bottom:0}@media screen and (min-width:40em){.reveal{width:600px;max-width:62.5rem}}@media screen and (min-width:40em){.reveal .reveal{left:auto;right:auto;margin:0 auto}}.reveal.collapse{padding:0}@media screen and (min-width:40em){.reveal.tiny{width:30%;max-width:62.5rem}}@media screen and (min-width:40em){.reveal.small{width:50%;max-width:62.5rem}}@media screen and (min-width:40em){.reveal.large{width:90%;max-width:62.5rem}}.reveal.full{top:0;left:0;width:100%;height:100%;height:100vh;min-height:100vh;max-width:none;margin-left:0;border:0;border-radius:0}@media screen and (max-width:39.9375em){.reveal{top:0;left:0;width:100%;height:100%;height:100vh;min-height:100vh;max-width:none;margin-left:0;border:0;border-radius:0}}.reveal.without-overlay{position:fixed}table{width:100%;margin-bottom:1rem;border-radius:3px}table tbody,table tfoot,table thead{border:1px solid #f1f1f1;background-color:#fefefe}table caption{font-weight:700;padding:.5rem .625rem .625rem}table tfoot,table thead{background:#f8f8f8;color:#0a0a0a}table tfoot tr,table thead tr{background:transparent}table tfoot td,table tfoot th,table thead td,table thead th{padding:.5rem .625rem .625rem;font-weight:700;text-align:left}table tbody tr:nth-child(even){background-color:#f1f1f1}table tbody td,table tbody th{padding:.5rem .625rem .625rem}@media screen and (max-width:63.9375em){table.stack tfoot,table.stack thead{display:none}table.stack td,table.stack th,table.stack tr{display:block}table.stack td{border-top:0}}table.scroll{display:block;width:100%;overflow-x:auto}table.hover tr:hover{background-color:#f9f9f9}table.hover tr:nth-of-type(even):hover{background-color:#ececec}.table-scroll{overflow-x:auto}.table-scroll table{width:auto}.badge{display:inline-block;padding:.3em;min-width:2.1em;font-size:.6rem;text-align:center;border-radius:50%;background:#2ba6cb;color:#fefefe}.badge.secondary{background:#e9e9e9;color:#0a0a0a}.badge.alert{background:#c60f13;color:#fefefe}.badge.success{background:#5da423;color:#fefefe}.badge.warning{background:#ffae00;color:#fefefe}.badge.body-font,.badge.header{background:#222;color:#fefefe}.label{display:inline-block;padding:.33333rem .5rem;font-size:.8rem;line-height:1;white-space:nowrap;cursor:default;border-radius:3px;background:#2ba6cb;color:#fefefe}.label.secondary{background:#e9e9e9;color:#0a0a0a}.label.alert{background:#c60f13;color:#fefefe}.label.success{background:#5da423;color:#fefefe}.label.warning{background:#ffae00;color:#fefefe}.label.body-font,.label.header{background:#222;color:#fefefe}.progress{background-color:#cacaca;height:1rem;margin-bottom:1rem;border-radius:3px}.progress.primary .progress-meter{background-color:#2ba6cb}.progress.secondary .progress-meter{background-color:#e9e9e9}.progress.alert .progress-meter{background-color:#c60f13}.progress.success .progress-meter{background-color:#5da423}.progress.warning .progress-meter{background-color:#ffae00}.progress.body-font .progress-meter,.progress.header .progress-meter{background-color:#222}.progress-meter{position:relative;display:block;width:0;height:100%;background-color:#2ba6cb;border-radius:3px}.progress-meter-text{top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);position:absolute;margin:0;font-size:.75rem;font-weight:700;color:#fefefe;white-space:nowrap;border-radius:3px}.has-tip{border-bottom:1px dotted #8a8a8a;font-weight:700;position:relative;display:inline-block;cursor:help}.tooltip{background-color:#0a0a0a;color:#fefefe;font-size:80%;padding:.75rem;position:absolute;z-index:3;top:calc(100% + .6495rem);max-width:10rem!important;border-radius:3px}.tooltip:before{border-color:transparent transparent #0a0a0a;border-bottom-style:solid;border-top-width:0;bottom:100%;position:absolute;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.tooltip.top:before,.tooltip:before{content:'';display:block;width:0;height:0;border:.75rem inset}.tooltip.top:before{border-color:#0a0a0a transparent transparent;border-top-style:solid;border-bottom-width:0;top:100%;bottom:auto}.tooltip.left:before{border-color:transparent transparent transparent #0a0a0a;border-left-style:solid;border-right-width:0;left:100%}.tooltip.left:before,.tooltip.right:before{content:'';display:block;width:0;height:0;border:.75rem inset;bottom:auto;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.tooltip.right:before{border-color:transparent #0a0a0a transparent transparent;border-right-style:solid;border-left-width:0;left:auto;right:100%}.flex-video{position:relative;height:0;padding-bottom:75%;margin-bottom:1rem;overflow:hidden}.flex-video embed,.flex-video iframe,.flex-video object,.flex-video video{position:absolute;top:0;left:0;width:100%;height:100%}.flex-video.widescreen{padding-bottom:56.25%}.flex-video.vimeo{padding-top:0}.orbit,.orbit-container{position:relative}.orbit-container{margin:0;overflow:hidden;list-style:none}.orbit-slide{width:100%;max-height:100%}.orbit-slide.no-motionui.is-active{top:0;left:0}.orbit-figure{margin:0}.orbit-image{margin:0;width:100%;max-width:100%}.orbit-caption{bottom:0;width:100%;margin-bottom:0;background-color:hsla(0,0%,4%,.5)}.orbit-caption,.orbit-next,.orbit-previous{position:absolute;padding:1rem;color:#fefefe}.orbit-next,.orbit-previous{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:3}[data-whatinput=mouse] .orbit-next,[data-whatinput=mouse] .orbit-previous{outline:0}.orbit-next:active,.orbit-next:focus,.orbit-next:hover,.orbit-previous:active,.orbit-previous:focus,.orbit-previous:hover{background-color:hsla(0,0%,4%,.5)}.orbit-previous{left:0}.orbit-next{left:auto;right:0}.orbit-bullets{position:relative;margin-top:.8rem;margin-bottom:.8rem;text-align:center}[data-whatinput=mouse] .orbit-bullets{outline:0}.orbit-bullets button{width:1.2rem;height:1.2rem;margin:.1rem;background-color:#cacaca;border-radius:50%}.orbit-bullets button.is-active,.orbit-bullets button:hover{background-color:#8a8a8a}.thumbnail{border:4px solid #fefefe;box-shadow:0 0 0 1px hsla(0,0%,4%,.2);display:inline-block;line-height:0;max-width:100%;transition:box-shadow .2s ease-out;border-radius:3px;margin-bottom:1rem}.thumbnail:focus,.thumbnail:hover{box-shadow:0 0 6px 1px rgba(43,166,203,.5)}.sticky-container{position:relative}.sticky{position:absolute;z-index:0;-webkit-transform:translateZ(0);transform:translateZ(0)}.sticky.is-stuck{position:fixed;z-index:2}.sticky.is-stuck.is-at-top{top:0}.sticky.is-stuck.is-at-bottom{bottom:0}.sticky.is-anchored{position:absolute;left:auto;right:auto}.sticky.is-anchored.is-at-bottom{bottom:0}.row{max-width:62.5rem;margin-left:auto;margin-right:auto;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap}.row .row{margin-left:-.9375rem;margin-right:-.9375rem}.row.expanded,.row .row{max-width:none}.row.collapse>.column,.row.collapse>.columns{padding-left:0;padding-right:0}.column,.columns{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px;padding-left:.9375rem;padding-right:.9375rem;min-width:initial}.column.row.row,.row.row.columns{float:none;display:block}.row .column.row.row,.row .row.row.columns{padding-left:0;padding-right:0;margin-left:0;margin-right:0}.small-1{-webkit-flex:0 0 8.33333%;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;max-width:8.33333%}.small-offset-0{margin-left:0}.small-2{-webkit-flex:0 0 16.66667%;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;max-width:16.66667%}.small-offset-1{margin-left:8.33333%}.small-3{-webkit-flex:0 0 25%;-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.small-offset-2{margin-left:16.66667%}.small-4{-webkit-flex:0 0 33.33333%;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;max-width:33.33333%}.small-offset-3{margin-left:25%}.small-5{-webkit-flex:0 0 41.66667%;-ms-flex:0 0 41.66667%;flex:0 0 41.66667%;max-width:41.66667%}.small-offset-4{margin-left:33.33333%}.small-6{-webkit-flex:0 0 50%;-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}.small-offset-5{margin-left:41.66667%}.small-7{-webkit-flex:0 0 58.33333%;-ms-flex:0 0 58.33333%;flex:0 0 58.33333%;max-width:58.33333%}.small-offset-6{margin-left:50%}.small-8{-webkit-flex:0 0 66.66667%;-ms-flex:0 0 66.66667%;flex:0 0 66.66667%;max-width:66.66667%}.small-offset-7{margin-left:58.33333%}.small-9{-webkit-flex:0 0 75%;-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}.small-offset-8{margin-left:66.66667%}.small-10{-webkit-flex:0 0 83.33333%;-ms-flex:0 0 83.33333%;flex:0 0 83.33333%;max-width:83.33333%}.small-offset-9{margin-left:75%}.small-11{-webkit-flex:0 0 91.66667%;-ms-flex:0 0 91.66667%;flex:0 0 91.66667%;max-width:91.66667%}.small-offset-10{margin-left:83.33333%}.small-12{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.small-offset-11{margin-left:91.66667%}.small-up-1{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.small-up-1>.column,.small-up-1>.columns{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.small-up-2{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.small-up-2>.column,.small-up-2>.columns{-webkit-flex:0 0 50%;-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}.small-up-3{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.small-up-3>.column,.small-up-3>.columns{-webkit-flex:0 0 33.33333%;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;max-width:33.33333%}.small-up-4{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.small-up-4>.column,.small-up-4>.columns{-webkit-flex:0 0 25%;-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.small-up-5{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.small-up-5>.column,.small-up-5>.columns{-webkit-flex:0 0 20%;-ms-flex:0 0 20%;flex:0 0 20%;max-width:20%}.small-up-6{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.small-up-6>.column,.small-up-6>.columns{-webkit-flex:0 0 16.66667%;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;max-width:16.66667%}.small-up-7{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.small-up-7>.column,.small-up-7>.columns{-webkit-flex:0 0 14.28571%;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;max-width:14.28571%}.small-up-8{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.small-up-8>.column,.small-up-8>.columns{-webkit-flex:0 0 12.5%;-ms-flex:0 0 12.5%;flex:0 0 12.5%;max-width:12.5%}.small-collapse>.column,.small-collapse>.columns{padding-left:0;padding-right:0}.small-uncollapse>.column,.small-uncollapse>.columns{padding-left:.9375rem;padding-right:.9375rem}@media screen and (min-width:40em){.medium-1{-webkit-flex:0 0 8.33333%;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;max-width:8.33333%}.medium-offset-0{margin-left:0}.medium-2{-webkit-flex:0 0 16.66667%;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;max-width:16.66667%}.medium-offset-1{margin-left:8.33333%}.medium-3{-webkit-flex:0 0 25%;-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.medium-offset-2{margin-left:16.66667%}.medium-4{-webkit-flex:0 0 33.33333%;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;max-width:33.33333%}.medium-offset-3{margin-left:25%}.medium-5{-webkit-flex:0 0 41.66667%;-ms-flex:0 0 41.66667%;flex:0 0 41.66667%;max-width:41.66667%}.medium-offset-4{margin-left:33.33333%}.medium-6{-webkit-flex:0 0 50%;-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}.medium-offset-5{margin-left:41.66667%}.medium-7{-webkit-flex:0 0 58.33333%;-ms-flex:0 0 58.33333%;flex:0 0 58.33333%;max-width:58.33333%}.medium-offset-6{margin-left:50%}.medium-8{-webkit-flex:0 0 66.66667%;-ms-flex:0 0 66.66667%;flex:0 0 66.66667%;max-width:66.66667%}.medium-offset-7{margin-left:58.33333%}.medium-9{-webkit-flex:0 0 75%;-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}.medium-offset-8{margin-left:66.66667%}.medium-10{-webkit-flex:0 0 83.33333%;-ms-flex:0 0 83.33333%;flex:0 0 83.33333%;max-width:83.33333%}.medium-offset-9{margin-left:75%}.medium-11{-webkit-flex:0 0 91.66667%;-ms-flex:0 0 91.66667%;flex:0 0 91.66667%;max-width:91.66667%}.medium-offset-10{margin-left:83.33333%}.medium-12{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.medium-offset-11{margin-left:91.66667%}.medium-order-1{-webkit-order:1;-ms-flex-order:1;order:1}.medium-order-2{-webkit-order:2;-ms-flex-order:2;order:2}.medium-order-3{-webkit-order:3;-ms-flex-order:3;order:3}.medium-order-4{-webkit-order:4;-ms-flex-order:4;order:4}.medium-order-5{-webkit-order:5;-ms-flex-order:5;order:5}.medium-order-6{-webkit-order:6;-ms-flex-order:6;order:6}.medium-up-1{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.medium-up-1>.column,.medium-up-1>.columns{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.medium-up-2{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.medium-up-2>.column,.medium-up-2>.columns{-webkit-flex:0 0 50%;-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}.medium-up-3{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.medium-up-3>.column,.medium-up-3>.columns{-webkit-flex:0 0 33.33333%;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;max-width:33.33333%}.medium-up-4{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.medium-up-4>.column,.medium-up-4>.columns{-webkit-flex:0 0 25%;-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.medium-up-5{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.medium-up-5>.column,.medium-up-5>.columns{-webkit-flex:0 0 20%;-ms-flex:0 0 20%;flex:0 0 20%;max-width:20%}.medium-up-6{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.medium-up-6>.column,.medium-up-6>.columns{-webkit-flex:0 0 16.66667%;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;max-width:16.66667%}.medium-up-7{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.medium-up-7>.column,.medium-up-7>.columns{-webkit-flex:0 0 14.28571%;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;max-width:14.28571%}.medium-up-8{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.medium-up-8>.column,.medium-up-8>.columns{-webkit-flex:0 0 12.5%;-ms-flex:0 0 12.5%;flex:0 0 12.5%;max-width:12.5%}}@media screen and (min-width:40em) and (min-width:40em){.medium-expand{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px}}.row.medium-unstack>.column,.row.medium-unstack>.columns{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%}@media screen and (min-width:40em){.row.medium-unstack>.column,.row.medium-unstack>.columns{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px}}@media screen and (min-width:40em){.medium-collapse>.column,.medium-collapse>.columns{padding-left:0;padding-right:0}.medium-uncollapse>.column,.medium-uncollapse>.columns{padding-left:.9375rem;padding-right:.9375rem}}@media screen and (min-width:64em){.large-1{-webkit-flex:0 0 8.33333%;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;max-width:8.33333%}.large-offset-0{margin-left:0}.large-2{-webkit-flex:0 0 16.66667%;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;max-width:16.66667%}.large-offset-1{margin-left:8.33333%}.large-3{-webkit-flex:0 0 25%;-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.large-offset-2{margin-left:16.66667%}.large-4{-webkit-flex:0 0 33.33333%;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;max-width:33.33333%}.large-offset-3{margin-left:25%}.large-5{-webkit-flex:0 0 41.66667%;-ms-flex:0 0 41.66667%;flex:0 0 41.66667%;max-width:41.66667%}.large-offset-4{margin-left:33.33333%}.large-6{-webkit-flex:0 0 50%;-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}.large-offset-5{margin-left:41.66667%}.large-7{-webkit-flex:0 0 58.33333%;-ms-flex:0 0 58.33333%;flex:0 0 58.33333%;max-width:58.33333%}.large-offset-6{margin-left:50%}.large-8{-webkit-flex:0 0 66.66667%;-ms-flex:0 0 66.66667%;flex:0 0 66.66667%;max-width:66.66667%}.large-offset-7{margin-left:58.33333%}.large-9{-webkit-flex:0 0 75%;-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}.large-offset-8{margin-left:66.66667%}.large-10{-webkit-flex:0 0 83.33333%;-ms-flex:0 0 83.33333%;flex:0 0 83.33333%;max-width:83.33333%}.large-offset-9{margin-left:75%}.large-11{-webkit-flex:0 0 91.66667%;-ms-flex:0 0 91.66667%;flex:0 0 91.66667%;max-width:91.66667%}.large-offset-10{margin-left:83.33333%}.large-12{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.large-offset-11{margin-left:91.66667%}.large-order-1{-webkit-order:1;-ms-flex-order:1;order:1}.large-order-2{-webkit-order:2;-ms-flex-order:2;order:2}.large-order-3{-webkit-order:3;-ms-flex-order:3;order:3}.large-order-4{-webkit-order:4;-ms-flex-order:4;order:4}.large-order-5{-webkit-order:5;-ms-flex-order:5;order:5}.large-order-6{-webkit-order:6;-ms-flex-order:6;order:6}.large-up-1{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.large-up-1>.column,.large-up-1>.columns{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}.large-up-2{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.large-up-2>.column,.large-up-2>.columns{-webkit-flex:0 0 50%;-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}.large-up-3{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.large-up-3>.column,.large-up-3>.columns{-webkit-flex:0 0 33.33333%;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;max-width:33.33333%}.large-up-4{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.large-up-4>.column,.large-up-4>.columns{-webkit-flex:0 0 25%;-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.large-up-5{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.large-up-5>.column,.large-up-5>.columns{-webkit-flex:0 0 20%;-ms-flex:0 0 20%;flex:0 0 20%;max-width:20%}.large-up-6{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.large-up-6>.column,.large-up-6>.columns{-webkit-flex:0 0 16.66667%;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;max-width:16.66667%}.large-up-7{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.large-up-7>.column,.large-up-7>.columns{-webkit-flex:0 0 14.28571%;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;max-width:14.28571%}.large-up-8{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.large-up-8>.column,.large-up-8>.columns{-webkit-flex:0 0 12.5%;-ms-flex:0 0 12.5%;flex:0 0 12.5%;max-width:12.5%}}@media screen and (min-width:64em) and (min-width:64em){.large-expand{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px}}.row.large-unstack>.column,.row.large-unstack>.columns{-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%}@media screen and (min-width:64em){.row.large-unstack>.column,.row.large-unstack>.columns{-webkit-flex:1 1 0px;-ms-flex:1 1 0px;flex:1 1 0px}}@media screen and (min-width:64em){.large-collapse>.column,.large-collapse>.columns{padding-left:0;padding-right:0}.large-uncollapse>.column,.large-uncollapse>.columns{padding-left:.9375rem;padding-right:.9375rem}}.shrink{-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;max-width:100%}.align-top.columns,.column.align-top{-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start}.align-bottom.columns,.column.align-bottom{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end}.align-middle.columns,.column.align-middle{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.align-stretch.columns,.column.align-stretch{-webkit-align-self:stretch;-ms-flex-item-align:stretch;align-self:stretch}.align-right{-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}.align-center{-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.align-justify{-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.align-spaced{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}.align-top{-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}.align-self-top{-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start}.align-bottom{-webkit-align-items:flex-end;-ms-flex-align:end;align-items:flex-end}.align-self-bottom{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end}.align-middle{-webkit-align-items:center;-ms-flex-align:center;align-items:center}.align-self-middle{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.align-stretch{-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch}.align-self-stretch{-webkit-align-self:stretch;-ms-flex-item-align:stretch;align-self:stretch}.small-order-1{-webkit-order:1;-ms-flex-order:1;order:1}.small-order-2{-webkit-order:2;-ms-flex-order:2;order:2}.small-order-3{-webkit-order:3;-ms-flex-order:3;order:3}.small-order-4{-webkit-order:4;-ms-flex-order:4;order:4}.small-order-5{-webkit-order:5;-ms-flex-order:5;order:5}.small-order-6{-webkit-order:6;-ms-flex-order:6;order:6}@media screen and (min-width:40em){.medium-order-1{-webkit-order:1;-ms-flex-order:1;order:1}.medium-order-2{-webkit-order:2;-ms-flex-order:2;order:2}.medium-order-3{-webkit-order:3;-ms-flex-order:3;order:3}.medium-order-4{-webkit-order:4;-ms-flex-order:4;order:4}.medium-order-5{-webkit-order:5;-ms-flex-order:5;order:5}.medium-order-6{-webkit-order:6;-ms-flex-order:6;order:6}}@media screen and (min-width:64em){.large-order-1{-webkit-order:1;-ms-flex-order:1;order:1}.large-order-2{-webkit-order:2;-ms-flex-order:2;order:2}.large-order-3{-webkit-order:3;-ms-flex-order:3;order:3}.large-order-4{-webkit-order:4;-ms-flex-order:4;order:4}.large-order-5{-webkit-order:5;-ms-flex-order:5;order:5}.large-order-6{-webkit-order:6;-ms-flex-order:6;order:6}}.menu-icon{position:relative;display:inline-block;vertical-align:middle;cursor:pointer;width:20px;height:16px}.menu-icon:after{content:'';position:absolute;display:block;width:100%;height:2px;background:#fefefe;top:0;left:0;box-shadow:0 7px 0 #fefefe,0 14px 0 #fefefe}.menu-icon:hover:after{background:#cacaca;box-shadow:0 7px 0 #cacaca,0 14px 0 #cacaca}.menu-icon.dark{position:relative;display:inline-block;vertical-align:middle;cursor:pointer;width:20px;height:16px}.menu-icon.dark:after{content:'';position:absolute;display:block;width:100%;height:2px;background:#0a0a0a;top:0;left:0;box-shadow:0 7px 0 #0a0a0a,0 14px 0 #0a0a0a}.menu-icon.dark:hover:after{background:#8a8a8a;box-shadow:0 7px 0 #8a8a8a,0 14px 0 #8a8a8a}.slide-in-down.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateY(-100%);transform:translateY(-100%);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-in-down.mui-enter.mui-enter-active{-webkit-transform:translateY(0);transform:translateY(0)}.slide-in-left.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateX(-100%);transform:translateX(-100%);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-in-left.mui-enter.mui-enter-active{-webkit-transform:translateX(0);transform:translateX(0)}.slide-in-up.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateY(100%);transform:translateY(100%);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-in-up.mui-enter.mui-enter-active{-webkit-transform:translateY(0);transform:translateY(0)}.slide-in-right.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateX(100%);transform:translateX(100%);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-in-right.mui-enter.mui-enter-active{-webkit-transform:translateX(0);transform:translateX(0)}.slide-out-down.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateY(0);transform:translateY(0);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-out-down.mui-leave.mui-leave-active{-webkit-transform:translateY(100%);transform:translateY(100%)}.slide-out-right.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateX(0);transform:translateX(0);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-out-right.mui-leave.mui-leave-active{-webkit-transform:translateX(100%);transform:translateX(100%)}.slide-out-up.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateY(0);transform:translateY(0);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-out-up.mui-leave.mui-leave-active{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.slide-out-left.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:translateX(0);transform:translateX(0);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden}.slide-out-left.mui-leave.mui-leave-active{-webkit-transform:translateX(-100%);transform:translateX(-100%)}.fade-in.mui-enter{transition-duration:.5s;transition-timing-function:linear;opacity:0;transition-property:opacity}.fade-in.mui-enter.mui-enter-active{opacity:1}.fade-out.mui-leave{transition-duration:.5s;transition-timing-function:linear;opacity:1;transition-property:opacity}.fade-out.mui-leave.mui-leave-active{opacity:0}.hinge-in-from-top.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);-webkit-transform-origin:top;transform-origin:top;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:0}.hinge-in-from-top.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);opacity:1}.hinge-in-from-right.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);-webkit-transform-origin:right;transform-origin:right;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:0}.hinge-in-from-right.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);opacity:1}.hinge-in-from-bottom.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotateX(90deg);transform:perspective(2000px) rotateX(90deg);-webkit-transform-origin:bottom;transform-origin:bottom;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:0}.hinge-in-from-bottom.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);opacity:1}.hinge-in-from-left.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotateY(90deg);transform:perspective(2000px) rotateY(90deg);-webkit-transform-origin:left;transform-origin:left;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:0}.hinge-in-from-left.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);opacity:1}.hinge-in-from-middle-x.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);-webkit-transform-origin:center;transform-origin:center;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:0}.hinge-in-from-middle-x.mui-enter.mui-enter-active{-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);opacity:1}.hinge-in-from-middle-y.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);-webkit-transform-origin:center;transform-origin:center;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:0}.hinge-in-from-middle-y.mui-enter.mui-enter-active,.hinge-out-from-top.mui-leave{-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);opacity:1}.hinge-out-from-top.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform-origin:top;transform-origin:top;transition-property:-webkit-transform,opacity;transition-property:transform,opacity}.hinge-out-from-top.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);opacity:0}.hinge-out-from-right.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);-webkit-transform-origin:right;transform-origin:right;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:1}.hinge-out-from-right.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);opacity:0}.hinge-out-from-bottom.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);-webkit-transform-origin:bottom;transform-origin:bottom;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:1}.hinge-out-from-bottom.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateX(90deg);transform:perspective(2000px) rotateX(90deg);opacity:0}.hinge-out-from-left.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);-webkit-transform-origin:left;transform-origin:left;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:1}.hinge-out-from-left.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateY(90deg);transform:perspective(2000px) rotateY(90deg);opacity:0}.hinge-out-from-middle-x.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);-webkit-transform-origin:center;transform-origin:center;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:1}.hinge-out-from-middle-x.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateX(-90deg);transform:perspective(2000px) rotateX(-90deg);opacity:0}.hinge-out-from-middle-y.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:perspective(2000px) rotate(0deg);transform:perspective(2000px) rotate(0deg);-webkit-transform-origin:center;transform-origin:center;transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:1}.hinge-out-from-middle-y.mui-leave.mui-leave-active{-webkit-transform:perspective(2000px) rotateY(-90deg);transform:perspective(2000px) rotateY(-90deg);opacity:0}.scale-in-up.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:scale(.5);transform:scale(.5);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:0}.scale-in-up.mui-enter.mui-enter-active{-webkit-transform:scale(1);transform:scale(1);opacity:1}.scale-in-down.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:scale(1.5);transform:scale(1.5);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:0}.scale-in-down.mui-enter.mui-enter-active,.scale-out-up.mui-leave{-webkit-transform:scale(1);transform:scale(1);opacity:1}.scale-out-up.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:-webkit-transform,opacity;transition-property:transform,opacity}.scale-out-up.mui-leave.mui-leave-active{-webkit-transform:scale(1.5);transform:scale(1.5);opacity:0}.scale-out-down.mui-leave{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:scale(1);transform:scale(1);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:1}.scale-out-down.mui-leave.mui-leave-active{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}.spin-in.mui-enter{transition-duration:.5s;transition-timing-function:linear;-webkit-transform:rotate(-270deg);transform:rotate(-270deg);transition-property:-webkit-transform,opacity;transition-property:transform,opacity;opacity:0}.spin-in.mui-enter.mui-enter-active,.spin-out.mui-leave{-webkit-transform:rotate(0);transform:rotate(0);opacity:1}.spin-out.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:-webkit-transform,opacity;transition-property:transform,opacity}.spin-in-ccw.mui-enter,.spin-out.mui-leave.mui-leave-active{-webkit-transform:rotate(270deg);transform:rotate(270deg);opacity:0}.spin-in-ccw.mui-enter{transition-duration:.5s;transition-timing-function:linear;transition-property:-webkit-transform,opacity;transition-property:transform,opacity}.spin-in-ccw.mui-enter.mui-enter-active,.spin-out-ccw.mui-leave{-webkit-transform:rotate(0);transform:rotate(0);opacity:1}.spin-out-ccw.mui-leave{transition-duration:.5s;transition-timing-function:linear;transition-property:-webkit-transform,opacity;transition-property:transform,opacity}.spin-out-ccw.mui-leave.mui-leave-active{-webkit-transform:rotate(-270deg);transform:rotate(-270deg);opacity:0}.slow{transition-duration:.75s!important}.fast{transition-duration:.25s!important}.linear{transition-timing-function:linear!important}.ease{transition-timing-function:ease!important}.ease-in{transition-timing-function:ease-in!important}.ease-out{transition-timing-function:ease-out!important}.ease-in-out{transition-timing-function:ease-in-out!important}.bounce-in{transition-timing-function:cubic-bezier(.485,.155,.24,1.245)!important}.bounce-out{transition-timing-function:cubic-bezier(.485,.155,.515,.845)!important}.bounce-in-out{transition-timing-function:cubic-bezier(.76,-.245,.24,1.245)!important}.short-delay{transition-delay:.3s!important}.long-delay{transition-delay:.7s!important}.shake{-webkit-animation-name:a;animation-name:a}@-webkit-keyframes a{0%,10%,20%,30%,40%,50%,60%,70%,80%,90%{-webkit-transform:translateX(7%);transform:translateX(7%)}5%,15%,25%,35%,45%,55%,65%,75%,85%,95%{-webkit-transform:translateX(-7%);transform:translateX(-7%)}}@keyframes a{0%,10%,20%,30%,40%,50%,60%,70%,80%,90%{-webkit-transform:translateX(7%);transform:translateX(7%)}5%,15%,25%,35%,45%,55%,65%,75%,85%,95%{-webkit-transform:translateX(-7%);transform:translateX(-7%)}}.spin-cw{-webkit-animation-name:b;animation-name:b}@-webkit-keyframes b{0%{-webkit-transform:rotate(-1turn);transform:rotate(-1turn)}to{-webkit-transform:rotate(0);transform:rotate(0)}}@keyframes b{0%{-webkit-transform:rotate(-1turn);transform:rotate(-1turn)}to{-webkit-transform:rotate(0);transform:rotate(0)}}.spin-ccw{-webkit-animation-name:b;animation-name:b}@keyframes b{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.wiggle{-webkit-animation-name:c;animation-name:c}@-webkit-keyframes c{40%,50%,60%{-webkit-transform:rotate(7deg);transform:rotate(7deg)}35%,45%,55%,65%{-webkit-transform:rotate(-7deg);transform:rotate(-7deg)}0%,30%,70%,to{-webkit-transform:rotate(0);transform:rotate(0)}}@keyframes c{40%,50%,60%{-webkit-transform:rotate(7deg);transform:rotate(7deg)}35%,45%,55%,65%{-webkit-transform:rotate(-7deg);transform:rotate(-7deg)}0%,30%,70%,to{-webkit-transform:rotate(0);transform:rotate(0)}}.shake,.spin-ccw,.spin-cw,.wiggle{-webkit-animation-duration:.5s;animation-duration:.5s}.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.slow{-webkit-animation-duration:.75s!important;animation-duration:.75s!important}.fast{-webkit-animation-duration:.25s!important;animation-duration:.25s!important}.linear{-webkit-animation-timing-function:linear!important;animation-timing-function:linear!important}.ease{-webkit-animation-timing-function:ease!important;animation-timing-function:ease!important}.ease-in{-webkit-animation-timing-function:ease-in!important;animation-timing-function:ease-in!important}.ease-out{-webkit-animation-timing-function:ease-out!important;animation-timing-function:ease-out!important}.ease-in-out{-webkit-animation-timing-function:ease-in-out!important;animation-timing-function:ease-in-out!important}.bounce-in{-webkit-animation-timing-function:cubic-bezier(.485,.155,.24,1.245)!important;animation-timing-function:cubic-bezier(.485,.155,.24,1.245)!important}.bounce-out{-webkit-animation-timing-function:cubic-bezier(.485,.155,.515,.845)!important;animation-timing-function:cubic-bezier(.485,.155,.515,.845)!important}.bounce-in-out{-webkit-animation-timing-function:cubic-bezier(.76,-.245,.24,1.245)!important;animation-timing-function:cubic-bezier(.76,-.245,.24,1.245)!important}.short-delay{-webkit-animation-delay:.3s!important;animation-delay:.3s!important}.long-delay{-webkit-animation-delay:.7s!important;animation-delay:.7s!important} \ No newline at end of file diff --git a/webextension/css/popup.css b/webextension/css/popup.css new file mode 100644 index 0000000..045ca64 --- /dev/null +++ b/webextension/css/popup.css @@ -0,0 +1,42 @@ +body { + background: #FAFAFA; + min-width: 200px; + max-width: 400px; +} + +table { + margin-bottom: 0; +} + +.popup-bumper { + width: 100%; + padding: .5em; +} + +.header-column { + padding: 0; +} + +.header-icon { + max-width: 16px; + height: 16px; + margin: 4px; +} + +table.unstriped tbody tr { + border-bottom: 1px solid #f1f1f1; + background-color: #fefefe; +} + +.edit-identities { + background: #DCDBDC; +} + +.edit-containers-text { + text-align: center; + padding: .5em; +} + +.edit-containers-text a { + color: #0a0a0a; +} diff --git a/webextension/img/container-add.svg b/webextension/img/container-add.svg new file mode 100644 index 0000000..2c18378 --- /dev/null +++ b/webextension/img/container-add.svg @@ -0,0 +1,13 @@ + + + + +firefox + + + + diff --git a/webextension/img/container-delete.svg b/webextension/img/container-delete.svg new file mode 100644 index 0000000..1e685d5 --- /dev/null +++ b/webextension/img/container-delete.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/webextension/img/container-edit.svg b/webextension/img/container-edit.svg new file mode 100644 index 0000000..52c1df4 --- /dev/null +++ b/webextension/img/container-edit.svg @@ -0,0 +1,12 @@ + + + + + + + + + diff --git a/webextension/img/container-hide.svg b/webextension/img/container-hide.svg new file mode 100644 index 0000000..a684eaf --- /dev/null +++ b/webextension/img/container-hide.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + diff --git a/webextension/img/container-site-d-192.png b/webextension/img/container-site-d-192.png new file mode 100644 index 0000000000000000000000000000000000000000..a4b84ecd349471a0a64ff5a63a7b1c94e5b5de7b GIT binary patch literal 2329 zcmd6pSx}SN630*Skwiff6j?+u;>H*PM3F=yK`_L?unda}qTmM#K^Dn{Kp-KIxS?Xe z5gkEgkhr79eX6U^ss2}; z<9@zuLwyT<0Dz&VhkJmI%5Odgt6Ky5V{tm@aol{|0JxE3@FfhR+b`Se5#R%WU^M{Z z!vIX{LgGOHk|+SYhXJ7H0bs_x*y!)9OJKvj*zP*&>@!o5p~GCR$Ie6m3>JKI)MHip z7XapnJl);4raT)_#h=`rWYYS_*z>qL53ibSr2BgA+>^y;%PKr&3;H%2Ie+J|5^2pV zUYmCcHd;&(qkMj>n8JmcXSrAQEIho-`pk)pgWs*D2AHs3$&M_njix;fFF#V>_vu0B z>8r!_ih_*{{%ER;J)e{Q@nWxbxU*lO=>*FI_eENxt$O?Xr&xgw3_fnq?A>aD9YLhX;>vH(PFf%9z(xA;sr5VoE=uW5yl;?{m zbiW)~i9$+LfA1hf0f(I#MPdBxxC6vz;}Q6Bt>%)KkBKs-l)3&XpjgundtZ0OH3?+2V=>$UeZRdU1lxwJx3OQ6{6P^^|DNI6WUKdlk?u-W+fnc1t`XU!z{Ey< zzxduwxef2O0#6^zsV9F8v0!mFzKch4ZHmjncX92nfKQXg@DIFWSj8U9m9_j?vl?eQ zn;D0z@<&B?s^TF#R64Ps+$tH`1We`HT)I^SL9S&e8Ijb2yjdd=V?2cwqneYp3dV}( z^9OoAV@!&3ihu07Ldn++$|aK# zgBsn_l}UOO!foe_&n#WkXDDD$7Ft%gB|}Boc&p4EK&~|!_n$bva$Cb)6^)&F#qVtV zYl1tWd#D@=8*N5SZ6LYPwum1!3cEuC@cyblPI5{zhj?8-!u(lNu8Y8lxALn2IZ<;K zal6*jO!_1;A%7x9*K>v=X7yi;5>WA|=Ircn-&RVEX-cJ{T8i&x?m+EQ$Y&|zYxvc_ zN$yCPqV5h~V2Ak$9k1t$4z;wTKg~Lse!J6Hc~7ZP%?u6tv6(`l94`kO(oggI3}VsS zYuyzqc}q8bh2<2l_6+6Z;quxn=n0%+Un(-^LmBiAJz#hK3pHPE|1(I9zYFX zn_r9yTNQ{LL%C&Ia{_V5cs;%pQ^nH^ERo_IZgrb8B9c5O)S{RB)ki0t#&D@SQ60nU z)X536ix>;Ek`F2o%bs|@!%nXmT4KiF5`%GR9jZO%+Pm;O{=?yDH5Cr#J$Bg&ynu@lc^>&h;N9RpMLl3xXPMb{PDwkPa8n^ixM z69+=)GvK0)hIt`By%9vk4@V}iE8XF=fl3cy&Vvm4XKs*8W5(X3&P&-f0UO@Dugah% zhZNgilD2$*NclTy_t=W4SJlsK0Th|6UxN{a2HBGnG;Br4{SGRM!yccXH&vArw<~P&7Se(Dp<;A5fFIH&YW@Ars-de`ALf3-})fT^+A>3?Uu_? zHEyu)xtM(|rZM)GyT&tc_sSBcXRlgxU)b{xGXAqJ{$B9^mnUVQFb9ut6^*xN3kOja zu^A|5lY){vg^3!=kg6N21jn#_0iY$@7lF4q|Gc;~Gpa_4;b!noU@KoXsPw+r3QirJ z4nxI)!sEV=T@~W7B*ifW5sV&NS|O=Nh03*|>ej*ahP+C}*!3t`HJXV)jvYRu&HPx} zV1e>csj*`lQF5U&_Vh4_ECiZtkSQ^vUzhNf%t_Q(sh6njk-6HZRQRf5wvPQ_k3pJ~pv|Qo6Er-ULHzIh zw%_dUjjrnf)zDiMgdEqlK}v0Z6GuDJezT0+POJ--JydRnw@-A5UV<8|{Hbad`7E7F z<2nd8j;E^AV8Mi*V-iR)4;mU>oc$KM(Ce)xsT1G>6UP35_ml!PmOnd^LYpE6I$uv) T=RxuQ_Dk_(`MOtah7bM+h9lzN literal 0 HcmV?d00001 diff --git a/webextension/img/container-site-d-24.png b/webextension/img/container-site-d-24.png new file mode 100644 index 0000000000000000000000000000000000000000..cde43168db80d13f1e1713d3f56a14aed5fd8145 GIT binary patch literal 441 zcmeAS@N?(olHy`uVBq!ia0vp^5&5IS(7HeKm_$>D`v(ENm>nOO@*f(C zi2PwJe0WGgWtX6BtM|gb2c|I<42~jAk5dH9mA4pPzHB@p=ZoXzyI)tmDiyujxkT{7 zVmbM=YjfQ^su;`~7S5deV@|gZ-v)`7-1_&?lWmZu=@Y3b!>ZkiOGhf_{m*!?T zeISx`d)&Hjq72FpMX7iz~*h z>0hI+m4+at@Lh)>$qIH{_ozC11MediMH2OJR`7X6Lc#@2e1?=$Q+<^RLN#%Hm{ z)9<8w#rL@#uVgp8ZSYG8ztmOCF?Z*m=K4l^g$b^|o{2se*d+3T`FBhDZic+Qzb!X} c3mdbs#cSu;O!6)J@Ddb?p00i_>zopr0Ecp;^#A|> literal 0 HcmV?d00001 diff --git a/webextension/img/container-site-d-48.png b/webextension/img/container-site-d-48.png new file mode 100644 index 0000000000000000000000000000000000000000..ec33b617bf86759febb34450758a0dd2a1560847 GIT binary patch literal 677 zcmV;W0$TlvP)004R>004l5008;`004mK004C`008P>0026e000+ooVrmw00006 zVoOIv00000008+zyMF)x010qNS#tmY3labT3lag+-G2N400Id~L_t(&-tCw@PZUuU zhM!$0ia>%jI;|IIa04egm(7hX<(r1Z+0E z{sJt8dLttLEv3*6Yxf4n9Ah@ktO8JybQBl^hJh~EU|vRHlY9bF(dt<=O7WL@>Mu4AXV5mi*joi&xyXB$JjWTf3L-27)=?BFf z9{Thgiff^^CJGcy6eyY~P&84XXre&TM1i95DeyOxz_N$jH8a~tt*v_Kvs?z=cnF@% zSo6_mA_1NP6{@#!lvI6-E$sR$z z3=CCj3=9n|3=F@3LJcn%7)lKo7+xhXFj&oCU=S~uvn$XBD8ZKG?d}4kf#9d}?s_1_ zS>O>_%)r1c1j3A$?$-SQ+92cU;uunK>+N0NjF?b~V;}#|(K5YyD@ZfXOTb=WjhMJ@ zSA;p&rK7ur*0?$ftdi~)b1b+VEz~d<=&*U+dnQqxp z_r_$i^;N}J(;D1oeqWw(;%x}~ifE?1(DoA>B4rokaqftbRXWUN9DVbDzogvC-=q!O>uI?}1lx@9PSW7D}I8Gv9n|UFmoE=f9e_vr|TVed@XQ2N)l$d>2{c%9yr|?}x+=$GHW9_JMmuJ{C_sn6^#Kf+Hu0 zJ^qMFLHlm`cQbAlJ@8IwwhHZ3KG6Fv?pIyI%vz>9>-b`lm?Gvkv`hSJ<}WZk`Yp@b zXtOTQ|AXui>^74ca$l)PzFTXMw%RJCZMX1IwY7^MMH%njkaA|~s|k|pJb9kSE$sF@ z&^5_$^;JbA7%2fMQIN$n6D#nORd8qWTj88y!97P$(s(7`%!lV$zU*bMYv$Ye z+vlc4>4`aCRUU|zcJZtallaV5;3m6e(ez2X>pAu;_X|4c_~7g&$Gh2`h&DPx3BC?WPU1snD>^+ z(S5nUtN*SMGv3Wr!LUOzLN)Gu<^$;my5;|q-p&5c@LKxXBfcHBiJ(Hn)78&qol`;+ E081(p_y7O^ literal 0 HcmV?d00001 diff --git a/webextension/img/container-site-w-192.png b/webextension/img/container-site-w-192.png new file mode 100644 index 0000000000000000000000000000000000000000..8eadbd6e080e212a5aeb4d60a0e2771152e5adde GIT binary patch literal 2281 zcmds(c~n#962NZ~5@ZWRT0kHmc`QXy;=&>Uff5XnML~~5gpweF2uLW(7NPfwl~^Te zR6qg6*EF~wMgu_v%B}D~g%AM^g!LAxEJ*~4Pe553-{1YO|Ghb9=6AlC?|f&@%s1!E zxxFDY16^}n000c=0n{)J;V-%dr?Fv!N!l7{#rp>P0>Gn-dP^*<=DhxJKv*yUWZMG( zcm@DIX)pvhpzk2A0J3}XlZL{M_O88G9mDl`q?B!b{j_~aTj==?6pPzZ-L(|$7 z8oU3#z{kKp&LZNj@74WbQk;2QY;#bMIN+B_+q5+gwy zqVI!m`026Q=0dJJaY1Kh2~}9<+ubIPpRARksVyYLp2<1Ah#9Q2F#PqlrzD5Fh+z5bZ=b# z3KpE6b-xY!d%d(3sJkbjF1+y8)IRP#@x2_g?M=reET_Sb>i*eJd_- zox;YWcMS~wI?qP!QUghO_>Y$I-v16h@jNQuHGY4ygi z4x{M?QIPlk@@x5|R&s#-2(D4rtR3HDa|pT^moLI30=5OH>DF-Dg!Z?5`H}pip(W0L zWW*cxq{w(=dLlSKx>lbA?%6%n-*okGb*=ZHu>d`Ho;-^jpDrO z2N?&Z>LVCa-WU2Phh>Z3oDp!KaCG!D&X$V9mJDn|ME5-v*{@o^Z#%4RgA8|@-zDbt zkGTD7G?S^r-Z>M7P!X)+_7$(@mbWK!wLO8sVL6t(D=LNaWNoGedvJS-1jEpCD*CYZ zqki1q3i0;j3X^JyYA|xQr<{2F0B*7^=(ro3-Bj`;`~tQ_o~we+Nyw?xu@qt2j1jH zH2M{Sv*#^6!f?zMxPoX)9_2i@XiMtzsVqgF%;+K}e4dvz(w?SkL?}Yl?)@yAxZQ`1 zv`bhdPur4)@ux8Et{i0DQI{Dj`hY`|C|vWPG5nM2>b5~Cf2Ze#A2}AQ8Q?*MUnesW zJZ~S}takLFM(Pi~@NFPV9HTZ*7P^|M8m&IBWAFdSCeHZNtxpfPS`p^1ySM+=rFh{H zW9h!H`{!gQIj3km6me1HoqV3fe}Bu<`BnUE>xl3m9K5M2!*O_FK!Wxmq^=cNMLQ>% zbryb@DL+qbi9o7VERPA**>lFxS!33`KwQ*%Qb?=Cs>tbhvAeRwpzYr#^31~@HRBV~ z++y{e1rJM@Z9w&AW_@w(#&ooYbg{%>9i}RDIkK|(#EHC&d-^5b-Y(CUMtgUsp(?kV z!vBXz1XqvbPdus6ZdjJ6P##I)n4}I(Ayx~kkH9YSc*8E1(gGP*IC@kTw0*p+vhh$| z#yz1>{PSyO`>L=je6IjnPAy6f?1^=lEU$o444!fYL+}Gd^NCk+2&X_mgk2N~9uvFh zdupoXrr;wL0$CLn2FexLGs z=DStpAEqDsjh!ZCuo8NRsu%Zkl1H?^bC`U@8iE9uK5Rk4kQ4<*w!R)30DJ6`Csxl2 zpZZf9OcwOnHe?FtG@-^K6JR(dNPlk_{X?i#-!f1C1>AiI4FCWD literal 0 HcmV?d00001 diff --git a/webextension/img/container-site-w-24.png b/webextension/img/container-site-w-24.png new file mode 100644 index 0000000000000000000000000000000000000000..359ece62f1aaf9f0afa2d1ba2bf85a06e3014da8 GIT binary patch literal 406 zcmeAS@N?(olHy`uVBq!ia0vp^5|#;$n>m#;@zn?aVmtc3_H( z+2l%ZrskwS!A(*J0#|>&d+Xim>Ae55SEO~jyR5i<;B!rd zzNg=W*ty?)FD{T^Of}jb6`n9nK(ldm-;dzj`)&UwsvgqteXibr$6d sC79I@DBj&1%V^&FTeIN8;Yfz``|0`L_taXPnF0zTPgg&ebxsLQ0Mvz<-2eap literal 0 HcmV?d00001 diff --git a/webextension/img/container-site-w-48.png b/webextension/img/container-site-w-48.png new file mode 100644 index 0000000000000000000000000000000000000000..aae482e86331fdcbdb1efdd658d16fbcb3d051a5 GIT binary patch literal 633 zcmV-<0*3vGP)004R>004l5008;`004mK004C`008P>0026e000+ooVrmw00006 zVoOIv00000008+zyMF)x010qNS#tmY3labT3lag+-G2N400G@eL_t(&-tCt^YZOrw zN6+1a)xJ-%iKhh1)64G2y7+D-R-@F>kwE=ko&BT z;Q>(F>K%2ng1^o!bwzEDF~?bT_qVLq@C>irDBKCTLZS|h|wSq&u zt3Fm|3I?B3U#LGS=+jY`)hX1w6$JLPTp;i$L7!WpZUToZ-YK1knC%nj00%4X^QM(x zcz_xIzD`#?Jiz?ExC>1*S)ggMK+|M_rpW?LlLeY43p7nifuD5=Y$V9tj)!lvI6-E$sR$z z3=CCj3=9n|3=F@3LJcn%7)lKo7+xhXFj&oCU=S~uvn$XBD8ZKG?d}4kf#9d}?s_1_ zS>O>_%)r1c1j3A$?$-TbU|@dl>EaktaqI0}{|uQ_nPVT{=dW3|@>+}2MduF>D)^`b0o)8xucuirE8Ou2v7=Kb#!kFvCMvmGrEHino-sJZbY>I7W}O2%+yGWl+2R z<4bmS-)+Ur36sOpl^-piu*5GsyHU!4~TT=Ff}2 znJ3J)c5r^YIPAcMlTZ_Lu5ei}$CR{ZJor9QOF`*e@V??l`Q_83&N2UXdsXTnt>Vj2 ze^p|aw$eU{l4|9x>^zIn9RzdR8is$RK#xfNI4--$m-WM1YZqpFmm`y`U1oDVSOMf5 zp0afslLgb90``>;RX#+q-(Fc=vSaGv6R!Ew>qLI6YCgI4YWab89W&zJ^ST~keGqeW zgX^iu_HQR{@w{Z`Ip2F$Vf@s!pH}_VSGCoCIqPfOkI?Lo3zh_Ht?!6`yJpGW*k_)a zOQ!^RtxTQ1*SB}c>W0^6Z>HV0dZ+wSEn#=1op?k1?{l7)b}V6@v~T*BCv~D~nUR+= zJ@vhJ}Vzu*dWDh8?k&u8Jn-m9^(Q*v6FcN4_nP zF=wTO@k_p&2O{=qA3}|JSU{66Dt(k`+Fiz38V!-<9cd^?yhp&o88I3>+rP? zi7quv4ND9?-S14F7=O^vv(!GNIMt6`MR!N@_rj1%7Hf8ew=9`^Anw%bw$*xV(fOaJ z%;*03FUo$k>m}U-mk-n)XsNU-KA`zvZ^w_Sr?dYvE=;fAytss|7E~^Hy85}Sb4q9e E0L;Y>5dZ)H literal 0 HcmV?d00001 diff --git a/webextension/img/container-sort.svg b/webextension/img/container-sort.svg new file mode 100644 index 0000000..3d14a48 --- /dev/null +++ b/webextension/img/container-sort.svg @@ -0,0 +1,17 @@ + + + + + + + + + diff --git a/webextension/img/container-unhide.svg b/webextension/img/container-unhide.svg new file mode 100644 index 0000000..d12b9a3 --- /dev/null +++ b/webextension/img/container-unhide.svg @@ -0,0 +1,12 @@ + + + + + + + diff --git a/webextension/img/icon-50x50.png b/webextension/img/icon-50x50.png deleted file mode 100644 index f357d62c858e13ef75c1c65cc5fb89aaa3e84ab5..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1296 zcmV+r1@HQaP)(^xB>_oNB=7(L1hq*-K~!i3?U~0;Bry<%Ysfh#fyg2wkaz+l z&b$LBUXMrMj6g_mA?GA=&T09)*y?TEJw46zE<2i%MxE@c`dzN%i9J6*ze@^GMhak1 z5VD*=-rs*4M_--ag51YqF*QtIgUmq|zqhwH$;ikM<|Z;<%lHEbFJE3>FH^inVFG?hX?n# zz|R2b>FJUB`g*CVsuHZ^M@L6TGCMmf>+9?C^ze9vh;jDC#YNfN-24^@6u!K? z6nL>!f-K16jZJx5IC2Y{>llyz&jQdPhgcmlcN(AX`4R7WJ5oA_aoL zf`S5RY;2T@iVCYm0JglmEVs9}Qdn51%9Ej?p)a}u2CHH*8$}L;LNY%;U;S(fIICT@ z4$n0;HMXI??@}fqrh)j{`5$~V7NH69%9@Glg=4}mUM~V)q7mbmgFl7o4&h^*9S5td ztP~O#VKNM%42wa8Dl04Vj4)2#M5@}_TGfk??1)TZ$N(7_7*L4`5Qm3{D&D(eemnt$ z#)gIlA$+2oSEzLIp&J|-8IgsB1=Z#@H#a*!2fmMeD6Se2>Y$5@3!x0qnKm$&&w*?c zLM_(d7i60tm%|R~t>WThH9yFfbn9j;!eq=$8BKBuLjWNGq7e5GR>jJCft+Q#TLueg zBY08fkomDPTi8to2<0?AJBI-HNf^Qc_*q+9o3ysJD&g>@JXu;=lB=t$xP_xlE`0Hw zzP>)Sb!~oRfUK^r%H-svI?=E(3;K?gqa+z0A6FTgT54iqLRGY3gNT;Bv$G?^!^1K- zIH+Hls{z8GlamwkA?ytY82B3f2mV4swYRrt?L`umfsS6g#Q?!Cy!L1!0<}-jTL224 zVNWjIa?#Q2h{+^GoG{UF>lWmEh8K;LpL09M2f6pt(Etg;=qHa!1NmvzNn0dsk%(3x zy|p4**wAd#774v{5lu`zi`bf#?=BuZlgZbQm$3*PVvyD}2si}7OY`(oAP7G_2A*Cz z8X)|gOe^_aLU}qkPGx9$IRfS2*-L>$&_@S68cMC=mgAEWI^HLA1K? z;b@3ckS!=c==#s|!N_;q(LxAed(q zr?H~DquKfn5L##sNNij64 diff --git a/webextension/js/popup.js b/webextension/js/popup.js index 013dca1..5f4c867 100644 --- a/webextension/js/popup.js +++ b/webextension/js/popup.js @@ -4,8 +4,14 @@ browser.runtime.sendMessage('get-identities').then(reply=> { if (reply) { reply.content.identities.forEach(identity=> { const identityName = identity.l10nID.match(/userContext(\w*)\.label/)[IDENTITY_L10NID_MATCH_INDEX]; + const identityRow = ` + + i + ${identityName} + > + `; - document.querySelector('.identities-list').innerHTML += `
  • ${identityName}
    • `; + document.querySelector('.identities-list').innerHTML += identityRow; }); console.log('response from sdk addon: ', reply.content); } diff --git a/webextension/manifest.json b/webextension/manifest.json index 3eaede1..57ac5ff 100644 --- a/webextension/manifest.json +++ b/webextension/manifest.json @@ -5,8 +5,8 @@ "description": "Containers works by isolating cookie jars using separate origin-attributes defined visually by colored ‘Container Tabs’. This add-on is a modified version of the containers feature for Firefox Test Pilot.", "icons": { - "48": "img/blok-48.png", - "96": "img/blok-96.png" + "48": "img/container-site-d-48.png", + "96": "img/container-site-d-96.png" }, "applications": { @@ -25,8 +25,8 @@ "browser_action": { "browser_style": true, "default_icon": { - "16": "img/icon-50x50.png", - "32": "img/icon-50x50.png" + "16": "img/container-site-d-24.png", + "32": "img/container-site-d-48.png" }, "default_title": "Containers", "default_popup": "popup.html" diff --git a/webextension/popup.html b/webextension/popup.html index 4ffe15b..ab0dc93 100644 --- a/webextension/popup.html +++ b/webextension/popup.html @@ -2,12 +2,29 @@ Containers browserAction Popup + + -

    Containers!

    -
      -
    -

    Edit Containers

    +
    +
    + Containers icon +
    +
    +

    Containers

    +
    +
    + Sort Containers +
    +
    + + +
    +
    +
    + Edit Containers +
    +
    From e9988d2167a7b9306f0148a4df953a7861cf983c Mon Sep 17 00:00:00 2001 From: groovecoder Date: Tue, 20 Dec 2016 11:38:01 -0600 Subject: [PATCH 2/7] for #5: Edit Containers link to about:preferences --- index.js | 17 ++++++++++++----- webextension/js/popup.js | 6 ++++++ webextension/popup.html | 2 +- 3 files changed, 19 insertions(+), 6 deletions(-) diff --git a/index.js b/index.js index 7d96902..a2a83dc 100644 --- a/index.js +++ b/index.js @@ -1,12 +1,19 @@ -const webExtension = require('sdk/webextension'); const {ContextualIdentityService} = require('resource://gre/modules/ContextualIdentityService.jsm'); +const tabs = require('sdk/tabs'); +const webExtension = require('sdk/webextension'); function handleWebExtensionMessage(message, sender, sendReply) { console.log(message); - if (message === 'get-identities') { - sendReply({ - content: {identities: ContextualIdentityService.getIdentities()} - }); + switch (message) { + case 'get-identities': + sendReply({ + content: {identities: ContextualIdentityService.getIdentities()} + }); + break; + case 'open-containers-preferences': + tabs.open('about:preferences#containers'); + sendReply({content: 'opened'}); + break; } } diff --git a/webextension/js/popup.js b/webextension/js/popup.js index 5f4c867..d99234b 100644 --- a/webextension/js/popup.js +++ b/webextension/js/popup.js @@ -16,3 +16,9 @@ browser.runtime.sendMessage('get-identities').then(reply=> { console.log('response from sdk addon: ', reply.content); } }); + +document.querySelector('#edit-containers-link').addEventListener('click', ()=> { + browser.runtime.sendMessage('open-containers-preferences').then(()=> { + window.close(); + }); +}); diff --git a/webextension/popup.html b/webextension/popup.html index ab0dc93..879795b 100644 --- a/webextension/popup.html +++ b/webextension/popup.html @@ -22,7 +22,7 @@
    - Edit Containers + Edit Containers
    From 364d911f724fad56d6a14f506980c3d707d8bcbc Mon Sep 17 00:00:00 2001 From: groovecoder Date: Tue, 20 Dec 2016 12:12:37 -0600 Subject: [PATCH 3/7] for #5: add usercontext.svg for container icons --- webextension/img/usercontext.svg | 20 ++++++++++++++++++++ webextension/js/popup.js | 2 +- 2 files changed, 21 insertions(+), 1 deletion(-) create mode 100644 webextension/img/usercontext.svg diff --git a/webextension/img/usercontext.svg b/webextension/img/usercontext.svg new file mode 100644 index 0000000..8bc353b --- /dev/null +++ b/webextension/img/usercontext.svg @@ -0,0 +1,20 @@ + + + + + + + + + + \ No newline at end of file diff --git a/webextension/js/popup.js b/webextension/js/popup.js index d99234b..0e60c6e 100644 --- a/webextension/js/popup.js +++ b/webextension/js/popup.js @@ -6,7 +6,7 @@ browser.runtime.sendMessage('get-identities').then(reply=> { const identityName = identity.l10nID.match(/userContext(\w*)\.label/)[IDENTITY_L10NID_MATCH_INDEX]; const identityRow = ` - i + ${identityName} > `; From 53363865cb722e124f40da9f1d01a499f9fd4732 Mon Sep 17 00:00:00 2001 From: groovecoder Date: Tue, 20 Dec 2016 14:43:53 -0600 Subject: [PATCH 4/7] for #5: fill & color container icons --- webextension/css/popup.css | 31 +++++++++++++++++++++++++++++++ webextension/img/filters.svg | 9 +++++++++ webextension/js/popup.js | 2 +- 3 files changed, 41 insertions(+), 1 deletion(-) create mode 100644 webextension/img/filters.svg diff --git a/webextension/css/popup.css b/webextension/css/popup.css index 045ca64..5430043 100644 --- a/webextension/css/popup.css +++ b/webextension/css/popup.css @@ -28,6 +28,37 @@ table.unstriped tbody tr { background-color: #fefefe; } +[data-identity-icon="fingerprint"] { + --identity-icon: url('/img/usercontext.svg#fingerprint'); + --identity-icon-color: #00a7e0; +} + +[data-identity-icon="briefcase"] { + --identity-icon: url('/img/usercontext.svg#briefcase'); + --identity-icon-color: #ff9216; +} + +[data-identity-icon="dollar"] { + --identity-icon: url('/img/usercontext.svg#dollar'); + --identity-icon-color: #7dc14c; +} + +[data-identity-icon="cart"] { + --identity-icon: url('/img/usercontext.svg#cart'); + --identity-icon-color: #ee5195; +} + +.userContext-icon { + background-image: var(--identity-icon); + background-position: center center; + background-repeat: no-repeat; + background-size: contain; + filter: url('/img/filters.svg#fill'); + fill: var(--identity-icon-color); + width: 32px; + height: 32px; +} + .edit-identities { background: #DCDBDC; } diff --git a/webextension/img/filters.svg b/webextension/img/filters.svg new file mode 100644 index 0000000..1f377b9 --- /dev/null +++ b/webextension/img/filters.svg @@ -0,0 +1,9 @@ + + + + + + + \ No newline at end of file diff --git a/webextension/js/popup.js b/webextension/js/popup.js index 0e60c6e..316c5c9 100644 --- a/webextension/js/popup.js +++ b/webextension/js/popup.js @@ -6,7 +6,7 @@ browser.runtime.sendMessage('get-identities').then(reply=> { const identityName = identity.l10nID.match(/userContext(\w*)\.label/)[IDENTITY_L10NID_MATCH_INDEX]; const identityRow = ` - +
    ${identityName} > `; From 532f673ad3b9c8b67fb45439a6c10e0b9ac95e32 Mon Sep 17 00:00:00 2001 From: groovecoder Date: Wed, 21 Dec 2016 07:25:01 -0600 Subject: [PATCH 5/7] for #5: handle custom containers --- webextension/js/popup.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/webextension/js/popup.js b/webextension/js/popup.js index 316c5c9..6d265fa 100644 --- a/webextension/js/popup.js +++ b/webextension/js/popup.js @@ -2,18 +2,24 @@ const IDENTITY_L10NID_MATCH_INDEX = 1; browser.runtime.sendMessage('get-identities').then(reply=> { if (reply) { + console.log('reply from sdk addon: ', reply); reply.content.identities.forEach(identity=> { - const identityName = identity.l10nID.match(/userContext(\w*)\.label/)[IDENTITY_L10NID_MATCH_INDEX]; + let identityName = identity.name; + + console.log('identityName: ', identityName); + + if (typeof identityName === 'undefined') { + identityName = identity.l10nID.match(/userContext(\w*)\.label/)[IDENTITY_L10NID_MATCH_INDEX]; + } const identityRow = ` -
    +
    ${identityName} > `; document.querySelector('.identities-list').innerHTML += identityRow; }); - console.log('response from sdk addon: ', reply.content); } }); From 080b00e031f0eee11441c688bd71532cf703ddb9 Mon Sep 17 00:00:00 2001 From: groovecoder Date: Wed, 21 Dec 2016 11:44:12 -0600 Subject: [PATCH 6/7] for #5: define styles in popup for containers --- webextension/css/popup.css | 20 -------------------- webextension/js/popup.js | 24 +++++++++++++++++++++--- 2 files changed, 21 insertions(+), 23 deletions(-) diff --git a/webextension/css/popup.css b/webextension/css/popup.css index 5430043..e17c620 100644 --- a/webextension/css/popup.css +++ b/webextension/css/popup.css @@ -28,26 +28,6 @@ table.unstriped tbody tr { background-color: #fefefe; } -[data-identity-icon="fingerprint"] { - --identity-icon: url('/img/usercontext.svg#fingerprint'); - --identity-icon-color: #00a7e0; -} - -[data-identity-icon="briefcase"] { - --identity-icon: url('/img/usercontext.svg#briefcase'); - --identity-icon-color: #ff9216; -} - -[data-identity-icon="dollar"] { - --identity-icon: url('/img/usercontext.svg#dollar'); - --identity-icon-color: #7dc14c; -} - -[data-identity-icon="cart"] { - --identity-icon: url('/img/usercontext.svg#cart'); - --identity-icon-color: #ee5195; -} - .userContext-icon { background-image: var(--identity-icon); background-position: center center; diff --git a/webextension/js/popup.js b/webextension/js/popup.js index 4a6128b..0f5e236 100644 --- a/webextension/js/popup.js +++ b/webextension/js/popup.js @@ -1,15 +1,33 @@ browser.contextualIdentities.query({}).then(identites=> { + let customContainerStyles = ''; + const identitiesListElement = document.querySelector('.identities-list'); + identites.forEach(identity=> { - console.log('identity: ', identity); const identityRow = ` -
    +
    ${identity.name} > `; - document.querySelector('.identities-list').innerHTML += identityRow; + const customContainerStyle = ` + [data-identity-name="${identity.name}"] { + --identity-icon: url('/img/usercontext.svg#${identity.icon}'); + --identity-icon-color: ${identity.color}; + }`; + + customContainerStyles += customContainerStyle; + identitiesListElement.innerHTML += identityRow; }); + + const customContainerStyleElement = document.createElement('style'); + + customContainerStyleElement.type = 'text/css'; + customContainerStyleElement.appendChild(document.createTextNode(customContainerStyles)); + + const head = document.head; + + head.appendChild(customContainerStyleElement); }); document.querySelector('#edit-containers-link').addEventListener('click', ()=> { From 4765a5f73a6aa0eab9a46348b24cde2693b93989 Mon Sep 17 00:00:00 2001 From: Jonathan Kingston Date: Wed, 21 Dec 2016 21:42:25 +0000 Subject: [PATCH 7/7] Adding in hardcoded colours to match native test pilot --- webextension/css/popup.css | 60 ++++++++++++++++++++++++++++++++++++++ webextension/js/popup.js | 21 +++---------- 2 files changed, 64 insertions(+), 17 deletions(-) diff --git a/webextension/css/popup.css b/webextension/css/popup.css index e17c620..36aa297 100644 --- a/webextension/css/popup.css +++ b/webextension/css/popup.css @@ -51,3 +51,63 @@ table.unstriped tbody tr { .edit-containers-text a { color: #0a0a0a; } + +[data-identity-color="blue"] { + --identity-tab-color: #0996f8; + --identity-icon-color: #00a7e0; +} + +[data-identity-color="turquoise"] { + --identity-tab-color: #01bdad; + --identity-icon-color: #01bdad; +} + +[data-identity-color="green"] { + --identity-tab-color: #57bd35; + --identity-icon-color: #7dc14c; +} + +[data-identity-color="yellow"] { + --identity-tab-color: #ffcb00; + --identity-icon-color: #ffcb00; +} + +[data-identity-color="orange"] { + --identity-tab-color: #ff9216; + --identity-icon-color: #ff9216; +} + +[data-identity-color="red"] { + --identity-tab-color: #d92215; + --identity-icon-color: #d92215; +} + +[data-identity-color="pink"] { + --identity-tab-color: #ea385e; + --identity-icon-color: #ee5195; +} + +[data-identity-color="purple"] { + --identity-tab-color: #7a2f7a; + --identity-icon-color: #7a2f7a; +} + +[data-identity-icon="fingerprint"] { + --identity-icon: url("chrome://browser/content/usercontext.svg#fingerprint"); +} + +[data-identity-icon="briefcase"] { + --identity-icon: url("chrome://browser/content/usercontext.svg#briefcase"); +} + +[data-identity-icon="dollar"] { + --identity-icon: url("chrome://browser/content/usercontext.svg#dollar"); +} + +[data-identity-icon="cart"] { + --identity-icon: url("chrome://browser/content/usercontext.svg#cart"); +} + +[data-identity-icon="circle"] { + --identity-icon: url("chrome://browser/content/usercontext.svg#circle"); +} diff --git a/webextension/js/popup.js b/webextension/js/popup.js index 0f5e236..8207932 100644 --- a/webextension/js/popup.js +++ b/webextension/js/popup.js @@ -5,29 +5,16 @@ browser.contextualIdentities.query({}).then(identites=> { identites.forEach(identity=> { const identityRow = ` -
    +
    ${identity.name} > `; - const customContainerStyle = ` - [data-identity-name="${identity.name}"] { - --identity-icon: url('/img/usercontext.svg#${identity.icon}'); - --identity-icon-color: ${identity.color}; - }`; - - customContainerStyles += customContainerStyle; identitiesListElement.innerHTML += identityRow; }); - - const customContainerStyleElement = document.createElement('style'); - - customContainerStyleElement.type = 'text/css'; - customContainerStyleElement.appendChild(document.createTextNode(customContainerStyles)); - - const head = document.head; - - head.appendChild(customContainerStyleElement); }); document.querySelector('#edit-containers-link').addEventListener('click', ()=> {