diff options
| author | Ajay Ramachandran <[email protected]> | 2019-07-10 12:20:29 -0400 |
|---|---|---|
| committer | Ajay Ramachandran <[email protected]> | 2019-07-10 12:20:29 -0400 |
| commit | 2e6a61680613d9f7736819bd565387caed7f249c (patch) | |
| tree | d543be713cf410c27ce55c779b093f9aa649ddf2 | |
| parent | 2bef9ed08db6ae3aa297755ae27161acc766946d (diff) | |
| download | SponsorBlock-2e6a61680613d9f7736819bd565387caed7f249c.tar.gz SponsorBlock-2e6a61680613d9f7736819bd565387caed7f249c.zip | |
Added nice buttons to the popup
| -rw-r--r-- | popup.css | 73 | ||||
| -rw-r--r-- | popup.html | 10 |
2 files changed, 78 insertions, 5 deletions
@@ -4,4 +4,75 @@ body { width: 300px; -}
\ No newline at end of file +} + +.greenButton { + background-color:#44c767; + -moz-border-radius:28px; + -webkit-border-radius:28px; + border-radius:28px; + border:1px solid #18ab29; + display:inline-block; + cursor:pointer; + color:#ffffff; + font-family:Arial; + font-size:16px; + padding:8px 37px; + text-decoration:none; + text-shadow:0px 0px 0px #2f6627; +} +.greenButton:hover { + background-color:#5cbf2a; +} +.greenButton:active { + position:relative; + top:1px; +} + +.noticeButton { + -moz-box-shadow:inset 0px 1px 0px 0px #cf866c; + -webkit-box-shadow:inset 0px 1px 0px 0px #cf866c; + box-shadow:inset 0px 1px 0px 0px #cf866c; + background-color:#d0451b; + -moz-border-radius:3px; + -webkit-border-radius:3px; + border-radius:3px; + border:1px solid #942911; + display:inline-block; + cursor:pointer; + color:#ffffff; + font-family:Arial; + font-size:13px; + padding:6px 24px; + text-decoration:none; + text-shadow:0px 1px 0px #854629; +} +.noticeButton:hover { + background-color:#bc3315; +} +.noticeButton:active { + position:relative; + top:1px; +} + +.smallButton { + background-color:#2dabf9; + -moz-border-radius:3px; + -webkit-border-radius:3px; + border-radius:3px; + border:1px solid #2dabf9; + display:inline-block; + cursor:pointer; + color:#ffffff; + font-family:Arial; + font-size:14px; + padding:6px 10px; + text-decoration:none; +} +.smallButton:hover { + background-color:#0688fa; +} +.smallButton:active { + position:relative; + top:1px; +} @@ -32,7 +32,7 @@ </p> <div> - <button id="sponsorStart">Sponsorship Starts Now</button> + <button id="sponsorStart" class="greenButton">Sponsorship Starts Now</button> </div> <div id="submissionSection" style="display: none"> @@ -43,16 +43,18 @@ </div> </b> - <button id="clearTimes">Clear Times</button> + <button id="clearTimes" class="smallButton">Clear Times</button> <br/> + <br/> - <button id="submitTimes">Submit Times</button> + <button id="submitTimes" class="smallButton">Submit Times</button> </div> <br/> + <br/> - <button id="showNoticeAgain" style="display: none">Show Notice Again</button> + <button id="showNoticeAgain" style="display: none" class="noticeButton">Show Notice Again</button> </div> </div> </center> |