This commit is contained in:
Kevin Röbert 2017-08-04 16:52:54 +02:00
parent 2f09f1bae1
commit 483b8d48d2
2 changed files with 76 additions and 19 deletions

View File

@ -5,41 +5,68 @@
<style> <style>
body { body {
overflow: hidden; overflow: hidden;
margin: 5px; margin: 0;
padding: 5px; padding: 5px;
background: #fff; background: #fff;
width: 150px;
}
div{
width: 150px;
} }
div:first-child { button {
margin-top: 0px; border: none;
} border-radius: 5px;
div {
text-align: center; text-align: center;
padding: 5px 3px; padding: 5px 3px;
font-family: sans-serif; font-family: sans-serif;
font-size: 1.4em; font-size: 1em;
width: 110px; width: 140px;
margin-top: 5px; margin-bottom: 10px;
}
.enable {
color: #A43B00;
background: #FFE2BF; background: #FFE2BF;
} }
div:hover {
.enable:hover {
background: #FFD19A; background: #FFD19A;
} }
#enable {
border: 5px solid #FF8B00; .disable {
color: #A43B00; color: #fcf9fa;
background: #b2aeaf;
} }
#disable {
border: 5px solid #FF8B00; .disable:hover {
color: #A43B00; background: #4c4b4c;
}
#rule {
color: #4c4b4c;
background: #a5e569;
}
#rule:hover {
background: #96d160;
}
img {
margin-left: auto;
margin-right: auto;
display: block;
} }
</style> </style>
<script src="popup.js"></script> <script src="popup.js"></script>
</head> </head>
<body> <body>
<div id="enable"><b>Enable</b></div> <div>
<div id="disable"><b>Disable</b></div><br> <button id="status" class="enable" onclick="changeStatus()">Global Enable</button><br>
<img src="icon128.png"></img> <button id="exception" class="enable" onclick="handleException()">Enable on page</button><br>
<button id="rule">Add rule</button><br>
<img src="icon96.png"></img>
</div>
</body> </body>
</html> </html>

30
popup.js Normal file
View File

@ -0,0 +1,30 @@
var status = "on";
var exception = "off";
function changeStatus(){
var element = document.getElementById('status');
var val = "Global Enable";
if(status == "on"){
val = " Global Disable";
status = "off";
element.className = "disable";
}else{
status = "on";
element.className = "enable";
}
element.innerHTML = val;
}
function handleException(){
var element = document.getElementById('exception');
var val = "Enable on page";
if(exception == "off"){
val = "Disable on page";
exception = "on";
element.className = "disable";
}else{
exception = "off";
element.className = "enable";
}
element.innerHTML = val;
}