app/views/info/home.html.erb
<!-- This is the big ass main image -->
<div class="hero">
<div class="container" style="padding-top: 15%; padding-bottom: 5%;">
<div class="transparent">
<p class="caption">We connect urban low-income youth with competitive STEAM* skills training and hands-on projects for startups.</p>
<br>
<h6 class="caption"> * STEAM: Science, Technology, Engineering, Art, and Math </h6>
</div>
</div>
</div>
</div>
<div class="padding-right">
<!-- News Section. Needs to be updated -->
<div class="container">
<div class="row-fluid">
<h1>News</h1>
<div> </div>
<div class="col-xs-12 col-md-12">
<div class="jumbotron">
<p class="bolder-print" style="font-size:1.3em">October 2016 - Today's the day! Our crowdfunding campaign is now LIVE! We're aiming to raise $5,000 to go towards a public makerspace in Oakland and scholarships for our Oakland Tech students. Please consider making a donation, sharing our campaign on social media, and following our <a class="news" href="http://facebook.com/maklabsberkeley">Facebook</a> and <a class="news" href="http://instagram.com/maklabs">Instagram!</a> <a class="news" href = "https://crowdfund.berkeley.edu/project/2755"> Donate Here! </a></p>
<p class="bolder-print" style="font-size:1.3em">August 2016 - We are looking for mentors for the 2016-17 school year. If you are a UC Berkeley student skilled in CAD and passionate about making a social impact, please apply <a class="news" href="http://bit.ly/makapp2016">here</a> </p>
<p class="bolder-print" style="font-size:1.3em">April 2016 - Māk is the 1st Place winner of Big Ideas at Berkeley in the Financial Inclusion category! To read more, check out the <a class="news" href="http://bigideas.berkeley.edu/contests/financial-inclusion/">Big Ideas website</a></p>
<p class="bolder-print" style="font-size:1.3em">March 2016 - We are proud to represent Māk at the Clinton Global Initiative University conference at UC Berkeley! Read more in the <a class="news" href="http://news.berkeley.edu/2016/03/29/uc-berkeley-to-host-clinton-global-initiative-university/">Berkeley News.</a></p>
</div>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row-fluid">
<h1> Get Involved </h1>
<div class="col-xs-12 col-md-6">
<div class="jumbotron modal-jumbos" style="text-align:center;">
<%= image_tag("students.jpg", :class => "four-boxes", :alt => "students") %>
<p class="bolder-print">Students: We provide extensive, personalized training in 3D design and CAD to high school students in the Bay Area.
<a class="news" data-target="#studentModal" data-toggle="modal" href="#">Read More</a></p>
<!-- Modal -->
<div class="modal fade" id="studentModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Students</h4>
</div>
<div class="modal-body">
<p class="bolder-print">Māk students participate in a 3-month training program in the fall and then a part-time 3-month internship in the spring where they work on design projects for real startups and research labs. Interested in participating in our program? Tell us <a href="#">here!</a></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
<div class = "jumbotron modal-jumbos" style="text-align:center;">
<%= image_tag("student_mentor.jpg", size: "300x250", :class => "four-boxes", :alt => "mentors") %>
<p class="bolder-print">Mentors: We provide a community of engaged and passionate UC Berkeley students skilled in CAD. <a class="news" data-target="#mentorModal" data-toggle="modal" href="#">Read More</a></p>
<!-- Modal -->
<div class="modal fade" id="mentorModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Mentors</h4>
</div>
<div class="modal-body">
<p class="bolder-print">All our mentors earn 2 units while participating in our program, which includes meeting at Oakland Tech once a week. Want to join us as a mentor? Apply <a href="#">here!</a>/p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-md-6">
<div class="jumbotron modal-jumbos" style="text-align:center;">
<%= image_tag("graduation.jpg", size: "300x250", :class => "four-boxes", :alt => "graduation") %>
<p class="bolder-print">Businesses: Māk can help you complete high-quality 3D design projects, whether you work for a startup or a research lab. <a class="news" data-target="#businessModal" data-toggle="modal" href="#">Read More</a></p>
<!-- Modal -->
<div class="modal fade" id="mentorModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Mentors</h4>
</div>
<div class="modal-body">
<p class="bolder-print">All Māk students are supervised by top UC Berkeley engineering and architecture students, and Māk has unparalleled guidance from world-class faculty and engineering departments at Berkeley. Through our partners, we have access to state-of-the-art equipment including 3D printers, Autodesk Fusion 360, Macs, and Wacom drawing tablets. Interested in submitting a project to us? Tell us <a href="#">here!</a> </p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
<div class="jumbotron modal-jumbos" style="text-align:center;">
<%= image_tag("oaklandtech.jpg", size: "300x250", :class => "four-boxes", :alt => "oaklandtech") %>
<p class="bolder-print">We are currently partnering with the Oakland Technical High School’s Fashion, Art, and Design Academy.<a class="news" data-target="#schoolModal" data-toggle="modal" href="#">Read More</a></p>
<div class="modal fade" id="schoolModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Schools</h4>
</div>
<div class="modal-body">
<p class="bolder-print">We are looking to expand to other Bay Area high schools soon. Interested in bringing Māk to your school? Tell us <a href="#">here!</a></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div>
<div class="jumbotron" style="text-align:center;">
<div class="container-fluid">
<h2> Our Partners </h2>
<div style="display: inline-block; padding-right:0px; padding-left:0px">
<%= image_tag("HAAS.jpg", size: "225x175", :alt => "HAAS") %>
</div>
<div style="display: inline-block; padding-right:0px; padding-left:0px">
<%= image_tag("blum-logo.jpg", size: "225x175", :alt => "blum") %>
</div>
<div style="display: inline-block; padding-right:0px; padding-left:0px">
<%= image_tag("oaklandteclogo.jpg", size: "225x175", :alt => "oaklandtechlogo") %>
</div>
<div style="display: inline-block; padding-left:0px">
<%= image_tag("clintonglobal.png", size: "225x175", :alt => "clinton") %>
</div>
</div>
</div>
</div>
<!--<section class="sign_up">-->
<div class="container">
<div class="row">
<div class="col-xs-6 col-xs-offset-3 col-md-6 col-md-offset-3 sign-up">
<h2 class="logo-header">Subscribe</h2>
<form name="signup-form">
<input class="signup-input" type="email" name="email_address" value="" placeholder="enter your email..." title="Please enter a valid email address." required>
<button type="submit" class="submit-btn">GO</button>
</form>
</div>
</div>
</div>
<!--</section>-->