From fe3d4b48371e1306bdbfa723bbfd944e2df580e6 Mon Sep 17 00:00:00 2001
From: briandunnigan <Brian@d82h71.public.uconn.edu>
Date: Wed, 17 Jun 2015 10:23:07 -0400
Subject: [PATCH] Sticky Footer and Pre-Advising Portal

---
 css/ece.css          |  49 ++++++-
 functions.php        | 156 ++++++++++-----------
 js/custom.js         | 315 ++++++++++++++++++++++++-------------------
 js/min/custom.min.js |   2 +-
 preadvising-page.php | 107 +++++++++------
 sass/ece.scss        |  46 ++++++-
 6 files changed, 408 insertions(+), 267 deletions(-)

diff --git a/css/ece.css b/css/ece.css
index 9533eea..4f10f54 100644
--- a/css/ece.css
+++ b/css/ece.css
@@ -9211,21 +9211,20 @@ body.home .hentry {
 }
 
 /* ----------------------------- Default Page Styles ----------------------------- */
-#page-page, #page-blank, #page-userlist, #page-user-profile .col-sm-9, #page-single, #page-archive {
+#page-page, #page-blank, #page-userlist, #page-user-profile .col-sm-9, #page-single, #page-archive, #page-advising {
   background-color: #FAFAFA;
-  border: 1px solid #EBEBEB;
 }
-#page-page .row:nth-child(1), #page-blank .row:nth-child(1), #page-userlist .row:nth-child(1), #page-user-profile .col-sm-9 .row:nth-child(1), #page-single .row:nth-child(1), #page-archive .row:nth-child(1) {
+#page-page .row:nth-child(1), #page-blank .row:nth-child(1), #page-userlist .row:nth-child(1), #page-user-profile .col-sm-9 .row:nth-child(1), #page-single .row:nth-child(1), #page-archive .row:nth-child(1), #page-advising .row:nth-child(1) {
   background-color: #FAFAFA;
   border: 1px solid #EBEBEB;
 }
-#page-page #main, #page-blank #main, #page-userlist #main, #page-user-profile .col-sm-9 #main, #page-single #main, #page-archive #main {
+#page-page #main, #page-blank #main, #page-userlist #main, #page-user-profile .col-sm-9 #main, #page-single #main, #page-archive #main, #page-advising #main {
   background-color: transparent;
   padding-left: 40px;
   padding-right: 40px;
   margin-top: 18px;
 }
-#page-page h1, #page-blank h1, #page-userlist h1, #page-user-profile .col-sm-9 h1, #page-single h1, #page-archive h1 {
+#page-page h1, #page-blank h1, #page-userlist h1, #page-user-profile .col-sm-9 h1, #page-single h1, #page-archive h1, #page-advising h1 {
   margin-bottom: 30px;
   font-family: 'bebas_neue_regularregular', helvetica, arial, sans-serif;
   font-size: 40px;
@@ -9233,12 +9232,16 @@ body.home .hentry {
   text-shadow: 0px 1px 0px white;
   color: #4B4B4B;
 }
-#page-page h2, #page-blank h2, #page-userlist h2, #page-user-profile .col-sm-9 h2, #page-single h2, #page-archive h2 {
+#page-page h2, #page-blank h2, #page-userlist h2, #page-user-profile .col-sm-9 h2, #page-single h2, #page-archive h2, #page-advising h2 {
   text-transform: uppercase;
   color: #00a8b1;
   font-size: 20px;
 }
 
+#page-user-profile .col-sm-9 {
+  border: 1px solid #EBEBEB;
+}
+
 /* ----------------------------- Page Blank ----------------------------- */
 #page-blank {
   background-color: #FAFAFA;
@@ -9306,6 +9309,40 @@ body.home .hentry {
   margin-bottom: 20px;
 }
 
+/* ----------------------------- Page Advising ----------------------------- */
+#page-advising .left-courses {
+  /*padding-left:0;
+  padding-right:0;
+  border-right:1px solid red;*/
+}
+#page-advising .select-course {
+  margin-top: 10px;
+}
+#page-advising #ece-course {
+  margin-top: 30px;
+}
+#page-advising #ece-course #ece-course-name {
+  font-family: 'bebas_neue_regularregular', helvetica, arial, sans-serif;
+  font-size: 30px;
+  letter-spacing: 0.5px;
+  text-shadow: 0px 1px 0px white;
+  color: #4B4B4B;
+}
+#page-advising #ece-major {
+  margin-top: 30px;
+}
+#page-advising #ece-major #ece-major-name {
+  font-family: 'bebas_neue_regularregular', helvetica, arial, sans-serif;
+  font-size: 30px;
+  letter-spacing: 0.5px;
+  text-shadow: 0px 1px 0px white;
+  color: #4B4B4B;
+  line-height: 1em;
+}
+#page-advising input, #page-advising button, #page-advising select, #page-advising textarea {
+  width: 85%;
+}
+
 /* ----------------------------- Archive/Blog ----------------------------- */
 #page-single .widget, #page-archive .widget {
   padding: 0px !important;
diff --git a/functions.php b/functions.php
index 7a8f238..5fb4411 100644
--- a/functions.php
+++ b/functions.php
@@ -1,79 +1,79 @@
-<?php
-
-function ece_scripts() {
-	wp_enqueue_style( 'ece-style', get_stylesheet_directory_uri() . '/css/ece.css');
-	wp_enqueue_script('ece-custom', get_stylesheet_directory_uri().'/js/custom.js', array('jquery'));
-	wp_localize_script( 'ece-custom', 'ece_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ), 'siteurl' => site_url() ) );
-}
-add_action( 'wp_enqueue_scripts', 'ece_scripts');
-
-function ece_get_courses( $discipline ){
-	$ch = curl_init();
-	curl_setopt($ch, CURLOPT_URL,"http://web2.uconn.edu/ece/preadvising/pread_course.php");
-	curl_setopt($ch, CURLOPT_POST, 1);
-	curl_setopt($ch, CURLOPT_POSTFIELDS, 'discipline='.$discipline);
-	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
-	$courses = curl_exec($ch);
-	curl_close ($ch);
-
-	return json_decode($courses);
-}
-
-function ajax_ece_discipline_courses(){
-	$discipline = $_POST['discipline'];
-
-	$courses = ece_get_courses( urlencode($discipline) );
-
-	echo wp_json_encode( $courses );
-	wp_die();
-}
-add_action( 'wp_ajax_ece_discipline_courses', 'ajax_ece_discipline_courses' );
-add_action('wp_ajax_nopriv_ece_discipline_courses', 'ajax_ece_discipline_courses');
-
-function ece_get_course_info( $discipline, $course ){
-	$ch = curl_init();
-	curl_setopt($ch, CURLOPT_URL,"http://web2.uconn.edu/ece/preadvising/pread_course.php");
-	curl_setopt($ch, CURLOPT_POST, 1);
-	curl_setopt($ch, CURLOPT_POSTFIELDS, 'course='.$course.'&discipline='.$discipline);
-	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
-	$courses = curl_exec($ch);
-	curl_close ($ch);
-
-	return json_decode($courses);
-}
-
-function ajax_ece_course_info(){
-	$discipline = $_POST['discipline'];
-	$course = $_POST['course'];
-
-	$courseInfo = ece_get_course_info( urlencode($discipline), urlencode($course) );
-
-	echo wp_json_encode( $courseInfo );
-	wp_die();
-}
-add_action( 'wp_ajax_ece_course_info', 'ajax_ece_course_info' );
-add_action('wp_ajax_nopriv_ece_course_info', 'ajax_ece_course_info');
-
-function ece_get_major_info( $major ){
-	$ch = curl_init();
-	curl_setopt($ch, CURLOPT_URL,"http://web2.uconn.edu/ece/preadvising/pread_major.php");
-	curl_setopt($ch, CURLOPT_POST, 1);
-	curl_setopt($ch, CURLOPT_POSTFIELDS, 'major='.$major);
-	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
-	$info = curl_exec($ch);
-	curl_close ($ch);
-
-	return json_decode($info);
-}
-
-function ajax_ece_major_info(){
-	$major = $_POST['major'];
-
-	$majorInfo = ece_get_major_info( urlencode($major) );
-
-	echo wp_json_encode( $majorInfo );
-	wp_die();
-}
-add_action( 'wp_ajax_ece_major_info', 'ajax_ece_major_info' );
-add_action('wp_ajax_nopriv_ece_major_info', 'ajax_ece_major_info');
+<?php 
+
+function ece_scripts() {
+	wp_enqueue_style( 'ece-style', get_stylesheet_directory_uri() . '/css/ece.css');
+	wp_enqueue_script('ece-custom', get_stylesheet_directory_uri().'/js/custom.js', array('jquery', 'cs'));
+	wp_localize_script( 'ece-custom', 'ece_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ), 'siteurl' => site_url() ) );
+}
+add_action( 'wp_enqueue_scripts', 'ece_scripts');
+
+function ece_get_courses( $discipline ){
+	$ch = curl_init();
+	curl_setopt($ch, CURLOPT_URL,"http://web2.uconn.edu/ece/preadvising/pread_course.php");
+	curl_setopt($ch, CURLOPT_POST, 1);
+	curl_setopt($ch, CURLOPT_POSTFIELDS, 'discipline='.$discipline);
+	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
+	$courses = curl_exec($ch);
+	curl_close ($ch);
+
+	return json_decode($courses);
+}
+
+function ajax_ece_discipline_courses(){
+	$discipline = $_POST['discipline'];
+
+	$courses = ece_get_courses( urlencode($discipline) );
+
+	echo wp_json_encode( $courses );
+	wp_die();
+}
+add_action( 'wp_ajax_ece_discipline_courses', 'ajax_ece_discipline_courses' );
+add_action('wp_ajax_nopriv_ece_discipline_courses', 'ajax_ece_discipline_courses');
+
+function ece_get_course_info( $discipline, $course ){
+	$ch = curl_init();
+	curl_setopt($ch, CURLOPT_URL,"http://web2.uconn.edu/ece/preadvising/pread_course.php");
+	curl_setopt($ch, CURLOPT_POST, 1);
+	curl_setopt($ch, CURLOPT_POSTFIELDS, 'course='.$course.'&discipline='.$discipline);
+	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
+	$courses = curl_exec($ch);
+	curl_close ($ch);
+
+	return json_decode($courses);	
+}
+
+function ajax_ece_course_info(){
+	$discipline = $_POST['discipline'];
+	$course = $_POST['course'];
+
+	$courseInfo = ece_get_course_info( urlencode($discipline), urlencode($course) );
+
+	echo wp_json_encode( $courseInfo );
+	wp_die();
+}
+add_action( 'wp_ajax_ece_course_info', 'ajax_ece_course_info' );
+add_action('wp_ajax_nopriv_ece_course_info', 'ajax_ece_course_info');
+
+function ece_get_major_info( $major ){
+	$ch = curl_init();
+	curl_setopt($ch, CURLOPT_URL,"http://web2.uconn.edu/ece/preadvising/pread_major.php");
+	curl_setopt($ch, CURLOPT_POST, 1);
+	curl_setopt($ch, CURLOPT_POSTFIELDS, 'major='.$major);
+	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
+	$info = curl_exec($ch);
+	curl_close ($ch);
+
+	return json_decode($info);		
+}
+
+function ajax_ece_major_info(){
+	$major = $_POST['major'];
+	
+	$majorInfo = ece_get_major_info( urlencode($major) );
+	
+	echo wp_json_encode( $majorInfo );
+	wp_die();	
+}
+add_action( 'wp_ajax_ece_major_info', 'ajax_ece_major_info' );
+add_action('wp_ajax_nopriv_ece_major_info', 'ajax_ece_major_info');
 ?>
\ No newline at end of file
diff --git a/js/custom.js b/js/custom.js
index 6f29951..fc470b3 100644
--- a/js/custom.js
+++ b/js/custom.js
@@ -1,137 +1,178 @@
-jQuery(document).ready(function($) {
-
-    $( ".social-vimeo > a" ).html( "DONATE" );
-
-	var search = '';
-	var active = false;
-	$('.search').on('click',function(e){
-		if($(e.target).attr('id')=='s') return;
-		active = true;
-		search = $(e.target).parent().html();
-		$('.search').fadeOut(500,function(){
-			$(this).html('<form class="form-inline" role="form" method="get" action="http://ece.uconn.edu/"><input id="s" type="text" onfocus="this.value = \'\'" name="s" value="Search ECE"></form>').fadeIn(500);
-			$(this).addClass('search-field');
-		});
-	});
-
-	$('body').on('click',function(e){
-		if($(e.target).attr('id')=='s') return;
-		if($(e.target).parent().html()== search) return;
-		if(!active) return;
-		active = false;
-		$('.search').fadeOut(500,function(){
-			$(this).html(search).fadeIn(500);
-			$('.search').removeClass('search-field');
-		});
-	});
-
-	$( "#footers" ).before( "<div class='container'><div class='col-sm-12 footer-img'></div></div>" );
-
-	$('select[name="discipline"] option:eq(0)').prop("selected", true);
-	$('select[name="major"] option:eq(0)').prop("selected", true);
-
-	var isCourseSelectActive = false;
-	var selectedDiscipline;
-	$('select[name="discipline"]').change(function(e){
-		var discipline = $(this).find(":selected").text();
-		selectedDiscipline = discipline;
-		$.ajax({
-			type: "POST",
-			url: ece_object.ajaxurl,
-			data: {
-				action: "ece_discipline_courses",
-				discipline : discipline
-			},
-			success: function(response){
-				if( isCourseSelectActive == true ){
-					$('.course-option').remove();
-				}
-				$.each(response, function(i,v){
-					$('select[name="course"]').append(
-						$('<option />', {
-							'value': v,
-							'text': v,
-							'class': "course-option"
-						})
-					);
-				});
-				$('select[name="course"]').show();
-				isCourseSelectActive = true;
-			}, dataType: "json"
-		});
-	});
-
-	var isCourseInfoVisible = false;
-	$('select[name="course"]').change(function(e){
-		if( isCourseSelectActive == false || selectedDiscipline == undefined ){
-			return false;
-		}
-		var course = $(this).find(":selected").text();
-		$.ajax({
-			type: "POST",
-			url: ece_object.ajaxurl,
-			data: {
-				action: "ece_course_info",
-				discipline: selectedDiscipline,
-				course: course
-			},
-			success: function(response){
-				if( isCourseInfoVisible == true ){
-					$('#ece-course-learnmore').empty();
-					$('.major-requiredcourses').remove();
-				}
-
-				var courseInfo = response[0];
-				$('#ece-course-name').text(courseInfo.discipline + " " + courseInfo.course);
-				$('#ece-course-learnmore').html( $('#ece-course-learnmore').text() + ' <a href="'+courseInfo.url+'">'+courseInfo.url+'</a>' );
-				$.each(courseInfo.majors, function(i,v){
-					$('#ece-course-required ul').append(
-						$('<li />', {
-							'text': v.major,
-							'class': "major-requiredcourses"
-						})
-					);
-				});
-				$('#ece-course').show();
-				isCourseInfoVisible = true;
-			}, dataType: "json"
-		});
-	});
-
-	var isListVisible = false;
-	$('select[name="major"]').change(function(e){
-		var major = $(this).find(":selected").text();
-		$.ajax({
-			type: "POST",
-			url: ece_object.ajaxurl,
-			data: {
-				action: "ece_major_info",
-				major: major,
-			},
-			success: function(response){
-				if( isListVisible == true ){
-					$('.major-courses').remove();
-				}
-
-				var majorInfo = response[0];
-				$('#ece-major-name').text(majorInfo.major);
-				$('#ece-major-url').html('<a href="'+majorInfo.url+'">'+majorInfo.url+'</a>');
-				$('ece-major-text').text("UConn ECE offers the following courses which lead to a major in "+majorInfo.major);
-				$.each(majorInfo.courses, function(i,v){
-					$('#ece-major-courses ul').append(
-						$('<li />', {
-							'text': v.discipline + " " + v.course,
-							'class': "major-courses"
-						})
-					);
-				});
-				$('#ece-major').show();
-				isListVisible = true;
-			}, dataType: "json"
-		});
-	});
-});
-
-
-
-
+jQuery(document).ready(function($) {
+
+    $( ".social-vimeo > a" ).html( "DONATE" );
+
+	var search = '';
+	var active = false;
+	$('.search').on('click',function(e){
+		if($(e.target).attr('id')=='s') return;
+		active = true;
+		search = $(e.target).parent().html();
+		$('.search').fadeOut(500,function(){
+			$(this).html('<form class="form-inline" role="form" method="get" action="http://ece.uconn.edu/"><input id="s" type="text" onfocus="this.value = \'\'" name="s" value="Search ECE"></form>').fadeIn(500);
+			$(this).addClass('search-field');
+		});
+	});
+
+	$('body').on('click',function(e){
+		if($(e.target).attr('id')=='s') return;
+		if($(e.target).parent().html()== search) return;
+		if(!active) return;
+		active = false;
+		$('.search').fadeOut(500,function(){
+			$(this).html(search).fadeIn(500);
+			$('.search').removeClass('search-field');
+		});
+	});
+
+	$( "#footers" ).before( "<div class='container'><div class='col-sm-12 footer-img'></div></div>" );
+
+	$('select[name="discipline"] option:eq(0)').prop("selected", true);
+	$('select[name="major"] option:eq(0)').prop("selected", true);
+
+	var isCourseSelectActive = false;
+	var selectedDiscipline;
+	$('select[name="discipline"]').change(function(e){
+		var discipline = $(this).find(":selected").text();
+		selectedDiscipline = discipline;
+		$.ajax({
+			type: "POST",
+			url: ece_object.ajaxurl,
+			data: {
+				action: "ece_discipline_courses",
+				discipline : discipline
+			},
+			success: function(response){
+				if( isCourseSelectActive == true ){
+					$('.course-option').remove();
+				}
+				$.each(response, function(i,v){
+					$('select[name="course"]').append(
+						$('<option />', {
+							'value': v,
+							'text': v,
+							'class': "course-option"
+						})
+					);
+				});
+				$('select[name="course"]').show();
+				isCourseSelectActive = true;
+				eceStickyFoot();
+			}, dataType: "json"
+		});
+	});
+
+	var isCourseInfoVisible = false;
+	$('select[name="course"]').change(function(e){
+		if( isCourseSelectActive == false || selectedDiscipline == undefined ){
+			return false;
+		}
+		var course = $(this).find(":selected").text();
+		$.ajax({
+			type: "POST",
+			url: ece_object.ajaxurl,
+			data: {
+				action: "ece_course_info",
+				discipline: selectedDiscipline,
+				course: course
+			},
+			success: function(response){
+				if( isCourseInfoVisible == true ){
+					$('#ece-course-learnmore').empty();
+					$('.major-requiredcourses').remove();
+				}
+
+				var courseInfo = response[0];
+				$('#ece-course-name').text(courseInfo.discipline + " " + courseInfo.course);
+				$('#ece-course-learnmore').html( $('#ece-course-learnmore').text() + ' <a href="'+courseInfo.url+'">'+courseInfo.url+'</a>' );
+				$.each(courseInfo.majors, function(i,v){
+					$('#ece-course-required ul').append(
+						$('<li />', {
+							'text': v.major,
+							'class': "major-requiredcourses"
+						})
+					);
+				});
+				$('#ece-course').show();
+				isCourseInfoVisible = true;
+				eceStickyFoot();
+			}, dataType: "json"
+		});
+	});
+
+	var isListVisible = false;
+	$('select[name="major"]').change(function(e){
+		var major = $(this).find(":selected").text();
+		$.ajax({
+			type: "POST",
+			url: ece_object.ajaxurl,
+			data: {
+				action: "ece_major_info",
+				major: major,
+			},
+			success: function(response){
+				if( isListVisible == true ){
+					$('.major-courses').remove();
+				}
+
+				var majorInfo = response[0];
+				$('#ece-major-name').text(majorInfo.major);
+				$('#ece-major-url').html('<a href="'+majorInfo.url+'">'+majorInfo.url+'</a>');
+				$('ece-major-text').text("UConn ECE offers the following courses which lead to a major in "+majorInfo.major);
+				$.each(majorInfo.courses, function(i,v){
+					$('#ece-major-courses ul').append(
+						$('<li />', {
+							'text': v.discipline + " " + v.course,
+							'class': "major-courses"
+						})
+					);
+				});
+				$('#ece-major').show();
+				isListVisible = true;
+				eceStickyFoot();
+			}, dataType: "json"
+		});
+	});
+	
+	// STICKY FOOTER
+	// measures height of the page, and applies a class to absolute position the footer, or not. 
+	// on short pages, it sticks; on tall pages, it doesn't. 
+	
+	function eceStickyFoot(){
+		if (document.getElementById('page')!=null && document.getElementById('footers') !=null){
+			var wrapperH = $('#page').outerHeight();
+			var footerImgH = $('.footer-img').parent().outerHeight();
+			var wpadminbarH = $('#wpadminbar').outerHeight();
+			var ucheaderH = $('#uc-header').outerHeight();
+			var footerH = $('#footers').outerHeight();
+			var windowH = window.innerHeight;
+			var gformH = 0;
+			$('.gform_wrapper').each(function(){
+				gformH = gformH + $(this).outerHeight();
+			});
+			windowH = windowH - wpadminbarH - ucheaderH;
+			wrapperH = wrapperH + footerH + footerImgH;
+			if(windowH>=wrapperH){
+				$('body').addClass('sticky');
+			} else {
+				$('body').removeClass('sticky');
+			}
+		}
+	}
+	$(document).ready(function(){
+		eceStickyFoot();
+	});
+	$(window).resize(function() {
+		eceStickyFoot();
+	});
+	$(window).load(function() {
+		eceStickyFoot();
+	});
+	
+	$('.panel, .collapse').on('shown.bs.collapse', function (e) {
+	   eceStickyFoot();
+	})
+	$('.panel, .collapse').on('hidden.bs.collapse', function (e) {
+	   eceStickyFoot();
+	})
+});
\ No newline at end of file
diff --git a/js/min/custom.min.js b/js/min/custom.min.js
index b4fedb1..2a1c955 100644
--- a/js/min/custom.min.js
+++ b/js/min/custom.min.js
@@ -1 +1 @@
-jQuery(document).ready(function(t){t(".social-vimeo > a").html("DONATE");var e="",a=!1;t(".search").on("click",function(o){"s"!=t(o.target).attr("id")&&(a=!0,e=t(o.target).parent().html(),t(".search").fadeOut(500,function(){t(this).html('<form class="form-inline" role="form" method="get" action="http://ece.uconn.edu/"><input id="s" type="text" onfocus="this.value = \'\'" name="s" value="Search ECE"></form>').fadeIn(500),t(this).addClass("search-field")}))}),t("body").on("click",function(o){"s"!=t(o.target).attr("id")&&t(o.target).parent().html()!=e&&a&&(a=!1,t(".search").fadeOut(500,function(){t(this).html(e).fadeIn(500),t(".search").removeClass("search-field")}))}),t("#footers").before("<div class='container'><div class='col-sm-12 footer-img'></div></div>")});
\ No newline at end of file
+jQuery(document).ready(function(t){t(".social-vimeo > a").html("DONATE");var e="",a=!1;t(".search").on("click",function(i){"s"!=t(i.target).attr("id")&&(a=!0,e=t(i.target).parent().html(),t(".search").fadeOut(500,function(){t(this).html('<form class="form-inline" role="form" method="get" action="http://ece.uconn.edu/"><input id="s" type="text" onfocus="this.value = \'\'" name="s" value="Search ECE"></form>').fadeIn(500),t(this).addClass("search-field")}))}),t("body").on("click",function(i){"s"!=t(i.target).attr("id")&&t(i.target).parent().html()!=e&&a&&(a=!1,t(".search").fadeOut(500,function(){t(this).html(e).fadeIn(500),t(".search").removeClass("search-field")}))}),t("#footers").before("<div class='container'><div class='col-sm-12'><img src='img/ece_title.png' alt='ECE logo'></div></div>")});
\ No newline at end of file
diff --git a/preadvising-page.php b/preadvising-page.php
index 5ba37b1..80874ca 100644
--- a/preadvising-page.php
+++ b/preadvising-page.php
@@ -50,50 +50,71 @@ function getByMajor(){
 }
 
 get_header();
-
-$majors = getByCourse();
-echo '<select name="discipline">';
-foreach( $majors as $k=>$m ){
-	if( empty($m) ){
-		$m = "Select a discipline";
-	}
-	echo '<option value="'.$k.'">'.$m.'</option>';
-}
-echo '</select>';
-?>
-
-<br>
-<select name="course" style="display:none"><option value="0">Select a course</option></select>
-<div id="ece-course" style="display:none">
-	<p id="ece-course-name"></p>
-    <p id="ece-course-learnmore">Learn more about the department at: </p>
-    <div id="ece-course-required">
-    	<p>This course is also a required course for the following majors:</p>
-    	<ul></ul>
-    </div>
-</div>
-
-<br><br>
-
-<?php
-$getByMajor = getByMajor();
-echo '<select name="major">';
-foreach( $getByMajor as $k=>$m ){
-	if( empty($m) ){
-		$m = "Select a major";
-	}
-	echo '<option value="'.$k.'">'.$m.'</option>';
-}
-echo '</select>';
 ?>
-<div id="ece-major" style="display:none">
-	<p id="ece-major-name"></p>
-    <p id="ece-major-url"></p>
-    <div id="ece-major-courses">
-    	<p id="ece-major-text"></p>
-        <ul></ul>
-    </div>
-    <p>To see if your schools offers these courses, see the Guidance Director at your high school.</p>
+<div id="page-advising">
+	<div class="row">
+    	<div class="col-sm-12">
+			<main id="main" class="site-main" role="main">
+            
+            <?php while ( have_posts() ) : the_post(); ?>
+            <?php get_the_title() ?>
+            <?php get_template_part( 'content', 'page' ); ?>
+            
+            <?php endwhile; // end of the loop. ?>
+            	<div class="col-sm-6 left-courses">
+                <h2> Select by Course</h2>
+					<?php
+                    $majors = getByCourse();
+                    echo '<select name="discipline" class="select-discipline">';
+                    foreach( $majors as $k=>$m ){
+                        if( empty($m) ){
+                            $m = "Select a discipline";
+                        }
+                        echo '<option value="'.$k.'">'.$m.'</option>';
+                    }
+                    echo '</select>';
+                    ?>
+            
+                    <br>
+                    <select name="course" style="display:none" class="select-course"><option value="0">Select a course</option></select>
+                    <div id="ece-course" style="display:none">
+                        <p id="ece-course-name"></p>
+                        <p id="ece-course-learnmore">Learn more about the department at: </p>
+                        <div id="ece-course-required">
+                            <p>This course is also a required course for the following majors:</p>
+                            <ul></ul>
+                        </div>
+                    </div>
+                    
+                    <br><br>
+               </div>
+               
+               <div class="col-sm-6"> 
+                <h2> Select by Major</h2>
+					<?php
+                    $getByMajor = getByMajor();
+                    echo '<select name="major">';
+                    foreach( $getByMajor as $k=>$m ){
+                        if( empty($m) ){
+                            $m = "Select a major";
+                        }
+                        echo '<option value="'.$k.'">'.$m.'</option>';
+                    }
+                    echo '</select>';
+                    ?>
+                    <div id="ece-major" style="display:none">
+                        <p id="ece-major-name"></p>
+                        <p id="ece-major-url"></p>
+                        <div id="ece-major-courses">
+                            <p id="ece-major-text"></p>
+                            <ul></ul>
+                        </div>
+                        <p>To see if your schools offers these courses, see the Guidance Director at your high school.</p>
+                   </div>
+                </main>
+            </div>
+        </div>
+ 	</div>
 </div>
 <?php
 get_footer();
diff --git a/sass/ece.scss b/sass/ece.scss
index a028049..90e5636 100644
--- a/sass/ece.scss
+++ b/sass/ece.scss
@@ -471,9 +471,8 @@ body.home {
 /* ----------------------------- Default Page Styles ----------------------------- */
 
 
-#page-page, #page-blank, #page-userlist, #page-user-profile .col-sm-9, #page-single, #page-archive {
+#page-page, #page-blank, #page-userlist, #page-user-profile .col-sm-9, #page-single, #page-archive, #page-advising {
 	background-color:#FAFAFA;
-	border:1px solid #EBEBEB;
 	
 	.row:nth-child(1) {
 		background-color:#FAFAFA;
@@ -503,6 +502,10 @@ body.home {
 	}
 }
 
+#page-user-profile .col-sm-9 {
+	border:1px solid #EBEBEB;
+}
+
 /* ----------------------------- Page Blank ----------------------------- */
 
 #page-blank {
@@ -584,6 +587,45 @@ body.home {
 	}
 }
 
+/* ----------------------------- Page Advising ----------------------------- */
+
+#page-advising {
+	.left-courses {
+		/*padding-left:0;
+		padding-right:0;
+		border-right:1px solid red;*/
+	}
+	.select-course {
+		margin-top:10px;
+	}
+	#ece-course {
+		margin-top:30px;
+		
+		#ece-course-name {
+			font-family: 'bebas_neue_regularregular', helvetica, arial, sans-serif;
+			font-size:30px;
+			letter-spacing:0.5px;
+			text-shadow: 0px 1px 0px white;
+			color:#4B4B4B; 
+		}
+	}
+	#ece-major {
+		margin-top:30px;
+		
+		#ece-major-name {
+			font-family: 'bebas_neue_regularregular', helvetica, arial, sans-serif;
+			font-size:30px;
+			letter-spacing:0.5px;
+			text-shadow: 0px 1px 0px white;
+			color:#4B4B4B; 
+			line-height:1em;
+		}
+	}
+	input, button, select, textarea {
+		width: 85%;
+	}
+}
+
 /* ----------------------------- Archive/Blog ----------------------------- */
 
 #page-single, #page-archive {