style tweaks

This commit is contained in:
dreamer 2026-03-26 16:15:24 +01:00
parent 3165996d6e
commit cc62a54571
4 changed files with 216 additions and 79 deletions

View File

@ -11,6 +11,7 @@
.h1
{
font-family: Helvetica;
font-size: 16px;
color: var(--ifm-white);
padding-top: 5px;
padding-bottom: 5px;
@ -22,9 +23,9 @@
.p
{
font-family: Helvetica;
font-size: 6px;
color: var(--ifm-grey);
margin-bottom: 45px;
font-size: 10px;
}
.href
@ -37,7 +38,7 @@
{
line-height: 16px;
font-weight: 600;
font-size: 14px;
font-size: 10px;
margin-bottom: 0;
margin-top: 0;
font-family: Helvetica;
@ -49,7 +50,7 @@
color: var(--ifm-grey);
line-height: 1.6em;
font-weight: 600;
font-size: 14px;
font-size: 10px;
text-decoration: none;
background: var(--ifm-deep-black);
display: inline-flex;
@ -61,19 +62,13 @@
.amixlink:hover
{
font-family: Helvetica;
color: #000;
line-height: 1.6em;
font-weight: 600;
font-size: 14px;
background: var(--ifm-red);
}
.body
{
width: 80%;
padding-left: 10%;
padding-right: 10%;
width: 100%;
background-color: var(--ifm-black);
}
@ -81,7 +76,7 @@
{
font-family: Helvetica;
font-weight: 900;
font-size: 16px;
font-size: 12px;
color: var(--ifm-grey);
padding: 5px;
margin-top: 2%;
@ -93,7 +88,7 @@
.prclogo
{
width: 1440px;
height: 120px;
padding-bottom: 10px;
padding-left: 10px;
padding-top: 10px;
@ -112,7 +107,7 @@
.header
{
width: 100%;
max-height: 220px;
max-height: 120px;
}
.footer
@ -124,14 +119,6 @@
clear: both;
}
.djsection
{
font-family: Helvetica;
font-size: 18px;
text-decoration: inherit;
color: var(--ifm-red);
}
.djsectionmenu
{
font-family: Helvetica;
@ -156,15 +143,9 @@
.djsection
{
font-family: Helvetica;
font-size: 33px;
font-size: 18px;
text-decoration: inherit;
color: var(--ifm-red);
line-height: 1em;
margin-bottom: 0px;
margin-top: 0px;
padding-top: 5px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 5px;
}
.djsection:hover
@ -176,7 +157,7 @@
{
font-family: Helvetica;
color: var(--ifm-red);
font-size: 24px;
font-size: 16px;
padding-top: 5px;
border-bottom: 2px solid var(--ifm-red);
}
@ -232,10 +213,7 @@
padding-right: 5%;
width: 40%;
}
.h2
{
font-size: 14px;
}
.footer
{
margin-top: 15%;
@ -323,6 +301,12 @@
column-count: 1;
}
}
.content
{
width: 80%;
padding-left: 10%;
padding-right: 10%;
}
.latest
{
@ -361,10 +345,105 @@
}
}
@media (max-width:767px)
{
.h1mobile
@media screen and (min-width: 600px) {
.h1{
font-size: 18px;
}
.p
{
font-size: 8px;
}
.mixlink
{
font-size: 12px;
}
.amixlink
{
font-size: 12px;
}
.mixsections
{
font-size: 14px;
}
.h2
{
font-size: 18px;
}
.header
{
max-height: 180px;
}
.prclogo
{
height: 180px;
}
.djsectionmenu
{
font-size: 25px;
}
.djsection
{
font-size: 28px;
}
}
@media screen and (min-width: 768px) {
.h1{
font-size: 26px;
}
.p
{
font-size: 10px;
}
.mixlink
{
font-size: 14px;
}
.amixlink
{
font-size: 14px;
}
.mixsections
{
font-size: 16px;
}
.h2
{
font-size: 24px;
}
.header
{
max-height: 220px;
}
.prclogo
{
height: 220px;
}
.djsectionmenu
{
font-size: 33px;
}
.djsection
{
font-size: 33px;
}
}

View File

@ -16,6 +16,7 @@
.h1
{
font-family: ArcadeFont;
font-size: 16px;
color: var(--ifm-red);
border-top: 3px solid var(--ifm-red);
border-bottom: 3px solid var(--ifm-red);
@ -29,9 +30,9 @@
.p
{
font-family: ArcadeFont;
font-size: 6px;
color: var(--ifm-grey);
margin-bottom: 45px;
font-size: 10px;
}
.href
@ -44,7 +45,7 @@
{
line-height: 16px;
font-weight: 600;
font-size: 14px;
font-size: 10px;
margin-bottom: 0;
margin-top: 0;
font-family: ArcadeFont;
@ -56,7 +57,7 @@
color: var(--ifm-grey);
line-height: 1.6em;
font-weight: 600;
font-size: 14px;
font-size: 10px;
text-decoration: none;
background: var(--ifm-deep-black);
display: inline-flex;
@ -68,11 +69,7 @@
.amixlink:hover
{
font-family: ArcadeFont;
color: #000;
line-height: 1.6em;
font-weight: 600;
font-size: 14px;
background: var(--ifm-red);
}
@ -88,7 +85,7 @@
{
font-family: ArcadeFont;
font-weight: 900;
font-size: 16px;
font-size: 12px;
color: var(--ifm-grey);
padding: 5px;
margin-top: 2%;
@ -109,7 +106,7 @@
.h2
{
font-family: ArcadeFont;
font-size: 24px;
font-size: 16px;
color: var(--ifm-grey);
font-weight: 200;
border-bottom: 2px solid var(--ifm-grey);
@ -132,18 +129,10 @@
clear: both;
}
.djsection
{
font-family: ArcadeFont;
font-size: 18px;
text-decoration: inherit;
color: var(--ifm-red);
}
.djsectionmenu
{
font-family: ArcadeFont;
font-size: 33px;
font-size: 18px;
color: var(--ifm-red);
line-height: 1em;
z-index: 100;
@ -164,15 +153,9 @@
.djsection
{
font-family: ArcadeFont;
font-size: 33px;
font-size: 18px;
text-decoration: inherit;
color: var(--ifm-red);
line-height: 1em;
margin-bottom: 0px;
margin-top: 0px;
padding-top: 5px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 5px;
}
.djsection:hover
@ -184,7 +167,7 @@
{
font-family: ArcadeFont;
color: var(--ifm-red);
font-size: 24px;
font-size: 16px;
padding-top: 5px;
border-bottom: 2px solid var(--ifm-red);
}
@ -240,10 +223,7 @@
padding-right: 5%;
width: 40%;
}
.h2
{
font-size: 14px;
}
.footer
{
margin-top: 15%;
@ -369,10 +349,85 @@
}
}
@media (max-width:767px)
{
.h1mobile
@media screen and (min-width: 600px) {
.h1{
font-size: 18px;
}
.p
{
font-size: 8px;
}
.mixlink
{
font-size: 12px;
}
.amixlink
{
font-size: 12px;
}
.mixsections
{
font-size: 14px;
}
.h2
{
font-size: 18px;
}
.djsectionmenu
{
font-size: 25px;
}
.djsection
{
font-size: 28px;
}
}
@media screen and (min-width: 768px) {
.h1{
font-size: 26px;
}
.p
{
font-size: 10px;
}
.mixlink
{
font-size: 14px;
}
.amixlink
{
font-size: 14px;
}
.mixsections
{
font-size: 16px;
}
.h2
{
font-size: 24px;
}
.djsectionmenu
{
font-size: 33px;
}
.djsection
{
font-size: 33px;
}
}

View File

@ -19,7 +19,7 @@
<header class="header">
<a href="/"><img src="/static/<%= titles['header'] %>" alt="videohotmix logo" class="hotmixlogo"/></a>
</header>
<h1 class="h1 h1mobile">Tons Of Mix - Downloads & Streams (right click + Save link as... for downloads)<br>
<h1 class="h1">Tons Of Mix - Downloads & Streams (right click + Save link as... for downloads)<br>
<%= titles.name %><br>
Sharing <%= total[0] %> files</h1>

View File

@ -15,18 +15,20 @@
<header class="header">
<a href="/"><img src="/static/<%= titles['header'] %>" alt="prc logo" class="prclogo"/></a>
</header>
<h1 class="h1 h1mobile">Tons Of Mix - Downloads & Streams (right click + Save link as... for downloads)<br>
<div class="content">
<h1 class="h1">Tons Of Mix - Downloads & Streams (right click + Save link as... for downloads)<br>
<%= titles.name %><br>
Sharing <%= total[0] %> files
</h1>
<img src="/static/panamaracing.club_divider.png">
</div>
<img style="padding-bottom: 10px; padding-left: 10px; padding-top: 10px;" src="/static/panamaracing.club_divider.png">
<div class="content">
<% content_for("inner") %>
</div>
<img style="padding-bottom: 10px; padding-left: 10px; padding-top: 10px;" src="/static/panamaracing.club_divider.png">
<div class="content">
<section class="latest">
<div class="latest_files">
<br>
<br>
<h1 class="h1">Latest uploads:</h1>
<% for i, file in ipairs(latestpath) do %>
<a class="amixlink" href="<%= '/data/' .. titles.url .. '/' .. file:gsub("#", "%%23") %>">
@ -36,6 +38,7 @@
<% end %>
</div>
</section>
</div>
<img style="padding-bottom: 10px; padding-left: 10px; padding-top: 10px;" src="/static/panamaracing.club_divider.png">
</body>
</html>