Bubbens-Organisation/qwik-site-bubben
Bubbens-Organisation/qwik-site-bubben
1
0
Fork 0
forked from qwik/qwik-site
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed CSS for onion links.

Browse Source
This commit is contained in:
BurnyLlama 2022-08-13 23:58:55 +02:00
parent b936007242
commit b71df99264
2 changed files with 60 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
assets/css/landing.css
View File

@ -115,7 +115,13 @@ body {
margin-bottom: auto; margin-bottom: auto;
} }
.card > a { .buttons {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.buttons > a {
color: var(--primary); color: var(--primary);
background-color: transparent; background-color: transparent;
@ -123,7 +129,7 @@ body {
border-radius: .5rem; border-radius: .5rem;
/* box-shadow: 0 -5rem 20rem transparent; */ /* box-shadow: 0 -5rem 20rem transparent; */
margin: 1rem 0 .5rem 0; margin: 1rem .5rem .5rem .5rem;
padding: .5rem 1.5rem; padding: .5rem 1.5rem;
display: block; display: block;
@ -134,13 +140,27 @@ body {
transition: color .3s, background-color .3s, box-shadow .3s; transition: color .3s, background-color .3s, box-shadow .3s;
} }
.card > a:hover, .buttons > a:hover,
.card > a:focus { .buttons > a:focus {
color: var(--surface); color: var(--surface);
background-color: var(--primary); background-color: var(--primary);
/* box-shadow: 0 .25rem 2rem var(--primary); */ /* box-shadow: 0 .25rem 2rem var(--primary); */
} }
.buttons > a.tor {
color: var(--purple);
border-color: var(--purple);
padding: .5rem 1rem;
}
.buttons > a.tor:hover,
.buttons > a.tor:focus {
color: var(--surface);
background-color: var(--purple);
/* box-shadow: 0 .25rem 2rem var(--primary); */
}
.text-box { .text-box {
margin: 1rem; margin: 1rem;
} }

54
content/pages/index.njk
View File

@ -32,8 +32,10 @@
<p> <p>
Nitter is a Twitter frontend. Use it to browse Twitter without getting tracked. Nitter is a Twitter frontend. Use it to browse Twitter without getting tracked.
</p> </p>
<a href="https://nitter.qwik.space">BROWSE</a> <div class="buttons">
<a href="http://qwikxx2erhx6qrymued6ox2qkf2yeogjwypqvzoif4fqkljixasr6oid.onion">Tor</a> <a href="https://nitter.qwik.space">BROWSE</a>
<a class="tor" href="http://qwikxx2erhx6qrymued6ox2qkf2yeogjwypqvzoif4fqkljixasr6oid.onion">TOR</a>
</div>
</div> </div>
<div class="card"> <div class="card">
@ -41,8 +43,10 @@
<p> <p>
Bibliogram is an Instagram frontend. Use it to browse Instagram without getting tracked. Bibliogram is an Instagram frontend. Use it to browse Instagram without getting tracked.
</p> </p>
<a href="https://bibliogram.qwik.space">BROWSE</a> <div class="buttons">
<a href="http://qwikxx2erhx6qrymued6ox2qkf2yeogjwypqvzoif4fqkljixasr6oid.onion">Tor</a> <a href="https://bibliogram.qwik.space">BROWSE</a>
<a class="tor" href="http://qwikxx2erhx6qrymued6ox2qkf2yeogjwypqvzoif4fqkljixasr6oid.onion">TOR</a>
</div>
</div> </div>
<div class="card"> <div class="card">
@ -50,8 +54,10 @@
<p> <p>
Libreddit is a Reddit frontend. Use it to browse Reddit without getting tracked. Libreddit is a Reddit frontend. Use it to browse Reddit without getting tracked.
</p> </p>
<a href="https://libreddit.qwik.space">BROWSE</a> <div class="buttons">
<a href="http://qwikxx4xqvhdyyazkrw7pwdpdppfnmn7j2n6cvq5zecm4atbppaslzad.onion">Tor</a> <a href="https://libreddit.qwik.space">BROWSE</a>
<a class="tor" href="http://qwikxx4xqvhdyyazkrw7pwdpdppfnmn7j2n6cvq5zecm4atbppaslzad.onion">TOR</a>
</div>
</div> </div>
<div class="card"> <div class="card">
@ -59,8 +65,10 @@
<p> <p>
Invidious is a YouTube frontend. Use it to browse YouTube without getting tracked. Invidious is a YouTube frontend. Use it to browse YouTube without getting tracked.
</p> </p>
<a href="https://invidious.qwik.space">WATCH</a> <div class="buttons">
<a href="http://qwikxxt6jvggxzxe2v2fuzro5j7ibgphxmblmri6wkj5vpicdbo2kwad.onion">TOR</a> <a href="https://invidious.qwik.space">WATCH</a>
<a class="tor" href="http://qwikxxt6jvggxzxe2v2fuzro5j7ibgphxmblmri6wkj5vpicdbo2kwad.onion">TOR</a>
</div>
</div> </div>
</div> </div>
@ -72,8 +80,8 @@
SERVICES SERVICES
</h1> </h1>
<p> <p>
These services requires an account, which you can create <a href="https://qam.qwik.space">here</a> These services requires an account, which you can create at <a href="https://qam.qwik.space">qam.qwik.space</a>
[<a href="http://qwikooa6o5xx4xit4c7vubkqqaq4jj43z3zco6c3gfk6m7f43jxpleid.onion">Tor</a>]. (<a class="tor" href="http://qwikooa6o5xx4xit4c7vubkqqaq4jj43z3zco6c3gfk6m7f43jxpleid.onion">Tor</a>).
</p> </p>
<div class="card"> <div class="card">
<h2>Gitea</h2> <h2>Gitea</h2>
@ -81,8 +89,10 @@
Gitea is an alternative to Github, Gitlab, etc. Gitea is an alternative to Github, Gitlab, etc.
We host our own instance, but feel free to use it as well (if you're brave enough). We host our own instance, but feel free to use it as well (if you're brave enough).
</p> </p>
<a href="https://git.qwik.space">CODE</a> <div class="buttons">
<a href="http://qwikoob2jgyfaqsgenwvma4h3z44gei7a6ou7zcwd4c2mhuerakrywqd.onion">TOR</a> <a href="https://git.qwik.space">CODE</a>
<a class="tor" href="http://qwikoob2jgyfaqsgenwvma4h3z44gei7a6ou7zcwd4c2mhuerakrywqd.onion">TOR</a>
</div>
</div> </div>
<div class="card"> <div class="card">
@ -90,7 +100,9 @@
<p> <p>
XMPP is an instant messaging protocol. You can find more info in the article below. XMPP is an instant messaging protocol. You can find more info in the article below.
</p> </p>
<a href="/articles/xmpp/intro">READ MORE</a> <div class="buttons">
<a href="/articles/xmpp/intro">READ MORE</a>
</div>
</div> </div>
<div class="card"> <div class="card">
@ -99,7 +111,9 @@
Zulip is a chat service. The UI <i>somewhat</i> resembles Discord. Zulip is a chat service. The UI <i>somewhat</i> resembles Discord.
It is quite advanced/bloated and we might switch it out for something else. It is quite advanced/bloated and we might switch it out for something else.
</p> </p>
<a href="https://chat.qwik.space">CHAT</a> <div class="buttons">
<a href="https://chat.qwik.space">CHAT</a>
</div>
</div> </div>
<div class="card"> <div class="card">
@ -107,7 +121,9 @@
<p> <p>
Hedgedoc is an online markdown editor featuring real-time collaboration. Hedgedoc is an online markdown editor featuring real-time collaboration.
</p> </p>
<a href="https://docs.qwik.space">WRITE</a> <div class="buttons">
<a href="https://docs.qwik.space">WRITE</a>
</div>
</div> </div>
<div class="card"> <div class="card">
@ -115,7 +131,9 @@
<p> <p>
We run an instance of CryptPad. As of now, accounts are supplied as per request. See contact options below. We run an instance of CryptPad. As of now, accounts are supplied as per request. See contact options below.
</p> </p>
<a href="https://pad.qwik.space">WRITE</a> <div class="buttons">
<a href="https://pad.qwik.space">WRITE</a>
</div>
</div> </div>
</div> </div>
@ -143,7 +161,7 @@
<p>burnyllama [at] protonmail [dot] com</p> <p>burnyllama [at] protonmail [dot] com</p>
</div> </div>
<p style=" margin: .5rem .2rem 0 .2rem;">You can read about news for qwik.space, rants, and other stuffs over at my <a style="font-size: inherit;" href="https://blog.qwik.space">blog</a> [<a href="http://qwikoov6bmdskhp5o32d2ju6nntwhpdhcrjnllajdryq5gvxfamgffqd.onion">Tor</a>].</p> <p style=" margin: .5rem .2rem 0 .2rem;">You can read about news for qwik.space, rants, and other stuffs over at my <a style="font-size: inherit;" href="https://blog.qwik.space">blog</a> [<a class="tor" href="http://qwikoov6bmdskhp5o32d2ju6nntwhpdhcrjnllajdryq5gvxfamgffqd.onion">Tor</a>].</p>
</div> </div>
<div class="card maintainer"> <div class="card maintainer">
<h2>furo</h2> <h2>furo</h2>
@ -183,7 +201,7 @@
If you want to contribute, feel free to <a href="#contact">contact us</a>. If you want to contribute, feel free to <a href="#contact">contact us</a>.
</p> </p>
<p class="footer-header"><a href="http://qwikxxeiw4kgmml6vjw2bsxtviuwjce735dunai2djhu6q7qbacq73id.onion">Visit us on TOR</a></p> <p class="footer-header"><a class="tor" href="http://qwikxxeiw4kgmml6vjw2bsxtviuwjce735dunai2djhu6q7qbacq73id.onion">Visit us on TOR!</a></p>
</div> </div>
</body> </body>
</html> </html>