mirror of
https://github.com/QuiteAFancyEmerald/Holy-Unblocker.git
synced 2025-05-12 11:30:01 -04:00
add: some wip style changes
This commit is contained in:
Quite A Fancy Emerald
parent
618b29934c
commit
b0744f6505
4 changed files with 182 additions and 35 deletions
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"title": "HU LTS",
|
||||
"host": "0.0.0.0",
|
||||
"minifyScripts": true,
|
||||
"minifyScripts": false,
|
||||
"randomizeIdentifiers": true,
|
||||
"production": false
|
||||
}
|
||||
|
|
|
|||
|
|
@ -389,7 +389,7 @@ details[open] summary {
|
|||
background-image: url('/assets/svg/new.svg');
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
image-rendering: -webkit-optimize-contrast; /* Better SVG rendering */
|
||||
image-rendering: -webkit-optimize-contrast;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
|
@ -527,9 +527,9 @@ details[open] summary {
|
|||
font-family: 'Figtree', sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
backdrop-filter: blur(10px); /* Frosted glass effect */
|
||||
-webkit-backdrop-filter: blur(10px); /* For Safari */
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Add some shadow for depth */
|
||||
backdrop-filter: blur(10px);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.settings-header {
|
||||
|
|
@ -970,10 +970,10 @@ input[type='text'] {
|
|||
.no-select,
|
||||
.comment,
|
||||
.mac-content br {
|
||||
user-select: none; /* Prevent text selection */
|
||||
-webkit-user-select: none; /* For Safari */
|
||||
-moz-user-select: none; /* For Firefox */
|
||||
-ms-user-select: none; /* For Internet Explorer/Edge */
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
|
||||
.mac-content {
|
||||
|
|
@ -1330,8 +1330,8 @@ iner .splashstrokeheader {
|
|||
overflow: hidden;
|
||||
text-align: left;
|
||||
box-sizing: border-box;
|
||||
backdrop-filter: blur(10px); /* Frosted glass effect */
|
||||
-webkit-backdrop-filter: blur(10px); /* For Safari */
|
||||
backdrop-filter: blur(10px);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.box-card::after {
|
||||
|
|
@ -1615,18 +1615,35 @@ iner .splashstrokeheader {
|
|||
/* -----------------------------------------------
|
||||
/* Proxy Pages
|
||||
/* ----------------------------------------------- */
|
||||
.pr-logo {
|
||||
width: 100%;
|
||||
max-width: 310px;
|
||||
height: auto;
|
||||
margin: 0 auto 30px auto;
|
||||
}
|
||||
|
||||
.pr-tippy {
|
||||
color: rgb(255, 136, 142);
|
||||
}
|
||||
|
||||
.advanced-settings, label {
|
||||
vertical-align: auto;
|
||||
margin-inline-end: 20px;
|
||||
}
|
||||
|
||||
.pr-form {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.pr-form input {
|
||||
background-color: var(--nord0);
|
||||
border: 1px solid var(--nord0);
|
||||
border: 1px solid var(--nord1);
|
||||
}
|
||||
|
||||
.pr-form input,
|
||||
.pr-form a {
|
||||
.pr-form a,
|
||||
.pr-form select {
|
||||
vertical-align: baseline;
|
||||
outline: none;
|
||||
border-radius: 5px;
|
||||
|
|
@ -1656,6 +1673,7 @@ iner .splashstrokeheader {
|
|||
text-decoration: none;
|
||||
display: inline-block;
|
||||
background-color: var(--nord0);
|
||||
border: 1px solid var(--nord1) !important;
|
||||
transition: 0.3s ease-in-out;
|
||||
-webkit-transition: 0.3s ease-in-out;
|
||||
}
|
||||
|
|
@ -1664,6 +1682,40 @@ iner .splashstrokeheader {
|
|||
background-color: var(--nord2);
|
||||
}
|
||||
|
||||
#wisp-box .table-header {
|
||||
display: flex;
|
||||
background-color: #f0f0f0;
|
||||
padding: 8px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
#wisp-box .table-row {
|
||||
display: flex;
|
||||
padding: 8px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
#wisp-box .table-cell {
|
||||
flex: 1;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#wisp-box .table-cell:nth-child(1) {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
#wisp-box .table-cell:nth-child(2) {
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
#wisp-box .table-cell:nth-child(3) {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
#wisp-box .table-cell:nth-child(4) {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
/* Used on the Games and YouTube pages. */
|
||||
.responsive-fix {
|
||||
padding: 20px;
|
||||
|
|
|
|||
|
|
@ -98,34 +98,101 @@
|
|||
<script src="
|
||||
https://cdn.jsdelivr.net/npm/tsparticles@3.5/tsparticles.bundle.min.js
|
||||
"></script>
|
||||
<script src="https://unpkg.com/@popperjs/core@2"></script>
|
||||
<script src="https://unpkg.com/tippy.js@6"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- IMPORTANT-HUCOOKINGINSERT-DONOTDELETE -->
|
||||
<div id="header" class="fullwidth"><!--HEADER--></div>
|
||||
<div id="particles-js" class="fullwidth"></div>
|
||||
<div data-aos="fade-right" class="hero-grid-container">
|
||||
<div class="box-hero">
|
||||
<div class="hero-content">
|
||||
<div class="proxy-header text-center">
|
||||
<img class="pr-logo" src="/assets/img/scramjet.png" alt="Scramjet Web Proxy" />
|
||||
<p>
|
||||
Scramjet is a web proxy designed with performance and security in mind to evade internet censorship,<br>bypass arbitrary web browser restrictions and innovate web proxy technologies.<br><br>
|
||||
This allows you to browse various websites with higher level of privacy<br> and access popular resources like Discord, GeForce NOW, Twitter and YouTube on restricted networks.
|
||||
</p>
|
||||
</div>
|
||||
<div class="proxy-form text-center">
|
||||
<div id="pr-sj" class="pr-form">
|
||||
<select id="engine" class="pr-button glowbutton">
|
||||
<option value="google">Google</option>
|
||||
<option value="duckduckgo">DuckDuckGo</option>
|
||||
<option value="bing">Bing</option>
|
||||
<option value="brave">Brave</option>
|
||||
</select>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
spellcheck="false"
|
||||
autocomplete="off"
|
||||
placeholder="Type a URL here or enter a search query!"
|
||||
id="search-input"
|
||||
/>
|
||||
|
||||
<a href="#" class="pr-button glowbutton pr-go2" id="search-btn">SEARCH</a>
|
||||
</div>
|
||||
|
||||
<h3>Advanced Settings ▼</h3>
|
||||
<div id="settings-panel" class="pr-settings">
|
||||
<div class="advanced-settings"></div>
|
||||
<label>
|
||||
Tor Browsing Mode <span class="pr-tippy" data-tippy-content="Choose your Tor browsing mode. This allows you to use Tor routing in any browser. TLDR: You can access any .onion link in any browser.">(?) </span>
|
||||
<select>
|
||||
<option value="off">Off</option>
|
||||
<option value="safe">Enabled</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
Hide Ads <span class="pr-tippy" data-tippy-content="Enable or disable ad blocking.">(?) </span>
|
||||
<select>
|
||||
<option value="off">Off</option>
|
||||
<option value="safe">Enabled</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
Region Selection <span class="pr-tippy" data-tippy-content="Enable or select regional proxies.">(?) </span>
|
||||
<select>
|
||||
<option value="off">Off</option>
|
||||
<option value="safe">Enabled</option>
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<div class="wisp-box">
|
||||
<p class="cseltitle">Wisp Protocol Transport <span class="pr-tippy" data-tippy-content="Wisp is designed to be a low-overhead, easy to implement protocol for proxying multiple TCP sockets over a single websocket connection. TLDR: Selecting a specific option will provide a focus on either speed, security or both at once. Just options for the user to select when utilizing Scramjet.">(?) </span></p>
|
||||
<div class="box-hero radio-group" id="uv-transport-list">
|
||||
<label>
|
||||
<p>
|
||||
Libcurl <span class="pr-tippy" data-tippy-content="Libcurl transport focuses on full TLS encryption but has slightly slower speeds than Epoxy. [ALTERNATIVE/FIREFOX DEFAULT]">(?) </span>
|
||||
<span class="default-badge">Cross-Browser/Secure (Firefox)</span>
|
||||
</p>
|
||||
<input type="radio" name="uv-transport" value="libcurl" checked />
|
||||
</label>
|
||||
<label>
|
||||
<p>
|
||||
Epoxy <span class="pr-tippy" data-tippy-content="Expoxy allows you to make requests that bypass CORS without compromising security by running SSL/TLS inside webassembly with incredible performance. [HIGHLY RECOMMEND AND OPTIMIZED FOR SPEED].">(?) </span>
|
||||
<span class="bare-badge">Fastest/Secure (Chromium, Apple)</span>
|
||||
</p>
|
||||
<input type="radio" name="uv-transport" value="epoxy" />
|
||||
</label>
|
||||
<label>
|
||||
<p>Bare <span class="pr-tippy" data-tippy-content="Bare is NOT recommend and a last resort for unsupported sites.">(?) </span>
|
||||
<span class="beta-badge">Least Secure (All)</span></p>
|
||||
<input type="radio" name="uv-transport" value="bare" />
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="mainbody" class="fullwidth">
|
||||
<div class="ad" id="ad-left"></div>
|
||||
<div class="ad" id="ad-right"></div>
|
||||
<!-- IMPORTANT-HUCOOKINGINSERT-DONOTDELETE -->
|
||||
<div class="box box-medium text-center textm">
|
||||
<h1 class="bigtitle">Scramjet (Beta)</h1>
|
||||
<p>
|
||||
Scramjet is an experimental interception based web proxy that aims to
|
||||
be the successor to Ultraviolet.<br>
|
||||
</p>
|
||||
<div id="pr-sj" class="pr-form">
|
||||
<input
|
||||
type="text"
|
||||
spellcheck="false"
|
||||
autocomplete="off"
|
||||
placeholder="Search or enter in a target site!"
|
||||
/>
|
||||
<a href="#" style="display: none" class="pr-button glowbutton pr-go1"
|
||||
>Stea­lth</a
|
||||
>
|
||||
<a href="#" class="pr-button glowbutton pr-go2">Stea­lth</a>
|
||||
</div>
|
||||
<h3>
|
||||
N<wbr />etwo<wbr />rk fi<wbr />x i<wbr />f erro<wbr />rs occ<wbr />urs
|
||||
or bla<wbr />nk pa<wbr />ge:
|
||||
|
|
@ -162,6 +229,13 @@
|
|||
</div>
|
||||
<div id="footer" class="fullwidth"><!--FOOTER--></div>
|
||||
<!-- IMPORTANT-HUCOOKINGINSERT-DONOTDELETE -->
|
||||
<script>
|
||||
tippy('.pr-tippy', {
|
||||
delay: 50,
|
||||
animateFill: true,
|
||||
placement: 'bottom'
|
||||
});
|
||||
</script>
|
||||
<script src="/scram/scramjet.controller.js"></script>
|
||||
<script src="assets/js/common.js"></script>
|
||||
<script src="assets/js/csel.js"></script>
|
||||
|
|
|
|||
|
|
@ -36,6 +36,9 @@
|
|||
<script src="
|
||||
https://cdn.jsdelivr.net/npm/tsparticles@3.5/tsparticles.bundle.min.js
|
||||
"></script>
|
||||
<link rel="stylesheet" href="https://unpkg.com/tippy.js@6/dist/backdrop.css">
|
||||
<link rel="stylesheet" href="https://unpkg.com/tippy.js@6/animations/shift-away.css">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
@ -59,10 +62,28 @@
|
|||
customizable blacklist settings, leak prevention mechanisms, and
|
||||
advanced security measures.
|
||||
</h2>
|
||||
<h2 class="box-description">
|
||||
Select a proxy service below to get started!
|
||||
</h2>
|
||||
<div class="box-button-container">
|
||||
<a href="/scramjet" class="box-button">Scramjet (Beta)</a>
|
||||
<a href="/ultraviolet" class="box-button">Ultraviolet</a>
|
||||
<a href="/rammerhead" class="box-button">Rammerhead</a>
|
||||
<a id="sjtooltip" href="/scramjet" class="box-button">Scramjet (BETA)</a>
|
||||
<a id="uvtooltip" href="/ultraviolet" class="box-button">Ultraviolet</a>
|
||||
<a id="rhtooltip" href="/rammerhead" class="box-button">Rammerhead</a>
|
||||
<script src="https://unpkg.com/@popperjs/core@2"></script>
|
||||
<script src="https://unpkg.com/tippy.js@6"></script>
|
||||
<script>
|
||||
const tooltipContent = {
|
||||
sjtooltip: 'Scramjet [Recommended]: Fast, secure, and frequently updated.',
|
||||
uvtooltip: 'Ultraviolet [Fallback]: Popular, but use as fallback for CAPTCHA support.',
|
||||
rhtooltip: 'Rammerhead [Optional]: Not secure and has many leaks. Use as alternative fallback.',
|
||||
};
|
||||
|
||||
tippy.setDefaultProps({delay: 50, animateFill: true, placement: 'bottom'});
|
||||
|
||||
tippy('#sjtooltip', { content: tooltipContent.sjtooltip });
|
||||
tippy('#uvtooltip', { content: tooltipContent.uvtooltip });
|
||||
tippy('#rhtooltip', { content: tooltipContent.rhtooltip });
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-image-container">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue