Skip to content

Commit

Permalink
Merge pull request #1144 from BS-zombie/main
Browse files Browse the repository at this point in the history 
change options page formatting
  • Loading branch information
@undeadjess
undeadjess authored Oct 2, 2023
2 parents 8f650ef + 3c727fe commit fb4c7c8
Show file tree
Hide file tree
Showing 3 changed files with 117 additions and 34 deletions.
44 changes: 34 additions & 10 deletions src/_locales/en/messages.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,25 +36,49 @@
"message": "Enable website bypasses."
},
"optionsNavigationDelay": {
"message": "Take me to destinations after % second(s)."
"message": "Bypass Link Shorteners after % second(s)."
},
"optionsTrackerBypass": {
"message": "Bypass trackers (such as bit.ly and goo.gl) using Unshorten.me."
"message": "Bypass trackers"
},
"optionsInstantNavigationTrackers": {
"message": "Instantly take me to destinations of trackers."
"message": "Bypass Trackers immediately."
},
"optionsBlockIPLoggers": {
"message": "Block IP loggers if they can't be bypassed."
"message": "Block IP loggers."
},
"optionsCrowdBypass": {
"message": "Crowd Bypass: Give and take the destinations of unbypassable shorteners."
"message": "Crowd Bypass."
},
"optionsCrowdAutoOpen": {
"message": "Open crowd-sourced destinations in a new tab after % second(s)."
"message": "Open Crowd destinations after % second(s)."
},
"optionsCrowdAutoClose": {
"message": "Close tab containing the crowd-sourced destination after % second(s) of visiting it."
"message": "Close Crowd destination after % second(s)."
},
"optionsNavigationDelayDescription": {
"message": "Automatically bypass link shorteners such as Adf.ly, sub2unlock.com, after a certain amount of seconds. Recommended: On, 0 seconds."
},
"optionsTrackerBypassDescription": {
"message": "Automatically bypass trackers such as t.co and goo.gl using the Unshorten.me API. Recommended: On."
},
"optionsInstantNavigationTrackersDescription": {
"message": "Bypass trackers immediately and automatically, instead of providing a link to the destination. Recommended: On."
},
"optionsBlockIPLoggersDescription": {
"message": "If FastForward can't bypass a link that will log your IP, we will block it instead. Recommended: On."
},
"optionsCrowdBypassDescription": {
"message": "Crowd Bypass: Use FastForward's online database of bypassed links to instantly bypass popular sites. Recommended: On."
},
"optionsCrowdAutoOpenDescription": {
"message": "Open Crowd Bypass destinations in a new tab rather than the current one, so you don't lose your place. Recommended: Off"
},
"optionsCrowdAutoCloseDescription": {
"message": "Close Crowd Bypass destination after a few seconds. Useful if most of the sites you visit have a direct download link. Recommended: Off"
},
"crowdBypassTempDisabledDescription": {
"message": "Crowd bypass has been temporarily disabled when FastForward was updated. Please re-enable it."
},
"privacyPolicy": {
"message": "Privacy Policy"
Expand Down Expand Up @@ -134,8 +158,8 @@
"optionsWhitelist": {
"message": "Whitelist"
},
"optionsWhitelistDescription": {
"message": "A list of sites formatted as domain.tld or subdomain.domain.tld separated with a newline that will not be bypassed by FastForward. You can use * as a wildcard."
"optionsWhitelistDescription": {
"message": "A list of sites formatted as domain.tld or subdomain.domain.tld that won't be bypassed by FastForward. Seperate domains with new lines. Use * as a wildcard."
},
"tempDisableCrowdBypassButton": {
"message": "Temporarily disable crowd bypass"
Expand All @@ -152,5 +176,5 @@
"trackerBypassedError": {
"message": "Oops! Something went wrong. Redirecting to the original link..."
}

}
83 changes: 64 additions & 19 deletions src/html/options.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,30 +29,75 @@
<form id="options-form">
<section>
<h2 data-message="options"></h2>
<label class="ffInput"><input type="checkbox" id="navigationDelayToggle"><span class="checkmark"></span></label>
<span data-message="optionsNavigationDelay" for="option-navigation-delay"></span><br />
<label class="ffInput"><input type="checkbox" id="optionTrackerBypass"><span class="checkmark"></span></label>
<label style="cursor: pointer" for="option-tracker-bypass"><span data-message="optionsTrackerBypass"></span></label>
(<a href="https://unshorten.me/privacy-policy" target="_blank" data-message="privacyPolicy" class="link"></a>)<br />
<label class="ffInput"><input type="checkbox" id="optionInstantNavigationTrackers"><span class="checkmark"></span></label>
<label style="cursor: pointer" for="option-instant-navigation-trackers" data-message="optionsInstantNavigationTrackers"></label><br />
<label class="ffInput"><input type="checkbox" id="optionBlockIpLoggers"><span class="checkmark"></span></label>
<label style="cursor: pointer" for="option-block-ip-loggers" data-message="optionsBlockIPLoggers"></label><br />
<label class="ffInput"><input type="checkbox" id="optionCrowdBypass"><span class="checkmark"></span></label>
<label style="cursor: pointer" for="option-crowd-bypass" data-message="optionsCrowdBypass"></label>
(<a href="https://github.com/FastForwardTeam/FastForward/blob/master/PRIVACY.md#crowd-bypass" target="_blank" data-message="privacyPolicy" class="link"></a>)<span id="crowdTempDisabledMessage">
(<span class="text-warn" data-message="crowdBypassTempDisabled"></span>)</span><br />
<label class="ffInput"><input type="checkbox" id="optionCrowdOpenDelayToggle"><span class="checkmark"></span></label>
<span data-message="optionsCrowdAutoOpen" for="option-crowd-open-delay"></span><br />
<label class="ffInput"><input type="checkbox" id="optionCrowdCloseDelayToggle"><span class="checkmark"></span></label>
<span data-message="optionsCrowdAutoClose" for="option-crowd-close-delay"></span>
<div class="option">
<label class="ffInput">
<input type="checkbox" id="navigationDelayToggle">
<span class="checkmark"></span>
</label>
<span data-message="optionsNavigationDelay" for="option-navigation-delay"></span>
<p data-message="optionsNavigationDelayDescription"></p>
</div>
<hr><br>
<div class="option">
<label class="ffInput">
<input type="checkbox" id="optionTrackerBypass">
<span class="checkmark"></span>
</label>
<span data-message="optionsTrackerBypass" for="option-tracker-bypass"></span> (<a href="https://unshorten.me/privacy-policy" target="_blank" data-message="privacyPolicy" class="link"></a>)
<p data-message="optionsTrackerBypassDescription"></p>
</div>
<div class="indentedOption">
<label class="ffInput">
<input type="checkbox" id="optionInstantNavigationTrackers">
<span class="checkmark"></span>
</label>
<span data-message="optionsInstantNavigationTrackers" for="option-instant-navigation-trackers"></span>
<p data-message="optionsInstantNavigationTrackersDescription"></p>
</div>
<hr><br>
<div class="option">
<label class="ffInput">
<input type="checkbox" id="optionBlockIpLoggers">
<span class="checkmark"></span>
</label>
<span data-message="optionsBlockIPLoggers" for="option-block-ip-loggers"></span>
<p data-message="optionsBlockIPLoggersDescription"></p>
</div>
<hr><br>
<div class="option">
<label class="ffInput">
<input type="checkbox" id="optionCrowdBypass">
<span class="checkmark"></span>
</label>
<span data-message="optionsCrowdBypass" for="option-crowd-bypass"></span> (<a href="https://github.com/FastForwardTeam/FastForward/blob/master/PRIVACY.md#crowd-bypass" target="_blank" data-message="privacyPolicy" class="link"></a>)
<p data-message="optionsCrowdBypassDescription"></p>
<span id="crowdTempDisabledMessage">
(<span class="text-warn" data-message="crowdBypassTempDisabled"></span>)
</span>
</div>
<div class="indentedOption">
<label class="ffInput">
<input type="checkbox" id="optionCrowdOpenDelayToggle">
<span class="checkmark"></span>
</label>
<span data-message="optionsCrowdAutoOpen" for="option-crowd-open-delay"></span>
<p data-message="optionsCrowdAutoOpenDescription"></p>
</div>
<div class="indentedOption">
<label class="ffInput">
<input type="checkbox" id="optionCrowdCloseDelayToggle">
<span class="checkmark"></span>
</label>
<span data-message="optionsCrowdAutoClose" for="option-crowd-close-delay"></span>
<p data-message="optionsCrowdAutoCloseDescription"></p>
</div>
</section>
<section>
<h2 data-message="optionsWhitelist"></h2>
<p><span data-message="optionsWhitelistDescription"></span></p>
<p data-message="optionsWhitelistDescription"></p>
<textarea id="whitelist" class="ffInput" spellcheck="false"></textarea>
</section>
</form>
</form>
<p class="version"><span data-message="version"></span> <span id="version"></span></p>
</div>
<script src="i18n.js"></script>
Expand Down
24 changes: 19 additions & 5 deletions src/html/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -395,17 +395,22 @@ a .link-preview:hover {
#contribute {
position: absolute;
/* display: none; */
width: calc(100vw - 6px);
width: 60%;
background-image: linear-gradient(135deg, var(--ff-aqua) 0%, var(--ff-blue) 50%, var(--ff-purple) 100%);
padding: 3px;
padding-left: 6px;
margin: auto;
margin-top: 5px;
z-index: 1;
left: 50%;
transform: translateX(-50%);
border-radius: 10px;
}

#contribute p {
width: fit-content;
display: inline-block;
margin-left: 20px;
}

#contribute a {
Expand All @@ -416,9 +421,9 @@ a .link-preview:hover {
cursor: pointer;
width: fit-content;
float: right;
vertical-align: top;
margin-right: 6px;
font-size: 20px;
vertical-align: middle;
margin-right: 20px;
font-size: 40px;
}

#close:after {
Expand All @@ -429,4 +434,13 @@ a .link-preview:hover {
#whitelistDesc {
margin-left: 27.055px;
margin-right: 27.055px;
}
}
.option p {
color: #7a7a7a;
}
.indentedOption {
margin-left: 54.11px;
}
.indentedOption p {
color: #7a7a7a;
}

0 comments on commit fb4c7c8

Please sign in to comment.