The SRA Website https://socialistra.org
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.
 
 
 
 
 

557 lines
14 KiB

<!--
Contact:
J. L. Hamilton
twitter.com/absinthol
-->
<!DOCTYPE html>
<html lang="en">
<head>
<title>Socialist Rifle Association</title>
<?php include("res/php/headtags.php"); ?>
</head>
<style type="text/css">
@keyframes banner-slide-down {
0% {margin-top: 0;}
25% {margin-top: 1.2em;}
50% {margin-top: 2.4em;}
75% {margin-top: 3.6em;}
100% {margin-top: 4.8em;}
}
@keyframes banner-slide-up {
0% {margin-top: 4.8em;}
25% {margin-top: 3.6em;}
50% {margin-top: 2.4em;}
75% {margin-top: 1.2em;}
100% {margin-top: 0;}
}
@keyframes bar-slide-down {
0% {margin-top: 0em;}
25% {margin-top: 0.5em;}
50% {margin-top: 1.0em;}
75% {margin-top: 1.5em;}
100% {margin-top: 2em;}
}
@keyframes bar-slide-up {
0% {margin-top: 2em;}
25% {margin-top: 1.5em;}
50% {margin-top: 1.0em;}
75% {margin-top: 0.5em;}
100% {margin-top: 0em;}
}
.banner-down {
animation-name: banner-slide-down;
animation-duration: 0.2s;
}
.banner-up {
animation-name: banner-slide-up;
animation-duration: 0.2s;
}
.bar-down {
animation-name: bar-slide-down;
animation-duration: 0.2s;
}
.bar-up {
animation-name: bar-slide-up;
animation-duration: 0.2s;
}
#bar {
height: 2em;
padding: .5em;
font-size: 3.5em;
line-height: 2em;
background-color: transparent;
color: #242524;
border: none;
box-shadow: none;
}
#b-title {
font-size: 3em;
width: 52%;
/* margin-left: auto; */
/* margin-right: auto; */
/* left: 0; */
/* right: 0; */
top: 35vh;
color: #fff;
z-index: 10;
position: absolute;
text-align: center;
font-family: AvenirNext Bold;
font-weight: 700;
/* padding: 1.4em; */
}
#b-underlay {
font-size: 3em;
width: 52%;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
top: 40vh;
color: transparent;
z-index: 9;
position: absolute;
text-align: center;
font-family: Roboto Bold;
font-weight: 700;
padding: 1.4em;
opacity: .7;
box-shadow: none;
background-color: transparent;
}
#menu-cont {
background-color: transparent;
z-index: 2;
position: absolute;
top: 0;
width: 100%;
}
#logo img {
height: 1.8em;
padding: .1em 0 .1em .5em;
margin-left: 0;
background-color: transparent;
image-rendering: -webkit-optimize-contrast;
}
.fa-store:before {
content: "\f54e";
color: #fff;
}
.fa-bars:before {
content: "\f0c9";
color: #fff;
}
.fa-times:before {
content: "\f00d";
color: #fff;
}
#overlay {
height: 100vh;
width: 100%;
background-color: black;
opacity: .9;
top: 0;
left: 0;
position: absolute;
filter: contrast(70);
}
#menu {
position: absolute;
top: 0;
z-index: 3;
height: 4.8em;
padding-top: 1.3em;
background-color: #131313;
}
#first-spacer {
margin-top: 118vh;
}
.ecks {
display: none;
}
#donate {
width: 38%;
background-color: #fff;
margin: 0em auto 9em auto;
padding: 3em;
border-radius: 10px;
box-shadow: 0 1px 1px 1px rgba(0,0,0,.1);
display: inline-block;
}
#donate:hover {
border: 4px dashed #fff;
cursor: pointer;
}
#donate-cont {
clear: left;
width: calc(70% + 10em);
margin: auto auto;
text-align: center;
padding: 0 5em 5em;
}
.d-height {
height: 9em;
}
.d-left {
float: left;
background-color: #f5c739 !important;
color: #fff;
border: 4px solid #f5c739;
}
.d-right {
float: right;
background-color: #d32f2f !important;
color: #fff;
border: 4px solid #d32f2f;
}
#donate-title {
font-family: 'AvenirNext Bold';
font-weight: 700;
font-size: 2em;
}
@media screen and (max-width: 736px) {
#banner {
background-position-x: 22%;
}
#first {
width: 95vw;
background-color: #fff;
margin: 2.5vw auto;
padding: 0 2.5vw 2.5vw;
border-radius: 0;
}
.news_item a {
margin-left: 5.5%;
}
#bar {
height: 1em;
padding: 0.2em;
padding-top: 0.25em;
font-size: 3.5em;
line-height: 1em;
background-color: transparent;
color: #000;
border: none;
}
#menu {
width: 100%;
margin: auto auto;
background-color: #292929;
text-align: center;
padding: 10px 0 10px 0;
}
.logo {
content:url("https://srastatic.nyc3.cdn.digitaloceanspaces.com/web/img/logo/national/new-logo3.png");
}
.page-logo {
content:url("https://srastatic.nyc3.cdn.digitaloceanspaces.com/web/img/logo/national/new-logo2.png");
}
#logo {
float: left;
display: inline-block;
position: absolute;
z-index: 11;
}
#logo img {
height: 2em;
padding: 0 0.2em 0.2em 0.2em;
margin-left: 0;
background-color: transparent;
border-radius: 3px;
}
#b-title {
font-size: 2em;
width: 90%;
/* padding: 0em 1em 1em 0; */
/* max-width: 240px; */
word-wrap: break-word;
/* margin-right: 0; */
margin-left: 0;
left: 0;
/* right: 0; */
text-align: center;
}
.fa-store:before {
color: #fff;
}
.fa-bars:before {
color: #fff
}
.fa-times:before {
color: #131313;
}
.ecks {
display: block;
font-size: 2.5em;
padding-bottom: 10px;
margin-bottom: 0;
text-align: center;
color: #fff !important;
}
.ecks .fa-times:before {
color: #fff;
}
#first-spacer {
margin-top: 106vh;
}
#donate-cont {
clear: left;
width: 100%;
margin: auto auto;
text-align: center;
padding: 0;
}
#donate {
width: 60%;
background-color: #fff;
margin: 0em auto 3em auto;
padding: 3em;
border-radius: 10px;
box-shadow: 0 1px 1px 1px rgba(0,0,0,.1);
display: block;
}
.d-mobile-height {
height: auto !important;
}
.d-left {
float: none;
background-color: #f5c739 !important;
color: #fff;
border: 4px solid #f5c739;
}
.d-right {
float: none;
background-color: #d32f2f !important;
color: #fff;
border: 4px solid #d32f2f;
}
}
@media screen and (max-width: 1200px) {
#first-spacer {
margin-top: 106vh;
}
#donate-cont {
clear: left;
width: 100%;
margin: auto auto;
text-align: center;
padding: 0;
}
#donate {
width: 60%;
background-color: #fff;
margin: 0em auto 3em auto;
padding: 3em;
border-radius: 10px;
box-shadow: 0 1px 1px 1px rgba(0,0,0,.1);
display: block;
}
.d-mobile-height {
height: auto !important;
}
.d-left {
float: none;
background-color: #f5c739 !important;
color: #fff;
border: 4px solid #f5c739;
}
.d-right {
float: none;
background-color: #d32f2f !important;
color: #fff;
border: 4px solid #d32f2f;
}
#b-title {
margin-top: 2em;
font-size: 1.5em;
}
#b-sub {
font-size: 0.6em
}
}
</style>
<body>
<div id="menu">
<div class="section section-menu group">
<a href="/about/">
<div class="col span_1_of_5 btnrnd">
About
</div>
</a>
<a href="/edu/">
<div class="col span_1_of_5 btnrnd">
Education
</div>
</a>
<a href="/resources/">
<div class="col span_1_of_5 btnrnd">
Resources
</div>
</a>
<a href="/membership/">
<div class="col span_1_of_5 btnrnd">
Become A Member
</div>
</a>
<a href="/contact/">
<div class="col span_1_of_5 btnrnd">
Contact Us
</div>
</a>
<p class="ecks"><i class="fa fa-times" aria-hidden="true"></i></p>
</div>
</div>
<div id="menu-cont">
<div id="bar">
<div id="logo"><img class="logo" src="https://srastatic.nyc3.cdn.digitaloceanspaces.com/web/img/logo/national/logo-white.png"></div>
<div id="ham-toggle"><i class="fa fa-bars" aria-hidden="true"></i></div>
<div id="cart-icon"><a href="https://shop.socialistra.org"><i class="fas fa-store" aria-hidden="true" style="font-size: 0.85em;"></i></a></div>
</div>
</div>
</div>
</div>
<div id="banner">
<?php
// Read folders from stories
$iterator = new DirectoryIterator('./news/stories');
$stories = array();
foreach ($iterator as $file) {
if ($file->isDot()) {
continue;
}
$stories[] = $file->getFilename();
}
// Invert the array to get into correct order
arsort($stories);
$laststory_index = array_values($stories)[0];
// Get the details of the latest story
$laststory = json_decode(
file_get_contents(
"./news/stories/" . $laststory_index . "/meta.json"
), true
);
echo '
<div id="b-title">' . $laststory["title"] . '<br>
<span id="b-sub">' . $laststory["subtitle"] . '</span><br><span id="read">
<a href="/news/story.php?id=' . $laststory_index .'">Read Now</a></span></div>
<style>
#banner {
background-image: url(https://srastatic.nyc3.cdn.digitaloceanspaces.com/web/img/news/' . $laststory_index . "/" . $laststory["thumb"] . ');
background-position: center;
background-size: cover;
position: absolute;
top: 0;
height: 100vh;
width: 100%;
display: block;
}
</style>
';
?>
<div id="overlay"></div>
</div>
<div id="first-spacer"></div>
<div id="donate-cont" class="d-height d-mobile-height">
<a href="/donate/">
<div id="donate" class="d-left">
<img src="https://srastatic.nyc3.cdn.digitaloceanspaces.com/web/img/donate/give-w.png" width="100px;">
<div id="donate-title">Donate</div>
</div>
</a>
<a href="/membership/">
<div id="donate" class="d-right">
<img src="https://srastatic.nyc3.cdn.digitaloceanspaces.com/web/img/donate/arm-w.png" width="100px;">
<div id="donate-title">Become a Member</div>
</div>
</a>
</div>
<div id="first">
<div id="section-title">Recent News</div>
<hr>
<br><br>
<div class="section group news zmd-hierarchical-display" data-animation="hierarchical-display">
<?php
$i = 0;
// Display stories
foreach ($stories as $story) {
if ($i < 3) {
$data = json_decode(
file_get_contents("./news/stories/$story/meta.json")
, true);
echo '
<div class="col span_1_of_3 news_item">
<a href="./news/story.php?id='.$story.'">
<img class="news_item" src="https://srastatic.nyc3.cdn.digitaloceanspaces.com/web/img/news/' . $story . '/' . $data['thumb'].'">
<hr class="news-hr">
<p class="nit">'.$data['title'].'</p>
<p class="sub-nit">'.$data['subtitle'].'</p>
</a>
</div>
';
$i++;
} else {
break;
}
}
?>
</div>
<br>
<div style="text-align: center;"><h3><a href="./news/"><i class="fas fa-newspaper"></i> More News</a></h3></div>
<br>
</div>
<footer>
<div class="section group">
<div class="col footer_1_of_4">
<img src="https://srastatic.nyc3.cdn.digitaloceanspaces.com/web/img/theme/footer.png"><br>
<p class="footer">The Socialist Rifle Association's mission is to uphold the right of the working class to keep and bear arms and maintain the skills necessary for self and community defense.</p>
</div>
<div class="col footer_1_of_4">
<ul class="footer-ul">
<li><a href="../leadership/"><i class="fas fa-users"></i> Leadership</a></li>
<hr class="footer-hr">
<li><a href="../resolutions/"><i class="fas fa-file-alt"></i> Policy Resolutions</a></li>
<hr class="footer-hr">
<li><a href="../bylaws/"><i class="fas fa-file-alt"></i> Current Bylaws</a></li>
<hr class="footer-hr">
<li><a href="../chapters/"><i class="fas fa-map-marked-alt"></i> Local Chapters</a></li>
<hr class="footer-hr">
</ul>
</div>
<div class="col footer_1_of_4">
</div>
<div class="col footer_1_of_4">
<span class="follow">Follow Us</span><br>
<ul>
<a href="https://twitter.com/socialistra">
<li class="fab fa-twitter-square" aria-hidden="true"></li>
</a>
<a href="https://www.youtube.com/channel/UCEJzdCNfDMUz5GZDIRGgZaw">
<li class="fab fa-youtube-square" aria-hidden="true"></li>
</a>
<a href="https://www.facebook.com/SocialistRifle/">
<li class="fab fa-facebook-square" aria-hidden="true"></li>
</a>
<a href="https://www.reddit.com/r/SocialistRA/">
<li class="fab fa-reddit-square" aria-hidden="true"></li>
</a>
</ul>
</div>
</div>
</footer>
</body>
<script src="/res/js/menu2.js" type="text/javascript"></script>
<script type="text/javascript">
pollVisibility();
function pollVisibility() {
if ($('.newscard-title').is(':visible')) {
$('.zmd-hierarchical-display').hierarchicalDisplay();
} else {
setTimeout(pollVisibility, 500);
}
}
$('.ecks').click(function() {
$('#ham-toggle i').attr("class", "fa fa-bars");
$('#menu').slideUp('fast');
$('#bar').attr("class", "bar-up");
$('#bar').css('margin-top','0');
$('#banner').attr("class", "banner-up");
$('#banner').css('margin-top','0');
if ($(window).width() <= 736){
// $('#logo img.logo').attr("src","/img/new-logo.png");
}
$('#logo img').attr("class", "logo");
$('#article-page').attr("class", "closed");
if ($(window).width() <= 736){
// $('#logo img.logo').attr("src","/img/new-logo.png");
}
});
</script>
</body>
</html>