├── .gitignore ├── LICENSE ├── README.md ├── css ├── application.css └── application.css.map ├── fonts ├── abolition-regular-webfont.eot ├── abolition-regular-webfont.ttf └── abolition-regular-webfont.woff ├── gulpfile.js ├── img ├── arrow.svg ├── bear.jpg ├── mountains.jpg ├── mtn-landscape.jpg └── resort.jpg ├── index.html ├── js ├── app.js ├── app.js.map ├── app.min.js ├── jquery.js ├── main.js └── sticky │ └── jquery.sticky.js ├── package.json └── scss ├── application.scss ├── base ├── _base.scss ├── _index.scss ├── _mixins.scss └── _variables.scss ├── components ├── _buttons.scss ├── _icons.scss ├── _index.scss └── _typography.scss └── layout ├── _columns.scss ├── _containers.scss ├── _extends.scss ├── _footer.scss ├── _header.scss └── _index.scss /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | CC0 1.0 Universal 2 | 3 | Statement of Purpose 4 | 5 | The laws of most jurisdictions throughout the world automatically confer 6 | exclusive Copyright and Related Rights (defined below) upon the creator and 7 | subsequent owner(s) (each and all, an "owner") of an original work of 8 | authorship and/or a database (each, a "Work"). 9 | 10 | Certain owners wish to permanently relinquish those rights to a Work for the 11 | purpose of contributing to a commons of creative, cultural and scientific 12 | works ("Commons") that the public can reliably and without fear of later 13 | claims of infringement build upon, modify, incorporate in other works, reuse 14 | and redistribute as freely as possible in any form whatsoever and for any 15 | purposes, including without limitation commercial purposes. These owners may 16 | contribute to the Commons to promote the ideal of a free culture and the 17 | further production of creative, cultural and scientific works, or to gain 18 | reputation or greater distribution for their Work in part through the use and 19 | efforts of others. 20 | 21 | For these and/or other purposes and motivations, and without any expectation 22 | of additional consideration or compensation, the person associating CC0 with a 23 | Work (the "Affirmer"), to the extent that he or she is an owner of Copyright 24 | and Related Rights in the Work, voluntarily elects to apply CC0 to the Work 25 | and publicly distribute the Work under its terms, with knowledge of his or her 26 | Copyright and Related Rights in the Work and the meaning and intended legal 27 | effect of CC0 on those rights. 28 | 29 | 1. Copyright and Related Rights. A Work made available under CC0 may be 30 | protected by copyright and related or neighboring rights ("Copyright and 31 | Related Rights"). Copyright and Related Rights include, but are not limited 32 | to, the following: 33 | 34 | i. the right to reproduce, adapt, distribute, perform, display, communicate, 35 | and translate a Work; 36 | 37 | ii. moral rights retained by the original author(s) and/or performer(s); 38 | 39 | iii. publicity and privacy rights pertaining to a person's image or likeness 40 | depicted in a Work; 41 | 42 | iv. rights protecting against unfair competition in regards to a Work, 43 | subject to the limitations in paragraph 4(a), below; 44 | 45 | v. rights protecting the extraction, dissemination, use and reuse of data in 46 | a Work; 47 | 48 | vi. database rights (such as those arising under Directive 96/9/EC of the 49 | European Parliament and of the Council of 11 March 1996 on the legal 50 | protection of databases, and under any national implementation thereof, 51 | including any amended or successor version of such directive); and 52 | 53 | vii. other similar, equivalent or corresponding rights throughout the world 54 | based on applicable law or treaty, and any national implementations thereof. 55 | 56 | 2. Waiver. To the greatest extent permitted by, but not in contravention of, 57 | applicable law, Affirmer hereby overtly, fully, permanently, irrevocably and 58 | unconditionally waives, abandons, and surrenders all of Affirmer's Copyright 59 | and Related Rights and associated claims and causes of action, whether now 60 | known or unknown (including existing as well as future claims and causes of 61 | action), in the Work (i) in all territories worldwide, (ii) for the maximum 62 | duration provided by applicable law or treaty (including future time 63 | extensions), (iii) in any current or future medium and for any number of 64 | copies, and (iv) for any purpose whatsoever, including without limitation 65 | commercial, advertising or promotional purposes (the "Waiver"). Affirmer makes 66 | the Waiver for the benefit of each member of the public at large and to the 67 | detriment of Affirmer's heirs and successors, fully intending that such Waiver 68 | shall not be subject to revocation, rescission, cancellation, termination, or 69 | any other legal or equitable action to disrupt the quiet enjoyment of the Work 70 | by the public as contemplated by Affirmer's express Statement of Purpose. 71 | 72 | 3. Public License Fallback. Should any part of the Waiver for any reason be 73 | judged legally invalid or ineffective under applicable law, then the Waiver 74 | shall be preserved to the maximum extent permitted taking into account 75 | Affirmer's express Statement of Purpose. In addition, to the extent the Waiver 76 | is so judged Affirmer hereby grants to each affected person a royalty-free, 77 | non transferable, non sublicensable, non exclusive, irrevocable and 78 | unconditional license to exercise Affirmer's Copyright and Related Rights in 79 | the Work (i) in all territories worldwide, (ii) for the maximum duration 80 | provided by applicable law or treaty (including future time extensions), (iii) 81 | in any current or future medium and for any number of copies, and (iv) for any 82 | purpose whatsoever, including without limitation commercial, advertising or 83 | promotional purposes (the "License"). The License shall be deemed effective as 84 | of the date CC0 was applied by Affirmer to the Work. Should any part of the 85 | License for any reason be judged legally invalid or ineffective under 86 | applicable law, such partial invalidity or ineffectiveness shall not 87 | invalidate the remainder of the License, and in such case Affirmer hereby 88 | affirms that he or she will not (i) exercise any of his or her remaining 89 | Copyright and Related Rights in the Work or (ii) assert any associated claims 90 | and causes of action with respect to the Work, in either case contrary to 91 | Affirmer's express Statement of Purpose. 92 | 93 | 4. Limitations and Disclaimers. 94 | 95 | a. No trademark or patent rights held by Affirmer are waived, abandoned, 96 | surrendered, licensed or otherwise affected by this document. 97 | 98 | b. Affirmer offers the Work as-is and makes no representations or warranties 99 | of any kind concerning the Work, express, implied, statutory or otherwise, 100 | including without limitation warranties of title, merchantability, fitness 101 | for a particular purpose, non infringement, or the absence of latent or 102 | other defects, accuracy, or the present or absence of errors, whether or not 103 | discoverable, all to the greatest extent permissible under applicable law. 104 | 105 | c. Affirmer disclaims responsibility for clearing rights of other persons 106 | that may apply to the Work or any use thereof, including without limitation 107 | any person's Copyright and Related Rights in the Work. Further, Affirmer 108 | disclaims responsibility for obtaining any necessary consents, permissions 109 | or other rights required for any use of the Work. 110 | 111 | d. Affirmer understands and acknowledges that Creative Commons is not a 112 | party to this document and has no duty or obligation with respect to this 113 | CC0 or use of the Work. 114 | 115 | For more information, please see 116 | 117 | 118 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Gulp Basics Treehouse Course 2 | This repository contains the project code for my [Gulp Basics course on Treehouse](https://teamtreehouse.com/library/gulp-basics). 3 | 4 | ## Using this Repo 5 | This is a node project. On the master branch is the "final" version of our app. Each video has a corresponding branch and you can run `git checkout ` to follow along. Instruction's are in the Teacher's Notes with each video. 6 | 7 | ## Quick Start 8 | ``` 9 | # Clone this repo 10 | git clone https://github.com/hdngr/treehouse-gulp-basics.git 11 | # Navigate into the directory 12 | cd treehouse-gulp-basics 13 | # Install the project's node dependencies 14 | npm install 15 | # Checkout the branch for the video you want to follow along with 16 | git checkout 17 | ``` 18 | 19 | ## Installing gulp and http server 20 | This course requires you to have global installations of [gulp](http://gulpjs.com/) and [http-server](https://www.npmjs.com/package/http-server). 21 | 22 | ``` 23 | # Install gulp globally 24 | npm install -g gulp 25 | # Install http-server globally 26 | npm install -g http-server 27 | ``` 28 | -------------------------------------------------------------------------------- /css/application.css: -------------------------------------------------------------------------------- 1 | /* Base Styles -------------------- */ 2 | * { 3 | box-sizing: border-box; } 4 | 5 | body { 6 | font-size: 1em; 7 | line-height: 1.5; 8 | color: #878787; 9 | margin: 0; 10 | font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } 11 | 12 | h1, 13 | h2 { 14 | font-family: "Abolition Regular", Helvetica, Arial, sans-serif; } 15 | 16 | h2 { 17 | font-size: 3.3125em; 18 | line-height: 1.1; 19 | font-weight: normal; 20 | margin: 0 0 0.5em; } 21 | 22 | h3 { 23 | font-size: 1.25em; 24 | line-height: 1.2; 25 | color: #48525c; 26 | margin-bottom: 1.7em; } 27 | 28 | img { 29 | max-width: 100%; 30 | margin-bottom: 20px; 31 | border-radius: 10px; } 32 | 33 | ul, 34 | ol { 35 | margin: 30px 0; } 36 | 37 | li { 38 | margin-bottom: 10px; } 39 | 40 | /* Pseudo-classes ------------------ */ 41 | a:link { 42 | color: #ffa949; 43 | text-decoration: none; } 44 | 45 | a:visited { 46 | color: #add8e6; } 47 | 48 | a:hover { 49 | color: rgba(255, 169, 73, 0.5); } 50 | 51 | .main-header { 52 | padding-top: 170px; 53 | height: 850px; 54 | background: linear-gradient(red, transparent 90%), linear-gradient(0deg, #fff, transparent), red url("../img/mountains.jpg") no-repeat center; 55 | background-size: cover; } 56 | @media (max-width: 768px) { 57 | .main-header { 58 | max-height: 380px; 59 | padding: 50px 25px 0; } } 60 | 61 | .main-footer { 62 | padding-top: 60px; 63 | padding-bottom: 60px; 64 | border-bottom: 10px solid #ffa949; } 65 | @media (max-width: 768px) { 66 | .main-footer { 67 | padding: 20px 0; } } 68 | 69 | .primary-content { 70 | padding-top: 25px; 71 | padding-bottom: 95px; } 72 | 73 | .secondary-content { 74 | padding-top: 80px; 75 | padding-bottom: 70px; 76 | border-bottom: 2px solid #e0e0e0; } 77 | 78 | .wildlife { 79 | color: #fff; 80 | text-align: left; 81 | padding: 18% 24%; 82 | border-top: 10px solid #ffa949; 83 | margin: 105px 0 60px; 84 | background: #48525c url("../img/bear.jpg") no-repeat center; 85 | background-size: cover; 86 | box-shadow: inset 0 0 50px 10px rgba(0, 0, 0, 0.8); 87 | border-radius: 10px; } 88 | @media (max-width: 1024px) { 89 | .wildlife { 90 | padding: 10% 12%; 91 | margin: 50px 0 20px; } } 92 | 93 | .tips { 94 | float: left; } 95 | 96 | .resorts { 97 | float: right; } 98 | 99 | .main-header, .main-footer, .primary-content { 100 | text-align: center; } 101 | 102 | .primary-content, .secondary-content { 103 | border-top: 2px solid #e0e0e0; } 104 | 105 | .primary-content, .secondary-content { 106 | width: 75%; 107 | padding-left: 50px; 108 | padding-right: 50px; 109 | margin: auto; 110 | max-width: 960px; } 111 | @media (max-width: 1024px) { 112 | .primary-content, .secondary-content { 113 | width: 90%; } } 114 | @media (max-width: 768px) { 115 | .primary-content, .secondary-content { 116 | width: 100%; 117 | padding: 20px; 118 | border-top: none; } } 119 | 120 | .tips, .resorts { 121 | width: 46.5%; } 122 | @media (max-width: 768px) { 123 | .tips, .resorts { 124 | float: none; 125 | width: 100%; } } 126 | 127 | .secondary-content:after { 128 | content: ""; 129 | display: table; 130 | clear: both; } 131 | 132 | /* Web Fonts -------------------- */ 133 | @font-face { 134 | font-family: "Abolition Regular"; 135 | src: url("../fonts/abolition-regular-webfont.eot"); 136 | src: url("../fonts/abolition-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/abolition-regular-webfont.woff") format("woff"), url("../fonts/abolition-regular-webfont.ttf") format("truetype"); } 137 | 138 | .main-heading { 139 | font-size: 5.625rem; 140 | line-height: 1.3; 141 | font-weight: normal; 142 | color: #fff; 143 | text-transform: uppercase; 144 | text-shadow: 0 1px 1px rgba(0, 0, 0, 0.8); 145 | margin: 12px 0 0; } 146 | @media (max-width: 768px) { 147 | .main-heading { 148 | font-size: 5rem; 149 | line-height: 1.1; } } 150 | 151 | .main-title { 152 | font-size: 1.625rem; 153 | font-weight: 200; 154 | color: #fff; 155 | letter-spacing: .065em; 156 | border-bottom: 2px solid; 157 | padding-bottom: 10px; } 158 | @media (max-width: 768px) { 159 | .main-title { 160 | font-size: 1.3rem; 161 | border: none; } } 162 | 163 | .intro { 164 | font-size: 1.25em; 165 | line-height: 1.6; 166 | color: initial; } 167 | @media (max-width: 768px) { 168 | .intro { 169 | font-size: 1rem; } } 170 | 171 | .callout { 172 | font-size: 1.25em; 173 | border-bottom: 3px solid; 174 | padding: 0 9px 3px; 175 | margin-top: 20px; 176 | display: inline-block; } 177 | 178 | .arrow { 179 | width: 50px; 180 | margin-top: 150px; } 181 | @media (max-width: 768px) { 182 | .arrow { 183 | display: none; } } 184 | 185 | /*# sourceMappingURL=application.css.map */ -------------------------------------------------------------------------------- /css/application.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["base/_base.scss","base/_mixins.scss","base/_variables.scss","layout/_header.scss","layout/_footer.scss","layout/_containers.scss","layout/_columns.scss","layout/_extends.scss","components/_typography.scss","components/_buttons.scss","components/_icons.scss"],"names":[],"mappings":"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","file":"application.css","sourcesContent":["/* Base Styles -------------------- */\n\n* {\n box-sizing: border-box;\n}\n\nbody {\n @include text(1em, 1.5, $color: $color-text-base);\n margin: 0;\n font-family: $stack-helvetica;\n}\n\nh1,\nh2 {\n font-family: $stack-abolition;\n}\n\nh2 {\n @include text(3.3125em, 1.1, normal);\n margin: 0 0 .5em;\n}\n\nh3 {\n @include text(1.25em, 1.2, $color: $color-text-dark);\n margin-bottom: 1.7em;\n}\n\nimg {\n max-width: 100%;\n margin-bottom: 20px;\n border-radius: $br;\n}\n\nul,\nol {\n margin: 30px 0;\n}\n\nli {\n margin-bottom: 10px;\n}\n\n/* Pseudo-classes ------------------ */\n\na {\n &:link {\n color: $color-link-default;\n text-decoration: none;\n }\n &:visited {\n color: $color-link-visited;\n }\n &:hover {\n color: rgba($color-link-default, .5);\n }\n}","// Web fonts\n\n@mixin font-face($family, $file) {\n @font-face {\n font-family: $family;\n src: url('#{$path-font}/#{$file}-webfont.eot');\n src: url('#{$path-font}/#{$file}-webfont.eot?#iefix') format('embedded-opentype'),\n url('#{$path-font}/#{$file}-webfont.woff') format('woff'),\n url('#{$path-font}/#{$file}-webfont.ttf') format('truetype');\n }\n}\n\n// Text\n\n@mixin text($size, $l-height: null, $weight: null, $color: null) {\n font-size: $size;\n line-height: $l-height;\n font-weight: $weight;\n color: $color;\n}\n\n\n\n\n\n\n\n\n\n\n","// Descriptive color variables\n\n$white : #fff;\n$black : #000;\n$grey : #878787;\n$regent-st-blue : #add8e6;\n$river-bed : #48525c;\n$yellow-orange : #ffa949;\n$green : red;\n\n// Functional color variables\n\n$color-prim : $green;\n$color-sec : $river-bed;\n\n$color-text-light : $white;\n$color-text-base : $grey;\n$color-text-dark : $river-bed;\n\n$color-border-light : lighten($grey, 35%);\n$color-border-dark : $yellow-orange;\n\n$color-link-default : $yellow-orange;\n$color-link-visited : $regent-st-blue;\n\n$color-shadow : rgba($black,.8);\n$color-body : $white;\n\n// Font stacks\n\n$stack-sans-serif : Helvetica, Arial, sans-serif;\n$stack-helvetica : 'Helvetica Neue', $stack-sans-serif;\n$stack-abolition : 'Abolition Regular', $stack-sans-serif;\n\n// Border radius\n\n$br: 10px;\n\n// Asset paths\n\n$path-img : '../img';\n$path-font : '../fonts';\n\n// Media query breakpoints\n\n$brk-narrow : '(max-width: 768px)';\n$brk-wide : '(max-width: 1024px)';",".main-header {\n @extend %centered;\n padding-top: 170px;\n height: 850px;\n background: linear-gradient($color-prim, transparent 90%),\n linear-gradient(0deg, $color-body, transparent),\n $color-prim url('#{$path-img}/mountains.jpg') no-repeat center;\n background-size: cover;\n @media #{$brk-narrow} {\n max-height: 380px;\n padding: 50px 25px 0;\n }\n}",".main-footer {\n @extend %centered;\n padding-top: 60px;\n padding-bottom: 60px;\n border-bottom: 10px solid $color-border-dark;\n @media #{$brk-narrow} {\n \tpadding: 20px 0;\n }\n}",".primary-content {\n @extend %content;\n @extend %centered;\n @extend %t-border;\n\tpadding-top: 25px;\n padding-bottom: 95px;\n}\n\n.secondary-content {\n @extend %content;\n @extend %t-border;\n @extend %clearfix;\n padding-top: 80px;\n\tpadding-bottom: 70px;\n border-bottom: 2px solid $color-border-light;\n}\n\n.wildlife {\n color: $color-text-light;\n text-align: left;\n padding: 18% 24%;\n border-top: 10px solid $color-border-dark;\n margin: 105px 0 60px;\n background: $color-sec url('#{$path-img}/bear.jpg') no-repeat center;\n background-size: cover;\n box-shadow: inset 0 0 50px 10px $color-shadow;\n border-radius: $br;\n @media #{$brk-wide} {\n padding: 10% 12%;\n margin: 50px 0 20px;\n }\n}",".tips {\n @extend %columns;\n float: left;\n}\n\n.resorts {\n @extend %columns;\n float: right;\n}","// Center text\n\n%centered {\n text-align: center;\n}\n\n// Top border\n\n%t-border {\n border-top: 2px solid $color-border-light;\n}\n\n// Containers\n\n%content {\n width: 75%;\n padding-left: 50px;\n padding-right: 50px;\n margin: auto;\n max-width: 960px;\n @media #{$brk-wide} {\n width: 90%;\n }\n @media #{$brk-narrow} {\n width: 100%;\n padding: 20px;\n border-top: none;\n }\n}\n\n// Columns\n\n%columns {\n width: 46.5%;\n @media #{$brk-narrow} {\n float: none;\n width: 100%;\n }\n}\n\n// Clearfix\n\n%clearfix {\n &:after {\n content: \"\";\n display: table;\n clear: both;\n }\n}","/* Web Fonts -------------------- */\n\n@include font-face('Abolition Regular', abolition-regular);\n\n.main {\n &-heading { \n @include text(5.625rem, 1.3, normal, $color-text-light);\n text-transform: uppercase; \n text-shadow: 0 1px 1px $color-shadow;\n margin: 12px 0 0;\n \n @media #{$brk-narrow} {\n \t\t@include text(5rem, 1.1);\n }\n }\n \n &-title {\n @include text(1.625rem, $weight: 200, $color: $color-text-light);\n letter-spacing: .065em;\n border-bottom: 2px solid;\n padding-bottom: 10px;\n \n @media #{$brk-narrow} {\n font-size: 1.3rem;\n border: none;\n }\n }\n}\n\n.intro {\n @include text(1.25em, 1.6, $color: initial);\n \n @media #{$brk-narrow} {\n font-size: 1rem;\n }\n}\n\n","// Callout link/button\n\n.callout {\n font-size: 1.25em;\n border-bottom: 3px solid;\n padding: 0 9px 3px;\n margin-top: 20px;\n display: inline-block;\n}","// Arrow image icon\n\n.arrow {\n width: 50px;\n margin-top: 150px;\n \n @media #{$brk-narrow} {\n display: none;\n }\n}"],"sourceRoot":"/source/"} -------------------------------------------------------------------------------- /fonts/abolition-regular-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hdngr/treehouse-gulp-basics/8c80bb8df134b20fb2212bbb926e9a63a8f903ca/fonts/abolition-regular-webfont.eot -------------------------------------------------------------------------------- /fonts/abolition-regular-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hdngr/treehouse-gulp-basics/8c80bb8df134b20fb2212bbb926e9a63a8f903ca/fonts/abolition-regular-webfont.ttf -------------------------------------------------------------------------------- /fonts/abolition-regular-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hdngr/treehouse-gulp-basics/8c80bb8df134b20fb2212bbb926e9a63a8f903ca/fonts/abolition-regular-webfont.woff -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | 3 | var gulp = require('gulp'), 4 | concat = require('gulp-concat'), 5 | uglify = require('gulp-uglify'), 6 | rename = require('gulp-rename'), 7 | sass = require('gulp-sass'), 8 | maps = require('gulp-sourcemaps'), 9 | del = require('del'); 10 | 11 | gulp.task("concatScripts", function() { 12 | return gulp.src([ 13 | 'js/jquery.js', 14 | 'js/sticky/jquery.sticky.js', 15 | 'js/main.js' 16 | ]) 17 | .pipe(maps.init()) 18 | .pipe(concat('app.js')) 19 | .pipe(maps.write('./')) 20 | .pipe(gulp.dest('js')); 21 | }); 22 | 23 | gulp.task("minifyScripts", ["concatScripts"], function() { 24 | return gulp.src("js/app.js") 25 | .pipe(uglify()) 26 | .pipe(rename('app.min.js')) 27 | .pipe(gulp.dest('js')); 28 | }); 29 | 30 | gulp.task('compileSass', function() { 31 | return gulp.src("scss/application.scss") 32 | .pipe(maps.init()) 33 | .pipe(sass()) 34 | .pipe(maps.write('./')) 35 | .pipe(gulp.dest('css')); 36 | }); 37 | 38 | gulp.task('watchFiles', function() { 39 | gulp.watch('scss/**/*.scss', ['compileSass']); 40 | gulp.watch('js/main.js', ['concatScripts']); 41 | }) 42 | 43 | gulp.task('clean', function() { 44 | del(['dist', 'css/application.css*', 'js/app*.js*']); 45 | }); 46 | 47 | gulp.task("build", ['minifyScripts', 'compileSass'], function() { 48 | return gulp.src(["css/application.css", "js/app.min.js", 'index.html', 49 | "img/**", "fonts/**"], { base: './'}) 50 | .pipe(gulp.dest('dist')); 51 | }); 52 | 53 | gulp.task('serve', ['watchFiles']); 54 | 55 | gulp.task("default", ["clean"], function() { 56 | gulp.start('build'); 57 | }); 58 | -------------------------------------------------------------------------------- /img/arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 8 | 9 | -------------------------------------------------------------------------------- /img/bear.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hdngr/treehouse-gulp-basics/8c80bb8df134b20fb2212bbb926e9a63a8f903ca/img/bear.jpg -------------------------------------------------------------------------------- /img/mountains.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hdngr/treehouse-gulp-basics/8c80bb8df134b20fb2212bbb926e9a63a8f903ca/img/mountains.jpg -------------------------------------------------------------------------------- /img/mtn-landscape.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hdngr/treehouse-gulp-basics/8c80bb8df134b20fb2212bbb926e9a63a8f903ca/img/mtn-landscape.jpg -------------------------------------------------------------------------------- /img/resort.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hdngr/treehouse-gulp-basics/8c80bb8df134b20fb2212bbb926e9a63a8f903ca/img/resort.jpg -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Lake Tahoe 5 | 6 | 7 | 8 | 9 |
10 | Journey Through the Sierra Nevada Mountains 11 |

Lake Tahoe, California

12 | Down arrow 13 |
14 | 15 |
16 |

17 | Lake Tahoe is one of the most breathtaking attractions located in California. It's home to a number of ski resorts, summer outdoor recreation, and tourist attractions. Snow and skiing are a significant part of the area's reputation. 18 |

19 | Find out more 20 | 21 |
22 |

Check out all the Wildlife

23 |

24 | As spawning season approaches, the fish acquire a humpback and protuberant jaw. After spawning, they die and their carcasses provide a feast for gatherings of mink, bears, and bald eagles. 25 |

26 |
27 | 28 | See the Wildlife 29 |
30 | 31 |
32 |
33 | Resort 34 |

From Tents to Resorts

35 |

36 | Lake Tahoe is full of wonderful places to stay. You have the ability to sleep in the outdoors in a tent, or relax like a king at a five star resort. Here are our top three resorts: 37 |

38 | 43 |
44 | 45 |
46 | Mountain Landscape 47 |

Pack Accordingly

48 |

49 | One of most important things when it comes to traveling through the great outdoors is packing accordingly. Here are a few tips: 50 |

51 |
    52 |
  1. Bring layers of clothing
  2. 53 |
  3. Pack sunscreen
  4. 54 |
  5. Carry extra water just in case
  6. 55 |
  7. Pack light
  8. 56 |
57 |
58 |
59 | 60 | 64 | 65 | 66 | 67 | -------------------------------------------------------------------------------- /js/app.min.js: -------------------------------------------------------------------------------- 1 | !function(e,t){"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(e,t){function n(e){var t=e.length,n=ie.type(e);return"function"===n||ie.isWindow(e)?!1:1===e.nodeType&&t?!0:"array"===n||0===t||"number"==typeof t&&t>0&&t-1 in e}function r(e,t,n){if(ie.isFunction(t))return ie.grep(e,function(e,r){return!!t.call(e,r,e)!==n});if(t.nodeType)return ie.grep(e,function(e){return e===t!==n});if("string"==typeof t){if(fe.test(t))return ie.filter(t,e,n);t=ie.filter(t,e)}return ie.grep(e,function(e){return ie.inArray(e,t)>=0!==n})}function i(e,t){do e=e[t];while(e&&1!==e.nodeType);return e}function o(e){var t=xe[e]={};return ie.each(e.match(be)||[],function(e,n){t[n]=!0}),t}function a(){he.addEventListener?(he.removeEventListener("DOMContentLoaded",s,!1),e.removeEventListener("load",s,!1)):(he.detachEvent("onreadystatechange",s),e.detachEvent("onload",s))}function s(){(he.addEventListener||"load"===event.type||"complete"===he.readyState)&&(a(),ie.ready())}function u(e,t,n){if(void 0===n&&1===e.nodeType){var r="data-"+t.replace(ke,"-$1").toLowerCase();if(n=e.getAttribute(r),"string"==typeof n){try{n="true"===n?!0:"false"===n?!1:"null"===n?null:+n+""===n?+n:Ee.test(n)?ie.parseJSON(n):n}catch(i){}ie.data(e,t,n)}else n=void 0}return n}function l(e){var t;for(t in e)if(("data"!==t||!ie.isEmptyObject(e[t]))&&"toJSON"!==t)return!1;return!0}function c(e,t,n,r){if(ie.acceptData(e)){var i,o,a=ie.expando,s=e.nodeType,u=s?ie.cache:e,l=s?e[a]:e[a]&&a;if(l&&u[l]&&(r||u[l].data)||void 0!==n||"string"!=typeof t)return l||(l=s?e[a]=J.pop()||ie.guid++:a),u[l]||(u[l]=s?{}:{toJSON:ie.noop}),("object"==typeof t||"function"==typeof t)&&(r?u[l]=ie.extend(u[l],t):u[l].data=ie.extend(u[l].data,t)),o=u[l],r||(o.data||(o.data={}),o=o.data),void 0!==n&&(o[ie.camelCase(t)]=n),"string"==typeof t?(i=o[t],null==i&&(i=o[ie.camelCase(t)])):i=o,i}}function d(e,t,n){if(ie.acceptData(e)){var r,i,o=e.nodeType,a=o?ie.cache:e,s=o?e[ie.expando]:ie.expando;if(a[s]){if(t&&(r=n?a[s]:a[s].data)){ie.isArray(t)?t=t.concat(ie.map(t,ie.camelCase)):t in r?t=[t]:(t=ie.camelCase(t),t=t in r?[t]:t.split(" ")),i=t.length;for(;i--;)delete r[t[i]];if(n?!l(r):!ie.isEmptyObject(r))return}(n||(delete a[s].data,l(a[s])))&&(o?ie.cleanData([e],!0):ne.deleteExpando||a!=a.window?delete a[s]:a[s]=null)}}}function f(){return!0}function p(){return!1}function h(){try{return he.activeElement}catch(e){}}function m(e){var t=Me.split("|"),n=e.createDocumentFragment();if(n.createElement)for(;t.length;)n.createElement(t.pop());return n}function g(e,t){var n,r,i=0,o=typeof e.getElementsByTagName!==Ce?e.getElementsByTagName(t||"*"):typeof e.querySelectorAll!==Ce?e.querySelectorAll(t||"*"):void 0;if(!o)for(o=[],n=e.childNodes||e;null!=(r=n[i]);i++)!t||ie.nodeName(r,t)?o.push(r):ie.merge(o,g(r,t));return void 0===t||t&&ie.nodeName(e,t)?ie.merge([e],o):o}function v(e){De.test(e.type)&&(e.defaultChecked=e.checked)}function y(e,t){return ie.nodeName(e,"table")&&ie.nodeName(11!==t.nodeType?t:t.firstChild,"tr")?e.getElementsByTagName("tbody")[0]||e.appendChild(e.ownerDocument.createElement("tbody")):e}function b(e){return e.type=(null!==ie.find.attr(e,"type"))+"/"+e.type,e}function x(e){var t=Ve.exec(e.type);return t?e.type=t[1]:e.removeAttribute("type"),e}function w(e,t){for(var n,r=0;null!=(n=e[r]);r++)ie._data(n,"globalEval",!t||ie._data(t[r],"globalEval"))}function T(e,t){if(1===t.nodeType&&ie.hasData(e)){var n,r,i,o=ie._data(e),a=ie._data(t,o),s=o.events;if(s){delete a.handle,a.events={};for(n in s)for(r=0,i=s[n].length;i>r;r++)ie.event.add(t,n,s[n][r])}a.data&&(a.data=ie.extend({},a.data))}}function C(e,t){var n,r,i;if(1===t.nodeType){if(n=t.nodeName.toLowerCase(),!ne.noCloneEvent&&t[ie.expando]){i=ie._data(t);for(r in i.events)ie.removeEvent(t,r,i.handle);t.removeAttribute(ie.expando)}"script"===n&&t.text!==e.text?(b(t).text=e.text,x(t)):"object"===n?(t.parentNode&&(t.outerHTML=e.outerHTML),ne.html5Clone&&e.innerHTML&&!ie.trim(t.innerHTML)&&(t.innerHTML=e.innerHTML)):"input"===n&&De.test(e.type)?(t.defaultChecked=t.checked=e.checked,t.value!==e.value&&(t.value=e.value)):"option"===n?t.defaultSelected=t.selected=e.defaultSelected:("input"===n||"textarea"===n)&&(t.defaultValue=e.defaultValue)}}function E(t,n){var r,i=ie(n.createElement(t)).appendTo(n.body),o=e.getDefaultComputedStyle&&(r=e.getDefaultComputedStyle(i[0]))?r.display:ie.css(i[0],"display");return i.detach(),o}function k(e){var t=he,n=Ze[e];return n||(n=E(e,t),"none"!==n&&n||(Ke=(Ke||ie("