{dev}Osan Official Website
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.
dev-osan.github.io/index.html

251 lines
8.8 KiB

<!DOCTYPE html>
6 years ago
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
6 years ago
<!-- Bootstrap CSS -->
<link
rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
crossorigin="anonymous"
/>
6 years ago
<!-- Font Awesome -->
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.8.1/css/all.css"
integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf"
crossorigin="anonymous"
/>
<!-- Custom CSS -->
<link rel="stylesheet" href="styles.css" />
6 years ago
<title>{dev}Osan</title>
6 years ago
</head>
6 years ago
<body>
<!-- Header information, above the fold -->
<div class="above-the-fold">
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
<a class="devOsan" href="#" id="devOsanMiniLogo-dynamic">
<span style="color: #696035">{</span>dev<span style="color: #696035">}</span>Osan
</a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#club-info">Club Info</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#events">Events</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#projects">Projects</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#learning-resources"
>Learning Resources</a
>
</li>
<li class="nav-item">
<a class="nav-link" href="#faq">FAQs</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</li>
</ul>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col">
<a href="" id="announcement-card-link">
<div class="card mb-3" style="max-width: 540px; margin-top: 5%;">
<div class="row no-gutters">
<div class="col-4">
<img
src="img/3dPrinter.png"
class="card-img"
alt="3d printer printing a red wheel"
/>
</div>
<div class="col-8">
<div class="card-body">
<h5 class="card-title">Pitch & Prototype Weekend</h5>
<p class="card-text">
Join us Aug 23-25 at Osan Air Base for a weekend of
rapid prototyping. Pitch an idea to form a team or show
up with your skills ready to contribute! Click here!
</p>
</div>
</div>
</div>
</div>
</a>
</div>
</div>
<div class="row name-slogan">
<div class="col col-md-6 offset-md-6" id="devOsanLogo-dynamic">
<h1 class="devOsan">
<span style="color: #696035">{</span>dev<span style="color: #696035">}</span>Osan
</h1>
<h4 class="devOsan">Software Development Club</h4>
</div>
</div>
</div>
</div>
<!-- below the fold. Vision statement, Meeting info -->
<div class="container-fluid" id="club-info">
<div class="row">
<div class="vision-statement col-sm-8 offset-sm-2">
Bringing Developers, Graphic Designers, and Engineering together at
Osan Air Base - beginners and experts alike.
6 years ago
</div>
</div>
<div class="row">
<div class="col-sm-6">
<i class="far fa-clock"></i><br /><br />
<p>Tuesdays @ 1600 - 1700 : Guided lesson</p>
<p>Wednesdays @ 1600 - 1700 : Open Project Work</p>
</div>
<div class="col-sm-6">
<i class="fas fa-map-marker-alt"></i><br /><br />
<p>TAPS room at the Mustang Center</p>
<p>Osan Air Base, South Korea</p>
</div>
6 years ago
</div>
</div>
<!-- Events and Projects -->
<div class="container-fluid events-projects">
<div class="row">
<div class="col-sm-6" id="events">
<h3><i class="far fa-calendar-alt"></i><br />Events</h3>
<br />
<p>Pitch & Prototype Weekend - Aug 23-25</p>
</div>
<div class="col-sm-6" id="projects">
<h3><i class="fas fa-code-branch"></i><br />Projects</h3>
<br />
<div id="projectCarousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active" data-interval="10000">
<h3>Bus GPS</h3>
<p>Kevin Falting</p>
</div>
<div class="carousel-item" data-interval="10000">
<h3>{dev}Osan Website</h3>
<p>{dev}Osan Club</p>
</div>
<div class="carousel-item" data-interval="10000">
<h3>Pending Game Engine</h3>
<p>Joshua Sigona</p>
</div>
</div>
<a class="carousel-control-prev" href="#projectCarousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#projectCarousel" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</div>
</div>
<!-- Learning Resources & FAQ -->
<div class="container-fluid learn-faq">
<div class="row">
<div class="col-sm-6" id="learning-resources">
<h3>Learning Resources</h3>
<p>
Contributing Guides -
<a href="https://github.com/dev-osan/dev-osan.github.io">Go here</a>
</p>
</div>
<div class="col-sm-6" id="faq">
<h3>FAQ</h3>
<div class="question1">
<h6>Do I have to know how to program?</h6>
<div class="answer">
Absolutely not, just a desire to hang out with software developers.
</div>
</div>
<div class="question2">
<h6>I want to learn a programming language but I have no experience. Where do I start?</h6>
<div class="answer">
Look at the "Getting Started" Learning Resources above for great starting points. Pick something you are passionate about making and work towards your goal by learning the requirements of that goal.
</div>
</div>
<div class="question1">
<h6>How do I fix errors when I run into them and don't know what do?</h6>
<div class="answer">
Google is your best friend. Usually asking your question through Google gives you a <b>Stack Overflow</b> article with similar issues that others have faced like you.
</div>
</div>
<div class="question2">
<h6>I want to teach something for the club that would be beneficial!</h6>
<div class="answer">
Awesome! As we explain in our meetings, anyone can come up and be the speaker for the week. If you have a topic that would benefit others then by all means we would love to hear from you! Let us know when you want to speak!
</div>
</div>
</div>
</div>
</div>
<!-- Footer and Contact Us -->
<div class="container-fluid" id="contact">
<div class="row">
<div class="col">
<h3>Contact Us</h3>
<p>
<a href="mailto:kevinfalting@gmail.com">kevinfalting@gmail.com</a>
</p>
</div>
</div>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script
src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"
></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
crossorigin="anonymous"
></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
crossorigin="anonymous"
></script>
<script src="additionalScripts.js"></script>
6 years ago
</body>
</html>