HTML/CSS for whytheyfight.com base site.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

166 lines
8.4 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="icon" href="images/blacklogo.png">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>About | WTFxUS</title>
<!-- Bootstrap -->
<link href="css/bootstrap-4.3.1.css" rel="stylesheet">
<!-- Matomo -->
<script type="text/javascript">
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(["setDocumentTitle", document.domain + "/" + document.title]);
_paq.push(["setCookieDomain", "*.whytheyfight.com"]);
_paq.push(["setDomains", ["*.whytheyfight.com"]]);
_paq.push(["setDoNotTrack", true]);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//stats.whytheyfight.com/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '1']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="//stats.whytheyfight.com/matomo.php?idsite=1&amp;rec=1" style="border:0;" alt="" /></p></noscript>
<!-- End Matomo Code -->
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<img height="40" src="images/white logo">
<a class="navbar-brand" href="#">WTFxUS</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="home.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://open.spotify.com/playlist/1Eu0OT5741DZAkePkyeFYQ?si=FJ5LvDEDTeK4h9rZ6kipZw" rel="noopener noreferrer" target="_blank">Music</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://blog.whytheyfight.com" rel="noopener noreferrer" target="_blank">Blog</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Shop</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown
</a>
<!-- <div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="https://distro.whytheyfight.com">Distro</a>
<div class="dropdown-divider"></div> -->
<a class="dropdown-item active" href="about.html">About Us <span class="sr-only">(current)</span></a>
<a class="dropdown-item" href="contact.html">Contact Us</a>
</div>
</li>
</ul>
</div>
</nav>
<section>
<div class="jumbotron text-center mt-2">
<div class="container">
<div class="row">
<div class="col-12">
<img height="300" src="images/blacklogo.png">
<h1>About WTFxUS</h1><br>
<p>Why They Fight is a DIY independent music label. <br> We aim to eventually provide services to artists of all kinds<br>in an effort to help collaboration<br>using open source software.</p>
</div>
</div>
</div>
</div>
</section>
<section>
<div class="container">
<div class="row">
<div class="col-lg-12 mb-4 mt-2 text-center">
<h2>ABOUT US</h2>
</div>
</div>
</div>
<div class="container ">
<div class="row">
<div class="col-lg-4 col-md-6 col-sm-12 text-center offset-xl-4">
<br><img class="rounded-circle" alt="140x140" style="width: 140px; height: 140px;" src="images/140X140.gif" data-holder-rendered="true">
<br><br><h3>Max Barksdale</h3>
<p>Musician turned self-hosted sys admin.</p>
</div>
</div> </section><hr>
<section>
<div class="container">
<div class="row">
<div class="col-12 mb-2 text-center">
<br><h2>OUR SERVICES</h2><br>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-lg-4 aligncenter">
<br><h3>WTFxUS Cloud</h3><br>
<p> Self-hosted Dropbox-like alternative utilizing Nextcloud available to artists and members.</p>
<p><a class="btn btn-link" href="https://cloud.whytheyfight.com" rel="noopener noreferrer" target="_blank">View details »</a></p>
</div>
<div class="col-sm-6 col-lg-4 aligncenter">
<br><h3>Password Protection</h3><br>
<p> Encrypted password vault using Bitwarden available to artists and members. </p>
<p><a class="btn btn-link" href="https://keys.whytheyfight.com" rel="noopener noreferrer" target="_blank">View details »</a></p>
</div>
<div class="col-sm-6 col-lg-4 aligncenter">
<br><h3>Electronic Business Card</h3><br>
<p> Custom made Linktree-like business card to share all of your favorite links.</p>
<p><a class="btn btn-link" href="https://whytheyfight.com/maxfromwtf" rel="noopener noreferrer" target="_blank">View example »</a></p>
</div>
<div class="col-sm-6 col-lg-4 aligncenter">
<br><h3>Blog Features</h3><br>
<p> <em class="icon-desktop "></em> Featured new releases on our music blog.</p>
<p><a class="btn btn-link" href="https://blog.whytheyfight.com/music" rel="noopener noreferrer" target="_blank">View details »</a></p>
</div>
<div class="col-sm-6 col-lg-4 aligncenter">
<br><h3>VIP Access</h3><br>
<p> VIP Access to our Minecraft and Discord servers.</p>
<p><a class="btn btn-link" href="https://discord.whytheyfight.com" rel="noopener noreferrer" target="_blank">View details »</a></p>
</div>
<div class="col-sm-6 col-lg-4 aligncenter">
<br><h3>Meeting Rooms</h3><br>
<p> Private Zoom-like conference rooms available for artists and members. <br> COMING SOON</p>
<p><a class="btn btn-link" href="https://live.whytheyfight.com" rel="noopener noreferrer" target="_blank">View example »</a></p>
</div>
</div>
</div>
</div>
</section><hr>
<section>
<div class="container">
<div class="row">
<div class="col-12 text-center"> <br><br>
<h1>Powered by Open Source!</h1><br>
<p>Most of our services are<br>freely available software<br>on the internet.<br><br>You could host all of this yourself<br>and in the future, we aim<br>to provide resources through our blog<br>on how you can do all of this yourself!<br><br>All code for this site is available <br><a href="https://git.whytheyfight.com">here on our Git server!</a><br><br><br>Thank you to all the open source projects<br>that make WTFxUS great!<br><br>In the future, WTFxUS intends to contribute 10%<br>of all earnings towards these projects.<br><br><a href="https://docker.com">Docker</a><br><a href="https://nginxproxymanager.com/">Nginx Proxy Manager</a><br><a href="https://nextcloud.com">Nextcloud</a><br><a href="https://bitwarden.com">Bitwarden</a><br><a href="https://ghost.org/blog">Ghost</a><br><a href="https://funkwhale.audio">Funkwhale</a><br><a href="https://gitea.io/en-us">Gitea</a><br><a href="https://jitsi.org">Jitsi</a><br><a href="https://mastodon.social">Mastodon</a><br><a href="https://matrix.org">Matrix</a><br><a href="https://openldap.org">OpenLDAP</a><br><a href="https://keycloak.org">Keycloak</a><br><a href="https://heimdall.site">Heimdall</a><br><a href="https://matomo.org">Matomo</a>
<br><br><br>
</div>
</div>
</div>
</section>
<br>
<br>
<footer class="text-center">
<div class="container">
<div class="row">
<div class="col-12">
<p>Copyright © Why They Fight <br> All rights reserved</p>
</div>
</div>
</div>
</footer>
<script src="js/jquery-3.5.1.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap-4.3.1.js"></script>
</body>
</html>