diff --git a/source/assets/js/components/sass-syntax-switcher.js b/source/assets/js/components/sass-syntax-switcher.js index d30fe6e..a617998 100644 --- a/source/assets/js/components/sass-syntax-switcher.js +++ b/source/assets/js/components/sass-syntax-switcher.js @@ -1,18 +1,24 @@ $(function() { - $( "#topic-2" ).tabs(); - $( "#topic-3" ).tabs(); - $( "#topic-5" ).tabs(); - $( "#topic-6" ).tabs(); - $( "#topic-7" ).tabs(); - $( "#topic-8" ).tabs(); + // Initialize the tabs (Sass/SCSS) with jQuery-ui + $( ".slides ul" ).parent().tabs(); - // Hover states on the static widgets - $( "#dialog-link, #icons li" ).hover( - function() { - $( this ).addClass( "ui-state-hover" ); - }, - function() { - $( this ).removeClass( "ui-state-hover" ); - } - ); + // Switch ALL the tabs (Sass/SCSS) together + var + noRecursion = false, + jqA = $( "a.ui-tabs-anchor" ), + jqASass = jqA.filter( ":contains('Sass')" ).click(function() { + if ( !noRecursion ) { + noRecursion = true; + jqASass.not( this ).click(); + noRecursion = false; + } + }), + jqASCSS = jqA.filter( ":contains('SCSS')" ).click(function() { + if ( !noRecursion ) { + noRecursion = true; + jqASCSS.not( this ).click(); + noRecursion = false; + } + }) + ; }); diff --git a/source/code-snippets/_homepage-extend-sass.md b/source/code-snippets/_homepage-extend-sass.md index 1366765..02d4138 100644 --- a/source/code-snippets/_homepage-extend-sass.md +++ b/source/code-snippets/_homepage-extend-sass.md @@ -4,15 +4,19 @@ padding: 10px color: #333 + .success @extend .message border-color: green + .error @extend .message border-color: red + .warning @extend .message border-color: yellow + ``` diff --git a/source/code-snippets/_homepage-import-1-sass.md b/source/code-snippets/_homepage-import-1-sass.md index a065871..454364b 100644 --- a/source/code-snippets/_homepage-import-1-sass.md +++ b/source/code-snippets/_homepage-import-1-sass.md @@ -7,4 +7,5 @@ ul, ol margin: 0 padding: 0 + ``` diff --git a/source/code-snippets/_homepage-import-2-sass.md b/source/code-snippets/_homepage-import-2-sass.md index 1123e26..c3d8d63 100644 --- a/source/code-snippets/_homepage-import-2-sass.md +++ b/source/code-snippets/_homepage-import-2-sass.md @@ -6,4 +6,5 @@ body font: 100% Helvetica, sans-serif background-color: #efefef + ``` diff --git a/source/code-snippets/_homepage-nesting-css.md b/source/code-snippets/_homepage-nesting-css.md index 14b5e4c..aba6c8e 100644 --- a/source/code-snippets/_homepage-nesting-css.md +++ b/source/code-snippets/_homepage-nesting-css.md @@ -14,4 +14,4 @@ nav a { padding: 6px 12px; text-decoration: none; } -``` \ No newline at end of file +``` diff --git a/source/code-snippets/_homepage-nesting-sass.md b/source/code-snippets/_homepage-nesting-sass.md index f7e539b..0a3aa4a 100644 --- a/source/code-snippets/_homepage-nesting-sass.md +++ b/source/code-snippets/_homepage-nesting-sass.md @@ -12,4 +12,6 @@ nav display: block padding: 6px 12px text-decoration: none + + ``` diff --git a/source/code-snippets/_homepage-operators-css.md b/source/code-snippets/_homepage-operators-css.md index be26181..b7a53f4 100644 --- a/source/code-snippets/_homepage-operators-css.md +++ b/source/code-snippets/_homepage-operators-css.md @@ -12,4 +12,4 @@ aside[role="complimentary"] { float: right; width: 31.25%; } -``` \ No newline at end of file +``` diff --git a/source/code-snippets/_homepage-operators-sass.md b/source/code-snippets/_homepage-operators-sass.md index 0189860..9ed00b2 100644 --- a/source/code-snippets/_homepage-operators-sass.md +++ b/source/code-snippets/_homepage-operators-sass.md @@ -6,7 +6,9 @@ article[role="main"] float: left width: 600px / 960px * 100% + aside[role="complimentary"] float: right width: 300px / 960px * 100% + ``` diff --git a/source/code-snippets/_homepage-operators-scss.md b/source/code-snippets/_homepage-operators-scss.md index de855c7..ad5178f 100644 --- a/source/code-snippets/_homepage-operators-scss.md +++ b/source/code-snippets/_homepage-operators-scss.md @@ -1,6 +1,7 @@ ```scss .container { width: 100%; } + article[role="main"] { float: left; width: 600px / 960px * 100%; @@ -10,4 +11,4 @@ aside[role="complimentary"] { float: right; width: 300px / 960px * 100%; } -``` \ No newline at end of file +``` diff --git a/source/code-snippets/_homepage-variables-sass.md b/source/code-snippets/_homepage-variables-sass.md index 7197927..a0f2c5f 100644 --- a/source/code-snippets/_homepage-variables-sass.md +++ b/source/code-snippets/_homepage-variables-sass.md @@ -5,4 +5,5 @@ $primary-color: #333 body font: 100% $font-stack color: $primary-color + ```