michael/clear-urls-browser-extension
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

New look

Browse Source 
Hello guys, this is my new Summer lookbook, please go check it out!
This commit is contained in:
astaar 2017-08-06 00:02:15 +02:00
parent 4bec2d6928
commit fba2653302
5 changed files with 159 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
plus.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 KiB

41
popup.html Normal file
View File

@ -0,0 +1,41 @@
<!doctype html>
<html>
<head>
<title>ClearURLs Add-on</title>
<link rel="stylesheet" type="text/css" href="popup_style.css">
<script src="popup.js"></script>
<script src="jquery-3.2.1.min.js"></script>
</head>
<body>
<div id="main">
<div class="header">ClearURLs 0.4</div>
<div id="content">
<div id="default">
<div id="global">
Enable globally:<br>
<button id="statusBtn" class="enable" onclick="changeStatus()"><img src="icon96.png"></button>
</div>
<div id="individual">
Enable individually:<br>
<div id="presets">
---placeholder---
<!-- <button id="exception" class="enable" onclick="handleException()">Enable on page</button><br> -->
</div>
</div>
</div>
<div id="custom">
My rules:<br>
<div id="rules">
---placeholder---<br>
</div>
<div id="addRuleOuter">
Add new rule (advanced):<br>
<div id="addRuleInner">
<div id="addRuleField"><input type="text"></div><div id="addRuleBtn"><img src="plus.png"></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

2
popup.js
View File

@ -2,7 +2,7 @@ var status = "on";
var exception = "off";
function changeStatus(){
var element = $("#status");
var element = $("#statusBtn");
var val = "Global Enable";
if(status == "on"){

117
popup_style.css Normal file
View File

@ -0,0 +1,117 @@
body {
margin: 0;
margin-bottom: 5px;
background: #fff;
min-width: 400px;
max-width: 500px;
font-family: "Arial";
}
img {
display: block;
margin: auto;
}
input[type="text"] {
width: auto;
}
#main {
max-width: 500px;
max-height: 400px;
overflow: auto;
}
#content {
font-size: 14pt;
padding: 10px;
}
.header {
display: block;
background-color: #4a4a4a;
color: #dedede;
font-size: 11pt;
text-align: center;
padding: 2px 0px 2px 0px;
margin: 5px 0px 5px 0px;
}
#default::after, #addRuleOuter::after, #addRuleInner::after {
content: "";
clear: both;
display: table;
}
#global {
width: 50%;
float: left;
}
.enable {
border: none;
background: none;
}
.enable:hover {
filter: brightness(90%);
}
.disable {
color: #fcf9fa;
background: #b2aeaf;
}
.disable:hover {
background: #4c4b4c;
}
#statusBtn {
display: block;
margin-top: 10px;
margin-left: 10px;
padding: 0;
}
#individual {
width: 50%;
float: right;
}
#presets, #rules, #addRuleOuter {
margin: 10px 0px 0px 10px;
}
#custom {
margin-top: 20px;
width: 100%;
display: block;
float: left;
}
#addRuleInner {
margin-top: 5px;
}
#addRuleField {
overflow: hidden;
float: left;
width: calc(100% - 55px);
height: 25px;
}
#addRuleField input {
width: 100%;
height: 100%;
}
#addRuleBtn {
width: 45px;
padding: 3px 0px 3px 0px;
float: right;
background-color: #b5e61d;
border: none;
border-radius: 5px;
}
#addRuleBtn:hover {
background-color: #96d160;
}

BIN
sketch.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 24 KiB