Commit 007f678c authored by Renfred Harper's avatar Renfred Harper

Add about js and styles

parent 5890d550
......@@ -35,6 +35,9 @@ body {
padding-top: 50px;
}
.clip{
overflow: hidden;
}
.title{
text-align: center;
font-size: 50px;
......@@ -133,19 +136,70 @@ ul.ui-autocomplete {
position: fixed;
top: 51px;
bottom: 0;
z-index: 3;
z-index: 10;
display: none;
overflow-y: scroll;
}
#info-name {
font-size: 22px;
margin-bottom: 5px;
}
#info-close {
#info-close, #about-close {
position: absolute;
right: 0;
padding: 6px 19px 19px 19px;
cursor: pointer;
z-index: 10;
opacity: 0.4;
}
#about-close-nav {
opacity: 0.5;
padding: 2px 15px 0px 15px;
display: none;
}
#info-close:hover, #about-close:hover, #about-close-nav:hover {
opacity: 1;
}
#about-body{
position: fixed;
z-index: 1040;
top: 51px;
width: 100%;
bottom: 0;
overflow: scroll;
}
#about-container {
width: 100%;
overflow-y: auto;
}
.about-content {
background-color: #FFF;
padding-bottom: 20px;
}
#about-example{
background-color: rgba(255,255,255,0.4);
}
.about-top-p{
margin-top: 20px;
}
#about-link{
cursor: pointer;
}
.grid-blur{
opacity: 0.54;
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
}
.main-container{
/* Transitions for .grid-blur */
-webkit-transition: opacity 356ms ease-in-out, -webkit-filter 356ms ease-in-out;
-moz-transition: opacity 356ms ease-in-out, -moz-filter 356ms ease-in-out;;
-o-transition: opacity 356ms ease-in-out, -o-filter 356ms ease-in-out;;
-ms-transition: opacity 356ms ease-in-out, -ms-filter 356ms ease-in-out;
transition: opacity 356ms ease-in-out, "filter" 356ms ease-in-out;
}
/* Custom Responsive Classes */
/* xs */
......@@ -190,6 +244,16 @@ ul.ui-autocomplete {
#info-close {
display: none;
}
#about-close {
display: none;
}
#about-body {
bottom: 100px;
}
.navbar-nav li{
margin-left: 10px;
margin-right: 10px;
}
}
/* lg */
@media (min-width: 1200px) {
......
$(document).ready(function(){
$('#about-link').click(function(){
$(this).parent().toggleClass('active');
$('#about-body').slideToggle(356);
$('.main-container').toggleClass('grid-blur');
// Prevent body from scolling when about section is active
$('body').toggleClass('clip');
$('#about-link-text, #about-close-nav').toggle();
});
$('#about-close').click(function(){
$('#about-link').parent().removeClass('active');
$('#about-body').slideUp(356);
$('.main-container').removeClass('grid-blur');
$('body').removeClass('clip');
$('#about-link-text').show();
$('#about-close-nav').hide();
});
});
......@@ -12,6 +12,7 @@
<script src="{{ STATIC_URL }}js/grid.js"></script>
<script src="{{ STATIC_URL }}js/typeAhead.js"></script>
<script src="{{ STATIC_URL }}js/info.js"></script>
<script src="{{ STATIC_URL }}js/about.js"></script>
<link rel="icon" href="{{ STATIC_URL }}/img/gmu-logo.ico">
{% block title %}
<title>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment