popopoproooooogress

This commit is contained in:
sakrecoer 2025-06-29 19:58:26 +02:00
parent e4f28324a4
commit 5fef3124c3
6 changed files with 120 additions and 179 deletions

View file

@ -34,12 +34,14 @@ body {
#navigation { #navigation {
margin: auto;
position: fixed; position: fixed;
bottom: 20px; bottom: 20px;
left: 20px; left: 50%;
transform: translate(-50%);
overflow: hidden; overflow: hidden;
width: calc(100vw - 40px); width: calc(100vw - 40px);
max-width: 700px;
height: 100px; height: 100px;
box-shadow: 0 4px 15px rgba(0,0,0,.3); box-shadow: 0 4px 15px rgba(0,0,0,.3);
z-index: 1000; z-index: 1000;
@ -124,7 +126,7 @@ footer {
section { section {
padding: 10px;
} }
a { a {
@ -153,6 +155,40 @@ strong {
.section-headers { .section-headers {
border-radius: 100px; border-radius: 100px;
padding: 80px;
border-style: double;
border-color: purple;
border-width: 10px;
flex: 1 1 100% !important;
border-radius: 100px 100px 0 0;
}
.section-footers {
padding: 80px;
border-style: double;
border-color: purple;
border-width: 10px;
flex: 1 1 100% !important;
border-radius: 0 0 100px 100px;
}
.border {
border-style: double;
border-color: purple;
border-width: 10px;
margin: 4px 0 4px 0;
flex: 1 1 300px;
padding: 80px;
}
.button {
padding: 20px;
margin: 20px 0;
background-color: purple;
line-height: 5em;
border-radius: 300px;
} }
/* Screen size root */ /* Screen size root */

View file

@ -23,12 +23,12 @@ justify-content: space-between;
} }
p { p {
flex: 1 1 100%; flex: 1 1 100%;
font-size: .5em; font-size: .6em;
line-height: 1.75em; line-height: 1.75em;
max-width: 33vw; max-width: 33vw;
strong { strong {
font-size: 1.5em; font-size: 1.25em;
} }
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
@ -36,9 +36,12 @@ justify-content: space-between;
font-size: 8em; font-size: 8em;
} }
p { p {
font-size: 1em; font-size: .9em;
max-width: unset; max-width: unset;
} }
strong {
font-size: 1.5em;
}
} }
@ -74,15 +77,7 @@ justify-content: space-between;
overflow-y: hidden; overflow-y: hidden;
} }
.section-headers {
padding: 80px;
border-style: double;
border-color: purple;
border-width: 10px;
flex: 1 1 100%;
margin-top: 0;
}
} }
</style> </style>
@ -94,12 +89,15 @@ justify-content: space-between;
<article class="section-headers"> <article class="section-headers">
<h2>Discography</h2> <h2>Discography</h2>
<p><strong>The sound of freedom</strong><br /> <p><strong>The sound of freedom</strong><br />
The Basspistol catalogue is an aggregation of records from independent musicians. Getting your music from here implies 100% of your support is channeled straight to the artist. Basspistol discography is a non-possessive aggregation of cuts recoreded by independent musicians. Getting your music from here implies 100% of your support being channeled straight to the artist. (Minus whatever fees charged by the monetization service they leverage.)
<br /><br /> <br /><br />
They are not sorted by date or importance. Instead, every 30 minutes the order is reshuffled. You being here now, implies the random gods have something to tell you. The bellow selection is shuffled every 30 minutes. Anything pikcing your curiosity? The random gods may just have something to tell you...
<br /><br /> <br /><br />
<a href="https://shop.basspistol.com" style="text-decoration: underline;">Check out the Tienda for more information</a> <a href="https://shop.basspistol.com" style="text-decoration: underline;">Check out the Tienda for more information</a>
</p> </p>
<a class="button" href="https://shop.basspistol.com"s>𝕭𝖆𝖘𝖘𝖕𝖎𝖘𝖙𝖔𝖑 𝕿𝖎𝖊𝖓𝖉𝖆 🛖</a>
</article> </article>
@ -115,7 +113,7 @@ justify-content: space-between;
{{ with $data.channel.item }} {{ with $data.channel.item }}
{{ range . | shuffle }} {{ range . | shuffle | first 5 }}
<article> <article>
<a href="{{ .link }}" target="_blank"> <a href="{{ .link }}" target="_blank">
@ -127,7 +125,7 @@ justify-content: space-between;
<figcaption> <figcaption>
<p><strong>{{ .title }}</strong></p> <p><strong>{{ .title }}</strong></p>
<p>&nbsp;</p> <p>&nbsp;</p>
<p>{{ .description | transform.Plainify | safeHTML | truncate 256 }}</p> <p>{{ .description | transform.Plainify | safeHTML | truncate 120 }}</p>
</figcaption> </figcaption>
</figure> </figure>
@ -140,5 +138,5 @@ justify-content: space-between;
<!--<pre>{{ debug.Dump $data }}</pre>--> <!--<pre>{{ debug.Dump $data }}</pre>-->
<article class="section-footers"></article>
</section> </section>

View file

@ -32,12 +32,12 @@
} }
p { p {
flex: 1 1 100%; flex: 1 1 100%;
font-size: .5em; font-size: .6em;
line-height: 1.75em; line-height: 1.75em;
max-width: 33vw; max-width: 33vw;
strong { strong {
font-size: 1.5em; font-size: 1.25em;
} }
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
@ -45,9 +45,12 @@
font-size: 8em; font-size: 8em;
} }
p { p {
font-size: 1em; font-size: .9em;
max-width: unset; max-width: unset;
} }
strong {
font-size: 1.5em;
}
} }
@ -94,26 +97,11 @@
text-transform: lowercase; text-transform: lowercase;
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
figcaption { figcaption {
font-size: 7em; font-size: 7em;
line-height: 0.35em; line-height: 0.35em;
} }
}
.section-headers {
padding: 80px;
border-style: double;
border-color: purple;
border-width: 10px;
flex: 1 1 300px;
margin-top: 0;
} }
.border {
border-color: purple;
padding: 40px;
width: 100%;
}
} }
</style> </style>
@ -121,16 +109,16 @@
<section id="gancio"> <section id="gancio">
<article class="section-headers"> <article class="section-headers">
<h2>Agenda</h2> <h2>Agenda</h2>
<p><strong>World-wide events you never hear about.</strong> <br /> <p><strong>Outnernational events</strong> <br />
Through the power of federation, we aggregate event data from the deep-web to keep you in the loop of what's happening below the radars. Through the power of federation, we aggregate event data from the deep-web to keep you in the loop of what's happening below the radars.
<br /><br /> <br /><br />
Want your event featured here? <a href="https://do.basspistol.org/add" target="_blank">Head over to this page</a>. No account required.</p> Want your event featured here? <a href="https://do.basspistol.org/add" target="_blank">Head over to this page</a>. No account required.</p>
</article> </article>
<div class="border"> <div >
<script src="https://do.basspistol.org/gancio-events.es.js"></script> <script src="https://do.basspistol.org/gancio-events.es.js"></script>
<gancio-events baseurl="https://do.basspistol.org" collection="Music" show_recurrent="true" maxlength=7 sidebar="false" theme="dark"></gancio-events> <gancio-events baseurl="https://do.basspistol.org" collection="Music" show_recurrent="true" maxlength=7 sidebar="false" theme="dark"></gancio-events>
</div> </div>
<article class="section-footers"></article>
</section> </section>

View file

@ -33,12 +33,12 @@
p { p {
flex: 1 1 100%; flex: 1 1 100%;
font-size: .5em; font-size: .6em;
line-height: 1.75em; line-height: 1.75em;
max-width: 33vw; max-width: 33vw;
strong { strong {
font-size: 1.5em; font-size: 1.25em;
} }
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
@ -46,9 +46,12 @@
font-size: 8em; font-size: 8em;
} }
p { p {
font-size: 1em; font-size: .9em;
max-width: unset; max-width: unset;
} }
strong {
font-size: 1.5em;
}
} }
@ -65,7 +68,7 @@
object-fit: cover; object-fit: cover;
width: 96px; width: 96px;
flex: 0 0 96px; flex: 0 0 96px;
max-height: 300px; max-height: 96px;
} }
figcaption { figcaption {
@ -84,17 +87,9 @@
margin-bottom: 4px; margin-bottom: 4px;
text-transform: lowercase; text-transform: lowercase;
}
} }
.section-headers {
padding: 80px;
border-style: double;
border-color: purple;
border-width: 10px;
flex: 1 1 100%;
margin-top: 0;
} }
} }
</style> </style>
@ -144,5 +139,5 @@
<!-- <pre>{{ debug.Dump $monsters }}</pre>--> <!-- <pre>{{ debug.Dump $monsters }}</pre>-->
{{ end }} {{ end }}
<article class="section-footers">
</section> </section>

View file

@ -35,6 +35,7 @@
flex: 0 0 125px; flex: 0 0 125px;
height: 125px; height: 125px;
margin-bottom: 10px; margin-bottom: 10px;
} }
.cartouche > p { .cartouche > p {
flex: 1 1 100px; flex: 1 1 100px;
@ -52,27 +53,26 @@
line-height: 1em; line-height: 1em;
flex: 1 1 100%; flex: 1 1 100%;
} }
p { p {
font-size: .5em;
flex: 1 1 100%; flex: 1 1 100%;
line-height: 1em; font-size: .6em;
line-height: 1.75em;
max-width: 33vw;
strong { strong {
font-size: 1.5em; font-size: 1.25em;
line-height: 1em;
}
} }
}
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
h2 { h2 {
font-size: 8em; font-size: 8em;
} }
p { p {
font-size: .9em; font-size: .9em;
max-width: unset;
} }
strong { strong {
font-size: 1em; font-size: 1.5em;
line-height: 1em;
} }
} }
@ -87,7 +87,6 @@
background-position: center center; background-position: center center;
background-image: linear-gradient(to bottom, rgba(245, 246, 252, 0), rgba(117, 19, 93, 0)); background-image: linear-gradient(to bottom, rgba(245, 246, 252, 0), rgba(117, 19, 93, 0));
} }
.peertubes:hover { .peertubes:hover {
background-size: cover; background-size: cover;
@ -95,34 +94,32 @@
linear-gradient(to bottom, rgba(245, 246, 252, 0), rgba(117, 19, 93, 0)), linear-gradient(to bottom, rgba(245, 246, 252, 0), rgba(117, 19, 93, 0)),
} }
.section-headers { .substance {
flex: 1 1 300px; position: relative;
display: flex; display: flex;
max-width: 33vw; flex-wrap: wrap;
flex: 1 1 300px;
} }
.section
} }
.substance {
position: relative;
display: flex;
flex-wrap: wrap;
flex: 1 1 300px;
}
</style> </style>
{{ $data := dict }} {{ $data := dict }}
{{ $url := "https://v.basspistol.org/api/v1/video-playlists/tubcTiUQaJ29JxeCzRqvUc/videos?count=100" }} {{ $url := "https://v.basspistol.org/api/v1/video-playlists/tubcTiUQaJ29JxeCzRqvUc/videos?count=100" }}
<section id="peertube"> <section id="peertube">
<div class="section-header"> <article class="section-headers">
<h2>BassTube</h2> <h2>BassTube</h2>
<p> <p>
<strong>Videos from the deepweb.</strong> <strong>Videos from the deepweb.</strong>
<br />Decentralized, peer-to-peer, for the people! <br />Decentralized, peer-to-peer, for the people! All you saw was sound!
<br />All you saw was sound!
<br /><br />
Basspistol facilitates <a href="https://v.basspistol.org" style="text-decoration: underline;">a Peertube instance</a>, tapping into a large network of independent and sovereign creators from the deepweb. As always, what you see is determined every 20 minute, by the random gods.
</p> </p>
</div> </article>
<div class="substance">
{{ with try (resources.GetRemote $url) }} {{ with try (resources.GetRemote $url) }}
{{ with .Err }} {{ with .Err }}
{{ errorf "%s" . }} {{ errorf "%s" . }}
@ -139,70 +136,16 @@
<article class="peertubes" style="background-image:linear-gradient(to bottom, rgba(128, 0, 128, .5), rgba(128, 0, 128, 1)),url(https://v.basspistol.org{{ .video.previewPath }})"> <article class="peertubes" style="background-image:linear-gradient(to bottom, rgba(128, 0, 128, .5), rgba(128, 0, 128, 1)),url(https://v.basspistol.org{{ .video.previewPath }})">
<div class="cartouche"> <div class="cartouche">
<a href="{{ .video.url }}" target="_blank"> <a href="{{ .video.url }}" target="_blank">
<svg <svg version="1.1" viewBox="0 0 127 127" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><clipPath id="clipPath2"><circle cx="63.5" cy="63.5" r="63.5" fill="purple" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" style="paint-order:stroke fill markers"/></clipPath></defs><circle cx="63.5" cy="63.5" r="63.5" fill="purple" opacity=".75" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" style="paint-order:stroke fill markers"/><image width="127" height="127" clip-path="url(#clipPath2)" preserveAspectRatio="none"
version="1.1"
viewBox="0 0 57.679166 57.67917" {{ range .video.account.avatars }}
id="svg2" {{ if eq .fileUrl nil }}xlink:href="https://v.basspistol.org/client/assets/images/logo.svg"{{ else }}xlink:href="{{ .fileUrl }}"{{ end }}
xml:space="preserve" {{ end }}
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg" /><path d="m50.524 40.207c-2.9584-1.4787-6.4358 0.68528-6.4159 3.9925l0.23235 38.269c0.02025 3.2837 3.4786 5.4067 6.4159 3.9385l38.153-19.077c3.2655-1.6346 3.2655-6.2949 0-7.9294z" fill="orange" stop-color="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width=".83778" style="paint-order:stroke fill markers"/></svg>
xmlns:svg="http://www.w3.org/2000/svg"><defs
id="defs2"><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath2"><path
d="M 58.028369,28.839501 A 28.839999,28.839999 0 0 1 29.188368,57.6795 28.839999,28.839999 0 0 1 0.34836804,28.839501 28.839999,28.839999 0 0 1 29.188368,-4.9957302e-4 28.839999,28.839999 0 0 1 58.028369,28.839501 Z"
fill="purple"
stroke-width="4.83809"
style="stroke-linecap:round;stroke-linejoin:round;paint-order:markers stroke fill"
id="path3" /></clipPath><filter
style="color-interpolation-filters:sRGB"
id="filter25"
x="-0.64945344"
y="-0.51138139"
width="2.2988969"
height="2.0227628"><feFlood
result="flood"
in="SourceGraphic"
flood-opacity="1.000000"
flood-color="rgb(0,0,0)"
id="feFlood24" /><feGaussianBlur
result="blur"
in="SourceGraphic"
stdDeviation="3.300000"
id="feGaussianBlur24" /><feOffset
result="offset"
in="blur"
dx="0.000000"
dy="0.000000"
id="feOffset24" /><feComposite
result="comp1"
operator="in"
in="flood"
in2="offset"
id="feComposite24" /><feComposite
result="comp2"
operator="over"
in="SourceGraphic"
in2="comp1"
id="feComposite25" /></filter></defs><image
width="58.376736"
height="57.679001"
preserveAspectRatio="none"
{{ range .video.channel.avatars | first 1 }}
{{ if .fileUrl }}xlink:href="{{ .fileUrl }}"{{ else }}xlink:href="https://v.basspistol.org/client/assets/images/logo.svg"{{ end }}
{{ end }}
id="image1"
x="0"
y="0"
clip-path="url(#clipPath2)"
transform="matrix(0.9999855,0,0,1.0000029,-0.34836299,0)" /><path
d="m 23.067499,19.43 14.82,9.4106 -14.82,9.4105 z"
fill="orange"
stroke="none"
stroke-width="3.4098"
style="fill:orange;fill-opacity:1;stroke:orange;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:1;paint-order:stroke fill markers;filter:url(#filter25)"
id="path2" />
</svg> </svg>
</a> </a>
<div> <div>
@ -214,7 +157,7 @@
</article> </article>
{{ end }} {{ end }}
<!-- <pre>{{ debug.Dump $data }}</pre>--> <!-- <pre>{{ debug.Dump $data }}</pre>-->
{{ end }} {{ end }}
</div> <article class="section-footers"></article>
</section> </section>

View file

@ -21,12 +21,12 @@
} }
p { p {
flex: 1 1 100%; flex: 1 1 100%;
font-size: .5em; font-size: .6em;
line-height: 1.75em; line-height: 1.75em;
max-width: 33vw; max-width: 33vw;
strong { strong {
font-size: 1.5em; font-size: 1.25em;
} }
} }
@media screen and (max-width: 1024px) { @media screen and (max-width: 1024px) {
@ -34,28 +34,14 @@
font-size: 8em; font-size: 8em;
} }
p { p {
font-size: 1em; font-size: .9em;
max-width: unset; max-width: unset;
} }
strong {
font-size: 1.5em;
}
} }
.border {
border-style: double;
border-color: purple;
border-width: 10px;
margin: 2px 1px 2px 1px;
flex: 1 1 300px;
padding: 80px;
}
.section-headers {
padding: 80px;
border-style: double;
border-color: purple;
border-width: 10px;
flex: 1 1 300px;
margin: 2px 1px 2px 1px;
}
} }
</style> </style>
@ -64,18 +50,13 @@
<section id="radio"> <section id="radio">
<article class="section-headers"> <article class="section-headers">
<h2>RadioStation</h2> <h2>RadioStation</h2>
<p><strong>Basspistol Radio Station! </strong><br />777% without commercials! RobotDJ-sets and live interventions! This is the sound of freedom.</p> <p><strong>Basspistol Radio Station! </strong><br />777% music, without commercials! RobotDJ-sets and live interventions! This is the sound of freedom.</p>
</article> </article>
<div class="border"> <div class="border">
<iframe src="https://radio.basspistol.com/public/basspistol/embed?theme=dark" frameborder="0" allowtransparency="true" style="width: 100%; min-height: 150px; border: 0;"></iframe> <iframe src="https://radio.basspistol.com/public/basspistol/embed?theme=dark" frameborder="0" allowtransparency="true" style="width: 100%; min-height: 150px; border: 0;"></iframe>
<iframe src="https://radio.basspistol.com/public/basspistol/history?theme=dark" frameborder="0" allowtransparency="true" style="width: 100%; min-height: 480px; border: 0;"></iframe> <iframe src="https://radio.basspistol.com/public/basspistol/history?theme=dark" frameborder="0" allowtransparency="true" style="width: 100%; min-height: 480px; border: 0;"></iframe>
</div> </div>
<!-- <div class="border"> <article class="section-footers"></article>
<h2>REWIND</h2>
<p>Request a banger! Strictly for the conaisseurs!</p>
<iframe src="https://radio.basspistol.com/public/basspistol/embed-requests?theme=dark" frameborder="0" allowtransparency="true" style="width: 100%; min-height: 950px; border: 0;"></iframe>
</div>-->
<!-- <div class="border">
<iframe src="https://radio.basspistol.com/public/basspistol/schedule/embed?theme=dark" frameborder="0" allowtransparency="true" style="width: 100%; min-height: 1280px; border: 0;"></iframe>
</div>-->
</section> </section>