156 lines
		
	
	
		
			3.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			156 lines
		
	
	
		
			3.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <html>
 | |
| 	<head>
 | |
| 		<title></title>
 | |
| 		<style>
 | |
| 			body {
 | |
| 				margin: 0;
 | |
| 				font: 12px arial,sans-serif;
 | |
| 			}
 | |
| 			a, a:visited {
 | |
| 				color: #555;
 | |
| 				-webkit-transition: color 0.5s;
 | |
| 			}
 | |
| 			a:hover {
 | |
| 				color: #999;
 | |
| 			}
 | |
| 			#header {
 | |
| 				height: 100%;
 | |
| 				width: 250px;
 | |
| 				position: fixed;
 | |
| 				top: 0;
 | |
| 				padding: 15px;
 | |
| 				border-right: 1px dashed #AAA;
 | |
| 				-webkit-box-shadow: 0 0 50px -18px black;
 | |
| 			}
 | |
| 			#header h1 {
 | |
| 				margin-top: 0;
 | |
| 			}
 | |
| 			#installed {
 | |
| 				position: relative;
 | |
| 				margin-left: 280px;
 | |
| 			}
 | |
| 			[style-id] {
 | |
| 				margin: 10px;
 | |
| 				padding: 0 15px;
 | |
| 			}
 | |
| 			[style-id] {
 | |
| 				border-top: 2px solid gray;
 | |
| 			}
 | |
| 			#installed::after {
 | |
| 				content: "";
 | |
| 				position: absolute;
 | |
| 				top: 0;
 | |
| 				width: 100%; height: 2px;
 | |
| 				background-color: #fff;
 | |
| 			}
 | |
| 			.applies-to, .actions {
 | |
| 				padding-left: 15px;
 | |
| 			}
 | |
| 			.actions > * {
 | |
| 				margin-right: 5px;
 | |
| 			}
 | |
| 			.applies-to-extra {
 | |
| 				font-weight: bold;
 | |
| 			}
 | |
| 			.disabled h2::after {
 | |
| 				content: " (Disabled)";
 | |
| 			}
 | |
| 			.disabled {
 | |
| 				opacity: 0.5;
 | |
| 			}
 | |
| 			.disabled .disable {
 | |
| 				display: none;
 | |
| 			}
 | |
| 			.enabled .enable {
 | |
| 				display: none;
 | |
| 			}
 | |
| 
 | |
| 			/* Default, no update buttons */
 | |
| 			.update, .check-update {
 | |
| 				display: none;
 | |
| 			}
 | |
| 			/* Check update button for things that can*/
 | |
| 			*[style-update-url] .check-update {
 | |
| 				display: inline;
 | |
| 			}
 | |
| 			/* Update check in progress */
 | |
| 			.checking-update .check-update {
 | |
| 				display: none;
 | |
| 			}
 | |
| 			/* Updates available */
 | |
| 			.can-update .update {
 | |
| 				display: inline;
 | |
| 			}
 | |
| 			.can-update .check-update {
 | |
| 				display: none;
 | |
| 			}
 | |
| 			/* Updates not available */
 | |
| 			.no-update .check-update {
 | |
| 				display: none;
 | |
| 			}
 | |
| 			/* Updates done */
 | |
| 			.update-done .check-update {
 | |
| 				display: none;
 | |
| 			}
 | |
| 			.hidden {display: none}
 | |
| 
 | |
| 			@media(max-width:675px) {
 | |
| 				#header {
 | |
| 					height: auto;
 | |
| 					position: inherit;
 | |
| 					width: auto;
 | |
| 					border-right: none;
 | |
| 				}
 | |
| 
 | |
| 				#installed {
 | |
| 					margin-left: 0;
 | |
| 				}
 | |
| 
 | |
| 				[style-id] {
 | |
| 					margin: 0;
 | |
| 				}
 | |
| 			}
 | |
| 
 | |
| 			fieldset {
 | |
| 				border-width:  1px;
 | |
| 				border-radius: 6px;
 | |
| 				margin: 1em 0;
 | |
| 			}
 | |
| 			.enabled-only > .disabled, .edited-only > [style-update-url] {
 | |
| 				display: none;
 | |
| 			}
 | |
| 		</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-manage">
 | |
| 
 | |
| 		<div id="header">
 | |
| 			<h1 id="manage-heading"></h1>
 | |
| 			<p id="manage-text"></p>
 | |
| 			<fieldset>
 | |
| 				<legend id="filters"></legend>
 | |
| 				<div><input id="manage.onlyEnabled" type="checkbox"><label id="manage.onlyEnabled-label" for="manage.onlyEnabled"></label></div>
 | |
| 				<div><input id="manage.onlyEdited" type="checkbox"><label id="manage.onlyEdited-label" for="manage.onlyEdited"></label></div>
 | |
| 			</fieldset>
 | |
| 			<p><button id="check-all-updates"></button></p>
 | |
| 			<p>
 | |
| 				<button id="apply-all-updates" class="hidden"></button>
 | |
| 				<span id="update-all-no-updates" class="hidden"></span>
 | |
| 			</p>
 | |
| 			<p><a href="edit.html"><button id="add-style-label"></button></a></p>
 | |
| 			<div id="options">
 | |
| 				<h2 id="options-heading"></h2>
 | |
| 				<input id="show-badge" type="checkbox"><label id="show-badge-label" for="show-badge"></label>
 | |
| 				<div><input id="popup.stylesFirst" type="checkbox"><label id="stylesFirst-label" for="popup.stylesFirst"></label></div>
 | |
| 			</div>
 | |
| 		</div>
 | |
| 		<div id="installed"></div>
 | |
| 
 | |
| 		<script src="manage.js"></script>
 | |
| 	</body>
 | |
| </html>
 |