Mirror/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2026-01-01 14:19:23 +03:00
Code Issues Packages Projects Releases Wiki Activity

Set options and help page to use html5

Browse Source 
- Fix css when using html5
- Add encoding scheme to html
- Remove font-size change on title on hover. It's jarring
seeing the whole page move when trying to move your mouse
to the options.
- Remove center tags
- Remove unnecessary styles
- Fix some minor grammar
This commit is contained in:
Jeremy Plsek
2020-01-15 20:30:07 -05:00
parent 6f2a09695b
commit f99a3f5088
6 changed files with 64 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
help/index_en.html
View File

@@ -1,5 +1,8 @@
<!DOCTYPE html>
<head>
<title> SponsorBlock </title>
<meta charset="utf-8">
<link href="styles.css" rel="stylesheet"/>
</head>
@@ -11,7 +14,7 @@
SponsorBlock
</div>
<center>
<div class="container">
<p class="createdBy">Created By <a href="https://ajay.app">Ajay Ramachandran</a> <img src="https://ajay.app/newprofilepic.jpg" height="30" class="profilepiccircle"/></p>
@@ -48,7 +51,7 @@
Whenever you skip a video, you will get a notice report that submission. If the timing seems wrong, report it! You can also vote in the popup. The extension auto upvotes it if you don't report it, so make sure to report when necessary (this can be disabled in the options).
</p>
<center><img height="120px" src="https://user-images.githubusercontent.com/12688112/63067735-5a638700-bede-11e9-8147-f321b57527ec.gif"></center>
<div class="center"><img height="120px" src="https://user-images.githubusercontent.com/12688112/63067735-5a638700-bede-11e9-8147-f321b57527ec.gif"></div>
<h1>Submitting</h1>
@@ -106,7 +109,7 @@
Ask on Discord or make an Issue on GitHub. I am happy to hear suggestions or improvements you want. You may also contribute code or graphics if you would like.
</p>
<h1>Where can I get the source code</h1>
<h1>Where can I get the source code?</h1>
<h4 style="display: inline">Client:</h4>
<!-- Github logo -->
@@ -116,7 +119,7 @@
<!-- Github logo -->
<a href="https://github.com/ajayyy/SponsorBlockServer"><svg aria-hidden="true" version="1.1" viewBox="0 0 16 16" height="58px" style="padding-left: 15px"><path fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"></path></svg></a>
<h1>Credit</h1>
<h1>Credits</h1>
<p>The awesome <a href="https://github.com/omarroth/invidious/wiki/API">Invidious API</a> is used to grab the time the video was published.</p>
@@ -124,6 +127,6 @@
<p>Some icons made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> and are licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></p>
</center>
</div>
</body>

65
help/styles.css
View File

@@ -4,6 +4,16 @@
body {
background-color: #333333;
font-family: sans-serif;
}
.center {
text-align: center;
}
.container {
max-width: 60%;
margin: auto;
}
.projectPreview {
@@ -12,24 +22,24 @@ body {
.projectPreviewImage {
position: absolute;
left: -90;
width: 80;
left: -90px;
width: 80px;
top: 50%;
transform: translateY(-50%);
}
.projectPreviewImageLarge {
position: absolute;
left: -210;
width: 200;
left: -210px;
width: 200px;
top: 50%;
transform: translateY(-20%);
}
.projectPreviewImageLargeRight {
position: absolute;
right: -210;
width: 200;
right: -210px;
width: 200px;
top: 50%;
transform: translateY(-50%);
}
@@ -47,37 +57,27 @@ body {
text-align: center;
vertical-align: middle;
font-family: sans-serif;
font-size: 50;
font-size: 50px;
color: #212121;
/* height: 100; */
padding: 20;
padding: 20px;
text-decoration: none;
transition: font-size 1s;
}
#title:hover {
font-size: 60;
transition: font-size 1s;
}
.subtitle {
font-family: sans-serif;
font-size: 40;
font-size: 40px;
color: #dad8d8;
padding-top: 10;
padding-top: 10px;
transition: font-size 0.4s;
}
.subtitle:hover {
font-size: 45;
font-size: 45px;
transition: font-size 0.4s;
}
@@ -99,7 +99,7 @@ a {
}
.link {
padding: 20;
padding: 20px;
height: 80px;
@@ -113,13 +113,12 @@ a {
}
#contact,.smalllink {
font-family: sans-serif;
font-size: 25;
font-size: 25px;
color: #e8e8e8;
text-align: center;
padding: 10;
padding: 10px;
}
#contact {
@@ -127,15 +126,11 @@ a {
}
p,li,a {
font-family: sans-serif;
font-size: 20;
font-size: 20px;
color: #c4c4c4;
padding: 10;
}
p,li,code,a {
max-width: 60%;
text-align: left;
overflow-wrap: break-word;
}
@@ -147,7 +142,7 @@ p,li,code,a {
.projectPreviewImage {
position: unset;
width: 130;
width: 130px;
display: block;
margin: auto;
transform: none;
@@ -165,20 +160,18 @@ img {
}
#recentPostTitle {
font-family: sans-serif;
font-size: 30;
font-size: 30px;
color: #dad8d8;
}
#recentPostDate {
font-family: sans-serif;
font-size: 15;
font-size: 15px;
color: #dad8d8;
}
h1,h2,h3,h4,h5,h6 {
font-family: sans-serif;
color: #dad8d8;
text-align: center;
}
svg {