<html> <head> <style> body { width: 200px; } #no-styles { font-style: italic; } .checker { display: inline; } .style-name { cursor: default; display: inline; font-weight: bold; } .actions { font-size: x-small; } a, a:visited { color: black; } .entry { padding: 0.5em 0; border-bottom: 1px solid black; } .entry:first-child { padding-top: 0; } .entry:last-child { border-bottom: none; } body > DIV { border-bottom: 1px solid black; } body > DIV:last-of-type, body.blocked > DIV { border-bottom: none; } #installed { margin-top: 0.5em; } body > .actions { margin-top: 0.5em; } .actions > div, #unavailable { margin-bottom: 0.75em; } #unavailable { border: none; } #unavailable:empty { display: none; } body.blocked #installed, body.blocked #find-styles, body.blocked #write-style { display: none; } /* Never shown, but can be enabled with a style */ .enable, .disable { display: none; } /* 'New style' links */ #write-style-for {margin-right: .6ex} .write-style-link {margin-left: .6ex} .write-style-link::before, .write-style-link::after {font-size: x-small} .write-style-link::before {content: "\00ad"} /* "soft" hyphen */ #match {overflow-wrap: break-word;} /* "breadcrumbs" 'new style' links */ .breadcrumbs > .write-style-link {margin-left: 0} .breadcrumbs:hover a {color: #bbb; text-decoration: none} /* use just the subdomain name instead of the full domain name */ .breadcrumbs > .write-style-link[subdomain]:not(:nth-last-child(2)) {font-size: 0} .breadcrumbs > .write-style-link[subdomain]:not(:nth-last-child(2))::before { content: attr(subdomain); } /* "dot" after each subdomain name */ .breadcrumbs > .write-style-link[subdomain]::after {content: "."} /* no "dot" after top-level domain */ .breadcrumbs > .write-style-link:nth-last-child(2)::after {content: none} /* "forward slash" before path ("this URL") */ .breadcrumbs > .write-style-link:last-child::before {content: "\200b/"} .breadcrumbs > .write-style-link:last-child:first-child::before, .breadcrumbs > .write-style-link[subdomain=""] + .write-style-link::before {content: none} /* suppress TLD-only link */ .breadcrumbs > .write-style-link[subdomain=""] {display: none} /* :hover style */ .breadcrumbs.url\(\) > .write-style-link, /* :hover or :focus on "this URL" sets class="url()" */ .breadcrumbs > .write-style-link:hover, .breadcrumbs > .write-style-link:focus, .breadcrumbs > .write-style-link:hover ~ .write-style-link[subdomain], .breadcrumbs > .write-style-link:focus ~ .write-style-link[subdomain] { color: inherit; text-decoration: underline; } </style> <script src="localization.js"></script> <script src="health.js"></script> <script src="storage.js"></script> <script src="messaging.js"></script> <script src="apply.js"></script> </head> <body id="stylish-popup"> <div id="unavailable"></div> <div id="installed"></div> <div class="actions"> <div id="find-styles"><a id="find-styles-link" href="#"></a></div> <div id="manage-styles"><a id="open-manage-link" href="manage.html"></a></div> <div id="write-style"><span id="write-style-for"></span></div> </div> <script src="popup.js"></script> </body> </html>