windhamdavid 4 years ago
parent
commit
e40c5f87b0
3 changed files with 155 additions and 57 deletions
  1. 27 19
      js/studio.js
  2. 67 32
      page-studio.php
  3. 61 6
      style.css

+ 27 - 19
js/studio.js

@@ -46,6 +46,11 @@ jQuery(document).ready(function($) {
 		var anima = new DrawFillSVG({elementId: 'svg-imac'});
 		anima.replay();
 	};
+	
+	$('.studio-subnav a').click(function (e) {
+	  e.preventDefault()
+	  $(this).tab('show')
+	})
 
 	$(document).bind('keyup', function(e) {
 	    if(e.which === 39){
@@ -60,6 +65,7 @@ jQuery(document).ready(function($) {
 		var consta = $(event.target);
 		setTimeout(function() {
 			if (consta.find('.item.active').data('id') === 0) {
+				$('.studio-subnav a[href="#studio"]').tab('show')
 				$('#studio-caro').addClass('caro-grad5').removeClass('caro-grad caro-grad3 caro-grad2 caro-grad5');
 				$('.site-title a').addClass('light');
 				$('.carousel-indicators li').removeClass('darken-carousel-indicators');
@@ -67,39 +73,56 @@ jQuery(document).ready(function($) {
 				$("#studio-caro").wallpaper({source: "../wp-content/themes/dw/img/desk2.jpg"});
 			}
 			if (consta.find('.item.active').data('id') === 1) {
+				$('.studio-subnav a[href="#webdev"]').tab('show')
+				$('.active #svg-imac.screen').delay(2500).queue(function(screenit){
+				    $(this).attr('class', 'bg');
+				    screenit();
+				});
 				$('#studio-caro').addClass('caro-grad').removeClass('caro-grad3 caro-grad2 caro-grad5');
 				$('.site-title a').addClass('light');
 				$('.carousel-indicators li').removeClass('darken-carousel-indicators');
 				$("#studio-caro").wallpaper("destroy");
 			}
 			if (consta.find('.item.active').data('id') === 2) {
+				$('.studio-subnav a[href="#ux"]').tab('show')
 				$('#studio-caro').addClass('caro-grad2').removeClass('caro-grad caro-grad3 caro-grad5');
 				$('.site-title a').addClass('light');
 				$('.carousel-indicators li').removeClass('darken-carousel-indicators');
 				$("#studio-caro").wallpaper("destroy");
 			}
-			if (consta.find('.item.active').data('id') === 3) {	
+			if (consta.find('.item.active').data('id') === 3) {
+				$('.studio-subnav a[href="#graphic"]').tab('show')	
 				$( '#studio-caro' ).addClass('caro-grad3').removeClass('caro-grad2 caro-grad caro-grad5');
 				$('.site-title a').removeClass('light');
 				$('.carousel-indicators li').addClass('darken-carousel-indicators');
 				$("#studio-caro").wallpaper("destroy");
 			}
-			if (consta.find('.item.active').data('id') === 4) {	
+			if (consta.find('.item.active').data('id') === 4) {
+				$('.studio-subnav a[href="#media"]').tab('show')
 				$('#studio-caro').removeClass('caro-grad caro-grad3').addClass('caro-grad5');
 				$('.site-title a').addClass('light');
 				$('.carousel-indicators li').removeClass('darken-carousel-indicators');
 				$("#studio-caro").wallpaper("destroy");
 				$("#studio-caro").wallpaper({source: {poster:"../wp-content/themes/dw/img/camera.jpg",mp4:"../wp-content/themes/dw/img/camera.mp4"}});
 			}
-			if (consta.find('.item.active').data('id') === 5) {	
+			if (consta.find('.item.active').data('id') === 5) {
+				$('.studio-subnav a[href="#art"]').tab('show')
 				$( '#studio-caro' ).addClass('caro-grad5').removeClass('caro-grad2 caro-grad caro-grad3');
 				$('.site-title a').addClass('light');
-				$('.carousel-indicators li').addClass('darken-carousel-indicators');
+				$('.carousel-indicators li').removeClass('darken-carousel-indicators');
 				$("#studio-caro").wallpaper("destroy");
 				$("#studio-caro").wallpaper({source: "../wp-content/themes/dw/img/paints2.jpg"});
 			}
 		}, 10);
 	});
+	
+	$('#caro').on('slide.bs.carousel', function() {
+		$('.active #svg-imac.bg').attr('class', 'svg screen');
+		$('.active .animac').addClass('fade-svg').delay(1000).queue(function(hideit){
+		    $(this).addClass('hide-svg');
+		    hideit();
+		});
+	});
 
 	$('#caro').on('slid.bs.carousel', function() {
 		$('.active .animac').removeClass('hide-svg fade-svg');
@@ -112,20 +135,5 @@ jQuery(document).ready(function($) {
 		animac2.replay();
 		animac3.replay();
 	});
-
-	$('#caro').on('slide.bs.carousel', function() {
-		$('.active #svg-imac.bg').attr('class', 'svg screen');
-		$('.active .animac').addClass('fade-svg').delay(1000).queue(function(hideit){
-		    $(this).addClass('hide-svg');
-		    hideit();
-		});
-	});
-
-	$('#caro').on('slid.bs.carousel', function() {
-		$('.active #svg-imac.screen').delay(2500).queue(function(screenit){
-		    $(this).attr('class', 'bg');
-		    screenit();
-		});
-	});
 			
 });

File diff suppressed because it is too large
+ 67 - 32
page-studio.php


+ 61 - 6
style.css

@@ -151,6 +151,16 @@ input,button,select,textarea {
 	font-size: inherit;
 	line-height: inherit;
 }
+.firstcharacter { 
+	float: left; 
+	color: #000; 
+	font-size: 58px; 
+	line-height: 34px; 
+	padding-top: 4px; 
+	padding-right: 6px; 
+	padding-left: 0px; 
+	font-family: Georgia; 
+	}
 .tight {
 	margin: 3px 0;
 }
@@ -184,7 +194,7 @@ em {
 	letter-spacing: -2px;
 }
 .super-duper {
-	font-size: 123px;
+	font-size: 100px;
 	font-weight: bold;
 	letter-spacing: -2px;
 }
@@ -646,7 +656,7 @@ h5.contact {
 	min-height: 400px;
 }
 #caro {
-	min-height: 400px;
+	min-height: 300px;
 }
 .hide-svg {
 	visibility: hidden;
@@ -674,7 +684,7 @@ h5.contact {
 }
 #caro #svg-device {
 	float:right;
-	margin-top:-70px;
+	margin-top:-115px;
 }
 #studio-caro {
 	-webkit-transition: all 1s ease;
@@ -682,6 +692,10 @@ h5.contact {
 	-o-transition: all 1s ease;
 	transition: all 1s ease;
 }
+#studio-caro  .carousel-indicators {
+	left: 10%;
+	bottom: 0;
+}
 .caro-grad_old {
 	background: #5E7A9B;
 	background: -webkit-linear-gradient(top, #355069 0, #5e7a9b 100%);
@@ -828,9 +842,6 @@ h5.contact {
 	-moz-transition:all .3s linear;
 	transition:all .3s linear
 }
-@media screen and (max-width:767px){
-	.carousel-caption { display:none }
-}
 
 /*============================================
 					Navbar 
@@ -1157,6 +1168,46 @@ img.dw {
 	width:100%;
 	margin: 30px 0 30px;
 }
+.studio-tools{
+	border-left: 1px solid #cecece;
+	margin: 28px 0px;
+	padding: 0 10px;
+}
+.studio-subnav {
+	border-right: 1px solid #cecece;
+	margin: 28px 0px;
+	padding: 0 10px;
+}
+.studio-subnav a {
+	color: #000;
+	text-decoration: none;
+}
+.studio-subnav li.active a {
+	color: #FF0000;
+	text-decoration: none;
+}
+.studio-subnav li.active .fa {
+	color: #FF0000;
+}
+.studio-subnav a:hover {
+	color: #FF0000;
+	text-decoration: none;
+}
+.studio-subnav .fa {
+	color: #000;
+	text-decoration: none;
+}
+#studio-tab h4 {
+	line-height: 24px;
+}
+.studio-top.affix {
+	position: fixed;
+	top: 0;
+	z-index: 100;
+	background: #fff;
+	width: 100%
+}
+
 
 /*===== Structure =====*/
 .a:hover {
@@ -1188,6 +1239,10 @@ img.dw {
 	float: none;
 	margin: 0 auto;
 }
+.border-left {
+	border-left: 1px solid #333;
+}
+
 article#main {
 	padding: 0px;
 }