BinaryNinja/tvapp2
4
1
Fork 0
mirror of https://github.com/TheBinaryNinja/tvapp2.git synced 2026-06-04 09:35:42 -04:00
Code Issues Packages Projects Releases Wiki Activity

chore: change css stylesheet for header

Browse Source
This commit is contained in:
Aetherx
2025-03-21 04:16:00 -07:00
parent b6a8bb2e66
commit 23d4d523d6
1 changed files with 97 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
tvapp2/index.js
View File

@@ -731,6 +731,34 @@ const server = http.createServer((req, res) => {
} }
} }
@-webkit-keyframes fade-in
{
from { opacity: 0.6; }
to { opacity: 1; }
}
@-moz-keyframes fade-in
{
from { opacity: 0.6; }
to { opacity: 1; }
}
@keyframes fade-in
{
from { opacity: 0.6; }
to { opacity: 1; }
}
@keyframes scale-in
{
from {
transform: scale(1, 1);
}
to {
transform: scale(1.1, 1.1);
}
}
.container .container
{ {
text-align: left; text-align: left;
@@ -766,12 +794,38 @@ const server = http.createServer((req, res) => {
min-height: 100%; min-height: 100%;
} }
a
{
color: #FF0E7F !important;
text-decoration: underline dotted #606060;
font-weight: 600;
}
a:hover
{
color: #FFF !important;
text-decoration: underline dotted #FF0048;
font-weight: 600;
}
p p
{ {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
.header .logo
{
animation-name: fade-in, scale-in;
animation-duration: 1s, 0.5s;
animation-timing-function: ease-in, linear;
animation-direction: alternate, alternate;
animation-iteration-count: infinite, 1;
transition: all 0.3s;
opacity: 0.5;
transform: scale(1.1);
}
.footer .footer
{ {
position: absolute; position: absolute;
@@ -817,7 +871,7 @@ const server = http.createServer((req, res) => {
.header a .header a
{ {
color: #FFF; color: #FFF !important;
text-decoration: none; text-decoration: none;
padding-left: 7px; padding-left: 7px;
} }
@@ -891,6 +945,7 @@ const server = http.createServer((req, res) => {
{ {
border-bottom: 2px solid #575757; border-bottom: 2px solid #575757;
background-color: #181818; background-color: #181818;
color: #717171;
} }
.table thead th .table thead th
@@ -918,6 +973,7 @@ const server = http.createServer((req, res) => {
padding: 2vh; padding: 2vh;
margin-bottom: 2vh; margin-bottom: 2vh;
font-size: 1.6vmin; font-size: 1.6vmin;
font-weight: 100;
border: 1px dashed #FF6C00; border: 1px dashed #FF6C00;
width: 100%; width: 100%;
line-height: 25px; line-height: 25px;
@@ -928,6 +984,7 @@ const server = http.createServer((req, res) => {
background-color: #0F0F0F57; background-color: #0F0F0F57;
padding: 2vh; padding: 2vh;
font-size: 1.6vmin; font-size: 1.6vmin;
font-weight: 100;
border: 1px dashed #FF0048; border: 1px dashed #FF0048;
width: 100%; width: 100%;
line-height: 25px; line-height: 25px;
@@ -943,6 +1000,14 @@ const server = http.createServer((req, res) => {
padding-bottom: 2px; padding-bottom: 2px;
font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
margin-right: 8px; margin-right: 8px;
animation-name: fade-in, scale-in;
animation-duration: 1s, 0.5s;
animation-timing-function: ease-in, linear;
animation-direction: alternate, alternate;
animation-iteration-count: infinite, 1;
transition: all 0.3s;
opacity: 0.5;
transform: scale(1.1);
} }
span.warning span.warning
@@ -955,6 +1020,14 @@ const server = http.createServer((req, res) => {
padding-bottom: 2px; padding-bottom: 2px;
font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
margin-right: 8px; margin-right: 8px;
animation-name: fade-in, scale-in;
animation-duration: 1s, 0.5s;
animation-timing-function: ease-in, linear;
animation-direction: alternate, alternate;
animation-iteration-count: infinite, 1;
transition: all 0.3s;
opacity: 0.5;
transform: scale(1.1);
} }
code code
@@ -981,8 +1054,8 @@ const server = http.createServer((req, res) => {
<div class="header"> <div class="header">
<nav class="navbar sticky-top container"> <nav class="navbar sticky-top container">
<div class="navbar-brand"> <div class="navbar-brand">
<i class="fa-sharp-duotone fa-regular fa-tv" style="--fa-primary-color: rgb(255, 255, 255); --fa-secondary-color: rgb(255, 255, 255);" aria-hidden="true"></i> <i class="logo fa-sharp-duotone fa-regular fa-tv" style="--fa-primary-color: rgb(255, 255, 255); --fa-secondary-color: rgb(255, 255, 255);" aria-hidden="true"></i>
<a href="https://github.com/Aetherinox/thetvapp-docker">TVApp2 for Docker</a> <a class="header-name" href="https://github.com/Aetherinox/thetvapp-docker">TVApp2 for Docker</a>
</div> </div>
</nav> </nav>
</div> </div>
@@ -1070,9 +1143,9 @@ const server = http.createServer((req, res) => {
const warning = document.createElement("div"); const warning = document.createElement("div");
warning.innerHTML = "<p><span class='warning'>Warning</span> If you are accessing this page via 127.0.0.1 or localhost, proxying will not work on other devices.Please load \ warning.innerHTML = "<p><span class='warning'>Warning</span> If you are accessing this page via 127.0.0.1 or localhost, proxying will not work on other devices.Please load \
this page using your computer's IP address (e.g., 192.168.x.x) and port in order to access the playlist from other devices on your network.</p> \ this page using your computer's IP address (e.g., 192.168.x.x) and port in order to access the playlist from other devices on your network.</p> \
<p> How to locate IP address on <a href='https://youtube.com/watch?v=UAhDHXN2c6E' \ <br> \
target = '_blank' > Windows</a> or <a href='https://youtube.com/watch?v=gaIYP4TZfHI' \ <p> Learn how to locate your IP address on <a href='https://youtube.com/watch?v=UAhDHXN2c6E' target = '_blank' > Windows</a> or \
target = '_blank' > Linux</a>.</p>"; <a href='https://youtube.com/watch?v=gaIYP4TZfHI' target = '_blank' > Linux</a>.</p>";
document.getElementById("warning-localhost").appendChild(warning); document.getElementById("warning-localhost").appendChild(warning);
} else { } else {
@@ -1083,9 +1156,8 @@ const server = http.createServer((req, res) => {
document.addEventListener("DOMContentLoaded", function() document.addEventListener("DOMContentLoaded", function()
{ {
const port = window.location.port || (window.location.protocol === "https:" ? "443" : "80"); const port = window.location.port || (window.location.protocol === "https:" ? "443" : "80");
const warningMessage = "<p><span class='notice'>Notice</span> Port <strong> " + port + " </strong> must be open and allowed through your OS firewall settings \ const warningMessage = "<p><span class='notice'>Notice</span> Port <strong> " + port + " </strong> must be open and allowed through your <a href='https://youtu.be/zOZWlTplrcA?si=nGXrHKU4sAQsy18e&t=18 target='_blank'>Windows</a> \
(<a href='https://youtu.be/zOZWlTplrcA?si=nGXrHKU4sAQsy18e&t=18 target='_blank'>Windows</a> or \ or <a href='https://youtu.be/7c_V_3nWWbA?si=Hkd_II9myn-AkNnS&t=12' target='_blank'>Linux</a> OS firewall settings \
<a href='https://youtu.be/7c_V_3nWWbA?si=Hkd_II9myn-AkNnS&t=12' target='_blank'>Linux</a>). \
This action enables devices such as Firestick or Android to connect to the server and request the playlist through the proxy.</p>"; This action enables devices such as Firestick or Android to connect to the server and request the playlist through the proxy.</p>";
document.getElementById("warning-firewall").innerHTML = warningMessage; document.getElementById("warning-firewall").innerHTML = warningMessage;