Mirror/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2025-12-31 03:48:42 +03:00
Code Issues Packages Projects Releases Wiki Activity

Changed popup look

Browse Source
This commit is contained in:
Ajay Ramachandran
2020-04-20 16:56:12 -04:00
parent a7e2f83033
commit 7eb6f1c482
2 changed files with 32 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
public/popup.css
View File

@@ -39,10 +39,8 @@ sub.popupElement {
vertical-align: text-bottom; vertical-align: text-bottom;
} }
.popupElement { .logoText {
font-family: 'Source Sans Pro', sans-serif; color: white;
color: black;
} }
h1.popupElement { h1.popupElement {
@@ -52,16 +50,21 @@ h1.popupElement {
.popupBody { .popupBody {
font-size: 14px; font-size: 14px;
background-color: #ffd9d9; background-color: #333;
padding: 0px 5px; padding: 0px 5px;
font-family: 'Source Sans Pro', sans-serif;
color: #dddddd;
} }
.outerPopupBody { .outerPopupBody {
background-color: #222626;
overflow-y: scroll; overflow-y: scroll;
} }
.discreteLink.popupElement { .discreteLink.popupElement {
color: black; color: #dddddd;
} }
.recordingSubtitle.popupElement { .recordingSubtitle.popupElement {
@@ -106,7 +109,7 @@ h1.popupElement {
} }
.whitelistButton.popupElement { .whitelistButton.popupElement {
background-color:#3acc3a; background-color:#27a52d;
-moz-border-radius:28px; -moz-border-radius:28px;
-webkit-border-radius:28px; -webkit-border-radius:28px;
border-radius:28px; border-radius:28px;
@@ -118,13 +121,15 @@ h1.popupElement {
padding:8px 37px; padding:8px 37px;
text-decoration:none; text-decoration:none;
text-shadow:0px 0px 0px #27663c; text-shadow:0px 0px 0px #27663c;
}
transition: 0.01s background-color;
}
.whitelistButton:hover.popupElement { .whitelistButton:hover.popupElement {
background-color:#218b26; background-color:#3acc3a;
} }
.whitelistButton:focus.popupElement { .whitelistButton:focus.popupElement {
outline: none; outline: none;
background-color:#218b26; background-color:#3acc3a;
} }
.whitelistButton:active.popupElement { .whitelistButton:active.popupElement {
position:relative; position:relative;
@@ -132,25 +137,27 @@ h1.popupElement {
} }
.greenButton.popupElement { .greenButton.popupElement {
background-color:#ec1c1c; background-color:#cc1717;
-moz-border-radius:28px; -moz-border-radius:28px;
-webkit-border-radius:28px; -webkit-border-radius:28px;
border-radius:28px; border-radius:28px;
border:1px solid #d31919; border: none;
display:inline-block; display:inline-block;
cursor:pointer; cursor:pointer;
color:#ffffff; color:#ffffff;
font-size:16px; font-size:16px;
padding:8px 37px; padding:8px 37px;
text-decoration:none; text-decoration:none;
text-shadow:0px 0px 0px #662727; text-shadow:0px 0px 0px #662727;
transition: 0.01s background-color;
} }
.greenButton:hover.popupElement { .greenButton:hover.popupElement {
background-color:#bf2a2a; background-color:#ec1c1c;
} }
.greenButton:focus.popupElement { .greenButton:focus.popupElement {
outline: none; outline: none;
background-color:#bf2a2a; background-color:#ec1c1c;
} }
.greenButton:active.popupElement { .greenButton:active.popupElement {
position:relative; position:relative;
@@ -158,14 +165,11 @@ h1.popupElement {
} }
.dangerButton.popupElement { .dangerButton.popupElement {
-moz-box-shadow:inset 0px 1px 0px 0px #cf866c; background-color:#bc3315;
-webkit-box-shadow:inset 0px 1px 0px 0px #cf866c;
box-shadow:inset 0px 1px 0px 0px #cf866c;
background-color:#d0451b;
-moz-border-radius:3px; -moz-border-radius:3px;
-webkit-border-radius:3px; -webkit-border-radius:3px;
border-radius:3px; border-radius:3px;
border:1px solid #942911; border: none;
display:inline-block; display:inline-block;
cursor:pointer; cursor:pointer;
color:#ffffff; color:#ffffff;
@@ -175,11 +179,11 @@ h1.popupElement {
text-shadow:0px 1px 0px #854629; text-shadow:0px 1px 0px #854629;
} }
.dangerButton:hover.popupElement { .dangerButton:hover.popupElement {
background-color:#bc3315; background-color:#d0451b;
} }
.dangerButton:focus.popupElement { .dangerButton:focus.popupElement {
outline: none; outline: none;
background-color:#bc3315; background-color:#d0451b;
} }
.dangerButton:active.popupElement { .dangerButton:active.popupElement {
position:relative; position:relative;
@@ -187,14 +191,11 @@ h1.popupElement {
} }
.warningButton.popupElement { .warningButton.popupElement {
-moz-box-shadow:inset 0px 1px 0px 0px #cfbd6c; background-color:#bc8215;
-webkit-box-shadow:inset 0px 1px 0px 0px #cfbd6c;
box-shadow:inset 0px 1px 0px 0px #cfbd6c;
background-color:#d0821b;
-moz-border-radius:3px; -moz-border-radius:3px;
-webkit-border-radius:3px; -webkit-border-radius:3px;
border-radius:3px; border-radius:3px;
border:1px solid #948b11; border: none;
display:inline-block; display:inline-block;
cursor:pointer; cursor:pointer;
color:#ffffff; color:#ffffff;
@@ -204,11 +205,11 @@ h1.popupElement {
text-shadow:0px 1px 0px #856829; text-shadow:0px 1px 0px #856829;
} }
.warningButton:hover.popupElement { .warningButton:hover.popupElement {
background-color:#bc8215; background-color:#d0821b;
} }
.warningButton:focus.popupElement { .warningButton:focus.popupElement {
outline: none; outline: none;
background-color:#bc8215; background-color:#d0821b;
} }
.warningButton:active.popupElement { .warningButton:active.popupElement {
position:relative; position:relative;

4
public/popup.html
View File

@@ -5,10 +5,10 @@
<link id="sponsorBlockStyleSheet" rel="stylesheet" type="text/css" href="popup.css"/> <link id="sponsorBlockStyleSheet" rel="stylesheet" type="text/css" href="popup.css"/>
</head> </head>
<body class="popupBody outerPopupBody"> <body class="outerPopupBody">
<center> <center>
<div id="app" class="popupBody sponsorBlockPageBody"> <div id="app" class="popupBody sponsorBlockPageBody">
<h1 class="popupElement"> <h1 class="popupElement logoText">
<img src="icons/IconSponsorBlocker256px.png" height="32px" id="sponsorBlockPopupLogo"/> <img src="icons/IconSponsorBlocker256px.png" height="32px" id="sponsorBlockPopupLogo"/>
__MSG_Name__ __MSG_Name__
</h1> </h1>