add cards
This commit is contained in:
Amolith
parent
6c4e8fd09a
commit
dbdec6b313
GPG Key ID:
51FD40936DB0065B
|
|
@ -100,23 +100,40 @@ img {
|
|||
display: block;
|
||||
max-width: 100%;
|
||||
}
|
||||
.flex-cards {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background-color: #333333;
|
||||
|
||||
}
|
||||
.flex-container > div {
|
||||
width: 100%;
|
||||
margin: 10px;
|
||||
}
|
||||
.card {
|
||||
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
|
||||
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);
|
||||
margin: 5px;
|
||||
transition: 0.3s;
|
||||
border-radius: 5px;
|
||||
width: 30%;
|
||||
background: grey;
|
||||
font-size: 1em;
|
||||
background: #4f4f4fff;
|
||||
padding: 15px;
|
||||
font-size: 15px;
|
||||
text-align: center;
|
||||
}
|
||||
div.card p {
|
||||
font-size: 17px;
|
||||
text-align: left;
|
||||
line-height: 27px;
|
||||
}
|
||||
.card:hover {
|
||||
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
|
||||
box-shadow: 0 12px 20px 0 rgba(0,0,0,0.5);
|
||||
}
|
||||
.button {
|
||||
border-radius: 8px;
|
||||
border: 0px;
|
||||
color: #4f4f4fff;
|
||||
background-color: white;
|
||||
color: #333333;
|
||||
padding: 16px 32px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
|
|
@ -126,9 +143,10 @@ img {
|
|||
-webkit-transition-duration: 0.4s;
|
||||
transition-duration: 0.4s;
|
||||
cursor: pointer;
|
||||
border: 2px solid #fff;
|
||||
}
|
||||
.button:hover {
|
||||
background-color: #6E827D;
|
||||
background-color: #4f4f4fff;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
blockquote {
|
||||
|
|
|
|||
55
index.html
55
index.html
|
|
@ -7,11 +7,52 @@ priority: 0.9
|
|||
---
|
||||
<style>
|
||||
</style>
|
||||
<center><p>I host a variety of services that are available for anyone to use for free. Below is a list of with descriptions of each.</p></center>
|
||||
<div class="card">
|
||||
<div class="container">
|
||||
<h1><b>Seafile</b></h1>
|
||||
<p>Seafile is a file syncronisation service. Users upload their files to a central server and they are synced back to their mobile phone or desktop.</p>
|
||||
<center><a href="https://sea.nixnet.xyz" target="_blank"><button class="button">Upload now</button></a></center>
|
||||
</div>
|
||||
<center><p>I host a variety of services that are available for anyone to use free of charge. Below is a list with descriptions of each.</p></center>
|
||||
|
||||
<div class="flex-cards">
|
||||
<div class="card">
|
||||
<div class="container">
|
||||
<h1><b>NixNet Chat</b></h1>
|
||||
<p>NixNet Chat is built on Rocket.Chat, an enterprise-grade real time chat application. Use this for communicating with other users and getting support for NixNet services.</p>
|
||||
<a href="https://chat.nixnet.xyz" target="_blank"><button class="button">Register!</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="container">
|
||||
<h1><b>Mumble</b></h1>
|
||||
<p>Mumble is an open source, low-latency, high quality voice chat software primarily intended for use while gaming. It's also great for private calls between yourself and others.</p>
|
||||
<a href="https://sea.nixnet.xyz" target="_blank"><button class="button">Chat!</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="container">
|
||||
<h1><b>Gitea</b></h1>
|
||||
<p>Gitea is a simple, easy-to-use and yet full-featured, self-hosted code hosting solution. Users can host 2 GB of code by default and more upon request (I don't have much storage 😢).</p>
|
||||
<a href="https://git.nixnet.xyz" target="_blank"><button class="button">Code!</button></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-cards">
|
||||
<div class="card">
|
||||
<div class="container">
|
||||
<h1><b>CodiMD</b></h1>
|
||||
<p>CodiMD is an application that allows users to collaborate in real time on markdown documents and presentations. Perfect for quick and easy slideshows and documentation.</p>
|
||||
<a href="https://nixnet.xyz/wip/" target="_blank"><button class="button">Write!</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="container">
|
||||
<h1><b>PrivateBin</b></h1>
|
||||
<p>PrivateBin is a minimalist and open source pastebin that has zero knowledge of pasted data. Everything is encrypted and decrypted in-browser using 256bit AES in Galois Counter mode.</p>
|
||||
<a href="https://nixnet.xyz/wip/" target="_blank"><button class="button">Write!</button></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="container">
|
||||
<h1><b>SearX</b></h1>
|
||||
<p>SearX is a meta search engine that aggregates results from more than 70 different search engines. Users are neither tracked nor profiled. SearX can also be used over Tor for increased anonymity.</p>
|
||||
<a href="https://nixnet.xyz/wip.html" target="_blank"><button class="button">Paste!</button></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue