rushilwiz/website-2018
1
0
Fork 0
mirror of https://github.com/tjsga/website-2018.git synced 2025-04-29 15:29:49 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

resources page and finish about page

Browse Source
This commit is contained in:
William Zhang 2017-07-08 21:21:42 -04:00
parent 29219706c7
commit 74d3508cbc
8 changed files with 364 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

178
about.html
View File

@ -13,7 +13,7 @@
<link href="css/footer.css" rel="stylesheet" /> <link href="css/footer.css" rel="stylesheet" />
<link href="css/about.css" rel="stylesheet" /> <link href="css/about.css" rel="stylesheet" />
<link href="css/responsive.css" rel="stylesheet" /> <link href="css/responsive.css" rel="stylesheet" />
<title>Home - TJSGA</title> <title>About - TJSGA</title>
</head> </head>
<body> <body>
@ -31,12 +31,12 @@
<a class="menu-item" href="about.html"> <a class="menu-item" href="about.html">
<button class="menu-item fluid">About</button> <button class="menu-item fluid">About</button>
</a> </a>
<a class="menu-item" href="resources.html">
<button class="menu-item fluid">Resources</button>
</a>
<a class="menu-item" href="forms.html"> <a class="menu-item" href="forms.html">
<button class="menu-item fluid">Forms</button> <button class="menu-item fluid">Forms</button>
</a> </a>
<a class="menu-item" href="links.html">
<button class="menu-item fluid">Links</button>
</a>
</nav> </nav>
<div id="dome"> <div id="dome">
</div> </div>
@ -96,15 +96,183 @@
<hr /> <hr />
<section id="excomm"> <section id="excomm">
<h2>SGA Executive Committee</h2> <h2>SGA Executive Committee</h2>
<div id="excomm-text"> <div id="excomm-desc">
The Executive Committee (ExComm) is a integral sub-group of the SGA. Its members act as representatives of the student body. The members work with the officers to organize events and activities throughout to year. While several ExComm positions may have more specific roles, all are working towards the goals of the SGA. Applications to be on ExComm are released every June after Class Council elections have been completed. The Executive Committee (ExComm) is a integral sub-group of the SGA. Its members act as representatives of the student body. The members work with the officers to organize events and activities throughout to year. While several ExComm positions may have more specific roles, all are working towards the goals of the SGA. Applications to be on ExComm are released every June after Class Council elections have been completed.
</div> </div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
<div class="excomm-intro">
<div class="excomm-image">
</div>
<div class="excomm-text">
<span>William Zhang '18</span>
<span>Technology Specialist</span>
</div>
</div>
</section> </section>
<hr /> <hr />
<section id="senators"> <section id="senators">
<h2>SGA Class Senators</h2>
<div id="senators-desc">
Jefferson's student government is divided into school-wide student government (SGA) and grade-level student government (Class Council). While the SGA organizes school-wide events and addresses school-wide concerns and issues, Class Councils represent their grade's needs and host fundraisers and events with the goal to raise money for both Prom and Graduation at the end of senior year. SGA Class Senators serve as Class Council members who are liaisons with the SGA.
</div>
<div class="senator-intro">
<div class="senator-image">
</div>
<div class="senator-text">
<span>Sabria Kazmi '19</span>
<span>2019 Senator</span>
</div>
</div>
<div class="senator-intro">
<div class="senator-image">
</div>
<div class="senator-text">
<span>Sabria Kazmi '19</span>
<span>2019 Senator</span>
</div>
</div>
<div class="senator-intro">
<div class="senator-image">
</div>
<div class="senator-text">
<span>Sabria Kazmi '19</span>
<span>2019 Senator</span>
</div>
</div>
<div class="senator-intro">
<div class="senator-image">
</div>
<div class="senator-text">
<span>Sabria Kazmi '19</span>
<span>2019 Senator</span>
</div>
</div>
<div class="senator-intro">
<div class="senator-image">
</div>
<div class="senator-text">
<span>Sabria Kazmi '19</span>
<span>2019 Senator</span>
</div>
</div>
<div class="senator-intro">
<div class="senator-image">
</div>
<div class="senator-text">
<span>Sabria Kazmi '19</span>
<span>2019 Senator</span>
</div>
</div>
</section> </section>
<hr /> <hr />
<section id="sponsors"> <section id="sponsors">
<h2>SGA Sponsors</h2>
<div id="sponsors-desc">
The SGA Sponsors attend all SGA meetings and functions. They also provide invaluable guidance and feedback - whether through late night emails, frigid-cold morning meetings, lunch discussions, or anything in between.
</div>
<div class="sponsor-intro">
<div class="sponsor-image">
</div>
<div class="sponsor-text">
<span>Amanda Hurowitz</span>
<span>TJHSST Humanities</span>
</div>
</div>
<div class="sponsor-intro">
<div class="sponsor-image">
</div>
<div class="sponsor-text">
<span>Marianne Razzino</span>
<span>TJHSST Mathematics</span>
</div>
</div>
</section> </section>
</div> </div>
<footer> <footer>

42
css/about.css
View File

@ -1,9 +1,9 @@
.officers-image { .officers-image, .excomm-image, .senator-image, .sponsor-image {
width: 100%; width: 100%;
height: 20vh; height: 20vh;
} }
.officers-image:after { .officers-image:after, .excomm-image:after, .senator-image:after, .sponsor-image:after {
width: 20vh; width: 20vh;
height: 20vh; height: 20vh;
content: ''; content: '';
@ -16,36 +16,38 @@
border-radius: 50%; border-radius: 50%;
} }
.officers-text { .officers-text, #excomm-desc, .excomm-text, #senators-desc, .senator-text, #sponsors-desc, .sponsor-text {
font-size: 1.2em; font-size: 1.1em;
color: #fff; color: #fff;
width: 100%; width: 100%;
} }
.officers-text > span { .officers-text > span, .excomm-text > span, .senator-text > span, .sponsor-text {
font-size: 1.4em; font-size: 1.4em;
font-weight: bold; font-weight: bold;
} display: inline-block;
.officers-intro {
text-align: center;
width: calc(50% - 8vw);
margin: 2vw;
display: flex;
flex-wrap: wrap;
}
#excomm-text {
width: 100%; width: 100%;
margin: 2vw;
} }
#officers, #excomm {
.officers-intro, .excomm-intro, .senator-intro, .sponsor-intro {
text-align: center;
margin: 2vw;
flex-basis: calc(25% - 4vw);
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
} }
#officers > h2, #excomm > h2 { #excomm-desc, #senators-desc, #sponsors-desc {
margin: 0 7vw;
}
#officers, #excomm, #senators, #sponsors {
display: flex;
flex-wrap: wrap;
}
#officers > h2, #excomm > h2, #senators > h2, #sponsors > h2 {
text-align: center; text-align: center;
} }

3
css/footer.css
View File

@ -8,8 +8,7 @@ footer {
text-align: center; text-align: center;
color: #fff; color: #fff;
background-color: #212121; background-color: #212121;
z-index: 10; z-index: 2;
opacity: 0.9;
} }
footer>span { footer>span {

18
css/main.css
View File

@ -58,10 +58,14 @@ hr {
} }
a { a {
color: #1976D2; color: #2196F3;
text-decoration: none; text-decoration: none;
} }
li {
color: #fff;
}
button.flip>i { button.flip>i {
height: 3vh; height: 3vh;
width: 3vh; width: 3vh;
@ -130,12 +134,13 @@ span>a:active {
#wrapper { #wrapper {
position: relative; position: relative;
width: 100%; width: 100%;
min-height: 100vh; min-height: calc(60vh - 42px - 2.75em);
z-index: 1; z-index: 1;
background-color: #424242; background-color: #424242;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
overflow: hidden;
} }
#wrapper:before { #wrapper:before {
@ -149,12 +154,13 @@ span>a:active {
section { section {
width: 100%; width: 100%;
height: 100vh; min-height: 100%;
padding-bottom: 5vh; padding-bottom: 5vh;
display: flex; display: flex;
z-index: 2;
} }
#intro, #updates, #officers { #intro, #updates, #officers, #excomm, #senators, #sponsors, #links {
display: flex; display: flex;
height: 100%; height: 100%;
justify-content: center; justify-content: center;
@ -222,3 +228,7 @@ section h2,
#letter>p { #letter>p {
margin: 0.5em 0; margin: 0.5em 0;
} }
#links > h2 {
text-align: center;
}

17
css/responsive.css
View File

@ -1,10 +1,13 @@
@media screen and (max-width: 480px) { @media screen and (max-width: 500px) {
#dome { #dome {
display: none; display: none;
} }
#banner>h1 { #banner>h1 {
display: none; display: none;
} }
#wrapper {
min-height: calc(100vh - 90px - 2.75em);
}
#wrapper, #wrapper,
footer { footer {
top: 48px; top: 48px;
@ -12,6 +15,9 @@
#intro-text { #intro-text {
margin: 0 5vw; margin: 0 5vw;
} }
.officers-intro, .excomm-intro, .senator-intro, .sponsor-intro {
margin: 7vw;
}
} }
@media screen and (max-width: 1100px) { @media screen and (max-width: 1100px) {
@ -68,6 +74,9 @@
#menu-toggle { #menu-toggle {
display: block; display: block;
} }
.officers-intro, .excomm-intro, .senator-intro, .sponsor-intro {
flex-basis: calc(50% - 4vw);
}
} }
@media screen and (max-width: 1000px) { @media screen and (max-width: 1000px) {
@ -80,12 +89,6 @@
section { section {
max-width: 750px; max-width: 750px;
} }
.officers-intro {
width: 90vw;
}
.offiers-image {
width: 45%;
}
} }
@media screen and (min-width: 1100px) { @media screen and (min-width: 1100px) {

55
forms.html Normal file
View File

@ -0,0 +1,55 @@
<!--<h2>February Frenzy Volleyball Tournament 2017</h2>
<a href="https://docs.google.com/document/d/1FPNXRipNI98REYuoBTVi6OSULJEsoa_OoCJGL1uXfiY/edit" target="_blank">
2017 February Frenzy Permission
</a>
<a href="https://docs.google.com/document/d/1FPNXRipNI98REYuoBTVi6OSULJEsoa_OoCJGL1uXfiY/edit" target="_blank">
Rules + Forms
</a>
<a href="https://docs.google.com/forms/d/e/1FAIpQLSfE1q8vWm1DzACaeBBlSm-rN-H_Go7j-JLbY938uB0il6ncHg/viewform" target="_blank">
2017 February Frenzy Registration
</a>
<h2>Middle School Leadership Conference</h2>
<a href="https://docs.google.com/document/d/1QENrXmRVlOlpF2bJvXxFo2us6pMyqH3F1Lf3Elb9g-4/edit?usp=sharing" target="_blank">
2017 Activity/Workshop Form
</a>
<h2>Jefferson Day 2017</h2>
<a href="https://docs.google.com/document/d/10iWm9I_uKcs9ONCf_MbdHkEeSaV1ZXZFluUJ8GOXYo8/edit" target="_blank">
J-Day Guide (courtesy of Devan Kowdley)
</a>
<a href="https://docs.google.com/spreadsheets/d/1vQMRtvvq5MFvWJQ6x0kksYTy3inxqd2rIjOhaeT2-Bg/edit#gid=0" target="_blank">
J-Day Performance
</a>
<a href="https://docs.google.com/spreadsheets/d/1vQMRtvvq5MFvWJQ6x0kksYTy3inxqd2rIjOhaeT2-Bg/edit#gid=0" target="_blank">
Schedule
</a>
<a href="https://docs.google.com/presentation/d/1UrXJ9RDRBkNg5MrGSB0pGBs4jyqfinMq11AZBYUviMs/edit#slide=id.g1e1bf490cc_0_67" target="_blank">
J-Day Map and Club Key
</a>
<h2>J-Day May Madness Basketball</h2>>
<ul>
<li>
<a href="https://docs.google.com/document/d/14XifheYhCZGAuoTERynfW_7ssXLdngaApOlN2PJ1tY8/edit" target="_blank">
Schedule &amp; Rules
</a>
</li>
<li>
<a href="https://docs.google.com/spreadsheets/d/1e8ux2jT1YVEUc318Ns1kQ9YGtHa9gzptvdQraOEpU1g/edit?usp=sharing" target="_blank">
Seeding &amp; Roster
</a>
</li>
<li>
Updated Basketball Bracket&nbsp;→&nbsp;Coming Soon!
</li>
<li>
<a href="/uploads/3/8/0/7/38079437/jdaybballpermissionform2016.docx">
J-Day Basketball Permission Form
</a>
</li>
</ul>
<h2>Slivoskey Grant</h2>
<a href="/uploads/3/8/0/7/38079437/slivoskey-grant-application-2016.docx">
2016 Slivoskey Grant Application
</a>-->

7
index.html
View File

@ -30,18 +30,17 @@
<a class="menu-item" href="about.html"> <a class="menu-item" href="about.html">
<button class="menu-item fluid">About</button> <button class="menu-item fluid">About</button>
</a> </a>
<a class="menu-item" href="resources.html">
<button class="menu-item fluid">Resources</button>
</a>
<a class="menu-item" href="forms.html"> <a class="menu-item" href="forms.html">
<button class="menu-item fluid">Forms</button> <button class="menu-item fluid">Forms</button>
</a> </a>
<a class="menu-item" href="links.html">
<button class="menu-item fluid">Links</button>
</a>
</nav> </nav>
<div id="dome"> <div id="dome">
</div> </div>
</header> </header>
<div id="wrapper" class="fluid"> <div id="wrapper" class="fluid">
<section id="intro"> <section id="intro">
<div id="intro-text" class="fluid"> <div id="intro-text" class="fluid">
<h2 id="intro-title">Welcome!</h2> <h2 id="intro-title">Welcome!</h2>

87
resources.html Normal file
View File

@ -0,0 +1,87 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta content="" name="description">
<meta content="William Zhang" name="author">
<meta name="theme-color" content="#1976D2" />
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0" />
<link href="icons/favicon.ico" rel="icon" type="image/ico">
<link href="css/header.css" rel="stylesheet" />
<link href="css/main.css" rel="stylesheet" />
<link href="css/footer.css" rel="stylesheet" />
<link href="css/responsive.css" rel="stylesheet" />
<title>Resources - TJSGA</title>
</head>
<body>
<header>
<div id="banner">
<button id="menu-toggle" class="fluid">
<i></i>
</button>
<h1>TJ STUDENT GOVERNMENT ASSOCIATION</h1>
</div>
<nav id="menu" class="fluid">
<a class="menu-item" href="index.html">
<button class="menu-item fluid">Home</button>
</a>
<a class="menu-item" href="about.html">
<button class="menu-item fluid">About</button>
</a>
<a class="menu-item" href="resources.html">
<button class="menu-item fluid">Resources</button>
</a>
<a class="menu-item" href="forms.html">
<button class="menu-item fluid">Forms</button>
</a>
</nav>
<div id="dome">
</div>
</header>
<div id="wrapper" class="fluid">
<section id="links">
<h2>General Resources</h2>
<ul>
<li>
<a href="https://docs.google.com/forms/d/18KRo3RritoN6RddNvI-l2zZs1h_1mmVWWgRQGOk2vvQ/viewform">
SGA Feedback and Suggestion Google Form
</a>
</li>
<li>
<a href="/uploads/3/8/0/7/38079437/wi-fi_faq_-_june_2015.pdf" target="_blank">
TJ Wi-Fi Frequently Asked Questions: FCPSonboard
</a>
</li>
<li>
<a href="/uploads/3/8/0/7/38079437/sgafoodguidelinesmadeeasypizzasalebakesales-2.pdf" target="_blank">
SGA Pizza Sale and Bake Sale Food Guidelines (Updated 1/26/15)
</a>
</li>
</ul>
</section>
</div>
<footer>
<span>&copy; 2017 TJSGA</span>
<a href="https://facebook.com/tjsga" target="_blank">
<button class="social" id="fb">
</button>
</a>
<a href="https://twitter.com/tjSGA" target="_blank">
<button class="social" id="tw">
</button>
</a>
<a href="https://facebook.com/tjsga" target="_blank">
<button class="social" id="flickr">
</button>
</a>
<a href="mailto:sga.tjhsst@gmail.com" target="_blank">
<button class="social" id="mail">
</button>
</a>
</footer>
<script src="js/sidebar.js"></script>
</body>
</html>