From 2cc092600e336592cb8d36fc705cf7206700afca Mon Sep 17 00:00:00 2001 From: Nuno Rocha de Sousa Date: Tue, 20 Sep 2016 15:26:37 +0100 Subject: [PATCH 1/2] Clean defaul app and add jQuery and Bootstrap --- .gitignore | 3 + bower.json | 32 +++ config.json | 3 +- dev/html/index.html | 83 ++------ dev/scripts/01-variables.js | 14 -- dev/scripts/02-functions.js | 256 ----------------------- dev/scripts/03-main.js | 62 ------ dev/scripts/grid.js | 56 ----- dev/styles/01-fonts/_index.scss | 2 - dev/styles/03-base/_base.scss | 59 ------ dev/styles/06-states/_grid.scss | 91 -------- dev/styles/06-states/_index-for-dev.scss | 1 - dev/styles/06-states/_states.scss | 41 ---- gulpfile.js | 193 ++++++++--------- 14 files changed, 152 insertions(+), 744 deletions(-) create mode 100644 bower.json delete mode 100644 dev/scripts/grid.js delete mode 100644 dev/styles/06-states/_grid.scss diff --git a/.gitignore b/.gitignore index 9793fb0..8bf53d3 100644 --- a/.gitignore +++ b/.gitignore @@ -165,5 +165,8 @@ ehthumbs.db # Ignore the `node_modules` folder created by `npm install`. /node_modules +# Ignore the `bower_components` folder created by `bower install`. +/bower_components + # Ignore the `temp` folder, also generated by `gulp build`. /temp diff --git a/bower.json b/bower.json new file mode 100644 index 0000000..97e6719 --- /dev/null +++ b/bower.json @@ -0,0 +1,32 @@ +{ + "name": "gulp-template-for-html-css-sass-js", + "description": "An automation template for HTML, CSS, Sass, and JavaScript.", + "main": "gulpfile.js", + "authors": [ + "Subtl" + ], + "license": "ISC", + "keywords": [ + "gulp", + "automation", + "template", + "html", + "css", + "sass", + "javascript" + ], + "homepage": "https://github.com/code-warrior/gulp-template-for-html-css-sass-js", + "ignore": [ + "**/.*", + "node_modules", + "bower_components", + "test", + "tests" + ], + "dependencies": { + "bower": "*", + "install": "^1.0.4", + "bootstrap": "^3.3.7", + "jquery": "^3.1.0" + } +} diff --git a/config.json b/config.json index a4ee109..7f53d5d 100644 --- a/config.json +++ b/config.json @@ -9,7 +9,8 @@ "baseFolders": { "dev": "dev/", "tmp": "temp/", - "prod": "prod/" + "prod": "prod/", + "libs": ["bower_components/"] }, "scaffoldFolders": { diff --git a/dev/html/index.html b/dev/html/index.html index c60d587..ce001a6 100755 --- a/dev/html/index.html +++ b/dev/html/index.html @@ -1,68 +1,21 @@ - - - Abraham Lincoln Trivia (v0.0.3) - - - -
-

Facts Surrounding Abraham Lincoln’s Assassination

-
-

-
-
-
- - - -
-
-
-
-

April 2015 marks the 150th anniversary of Abraham Lincoln’s assassination. Use this web page to test your knowledge of his life and the facts surrounding his tragic, untimely assassination.

-

Here’s your first fact: The background image (created by Eugene Richards for National Geographic) of this page shows the Lincoln catafalque, which was specially constructed to carry Abraham Lincoln’s coffin during his funeral train procession from Washington, DC to Springfield, Illinois.

- -
-

-
-
-
- - -
-
-
- - -
- -
-

-
-
-
- - -
-
-
- - -
-
- - + + + Abraham Lincoln Trivia (v0.0.3) + + + + + +
+

Subtl scaffolding

+
+ + + + + + + diff --git a/dev/scripts/01-variables.js b/dev/scripts/01-variables.js index 168d22b..b5ff13d 100644 --- a/dev/scripts/01-variables.js +++ b/dev/scripts/01-variables.js @@ -1,15 +1 @@ /*jslint browser: true, devel: true, indent: 4, maxlen: 85, todo: true */ - -var lincolnsBirthPlace, - lincolnsAssassin, - main, - moveToQuestion2, - moveToQuestion3, - nameContainer, - showUsersName, - submitLincolnsBirthPlace, - submitNameOfLincolnsAssassin, - submitUsersName, - usersName, - whereWasLincolnBornQuestionContainer, - whoAssassinatedLincolnQuestionContainer; diff --git a/dev/scripts/02-functions.js b/dev/scripts/02-functions.js index a5d8938..e69de29 100644 --- a/dev/scripts/02-functions.js +++ b/dev/scripts/02-functions.js @@ -1,256 +0,0 @@ -/** - * SHOW MAIN - * - * Reveals the
element, then, after 50 milliseconds, adds a class that - * triggers a transition—thus the name—via CSS. - */ -function showMain() { - 'use strict'; - - main.style.display = 'block'; - - setTimeout( - function () { - main.setAttribute('class', 'transition'); - }, - 50 - ); -} - -/** - * SHOW QUESTION “WHERE WAS LINCOLN BORN?” - * - * The question “Where Was Lincoln Born?” and the
used to answer it are both - * wrapped in a
container, which is turned off by default; that is, - * display is set to “none” in the CSS. This function simply reveals that container. - */ -function showQuestionWhereWasLincolnBorn() { - 'use strict'; - - whereWasLincolnBornQuestionContainer.style.display = 'block'; -} - -/** - * SHOW QUESTION “WHO ASSASSINATED LINCOLN?” - * - * Firing off this function displays the container for the question “Who Assassinated - * Lincoln?”, then removes the “Submit” button associated with the question “Where - * Was Lincoln Born?” and the “Next Question” button that is shown when the user - * answers the “Where Was Lincoln Born?” question correctly. The drop down menu - * showing the location options of Lincoln’s birth is disabled, also. - */ -function showQuestionWhoAssassinatedLincoln() { - 'use strict'; - - whoAssassinatedLincolnQuestionContainer.style.display = 'block'; - submitLincolnsBirthPlace.style.display = 'none'; - moveToQuestion2.style.display = 'none'; - lincolnsBirthPlace.setAttribute('disabled', 'disabled'); -} - -/** - * SHOW RESULTS - * - * This function does for the question “Who Assassinated Lincoln?” what the function - * showQuestionWhoAssassinatedLincoln() does for the question “Where Was Lincoln - * Born?” Except, however, that it doesn’t trigger the display for a new question. - * - * You can choose to display some results about how the user answered these - * questions. For example, how long they took to take this quiz, or how many times - * they chose a drop down option before choosing the correct answer. - * - * In other words, this is a homework function that you might want to modify. - */ -function showResults() { - 'use strict'; - - submitNameOfLincolnsAssassin.style.display = 'none'; - moveToQuestion3.style.display = 'none'; - lincolnsAssassin.setAttribute('disabled', 'disabled'); -} - -/** - * CHECK ANSWER TO LINCOLN’S BIRTH PLACE QUESTION - * - * The first thing this function does is create a reference to the

aragraph child - * of the

element on line 42 of “index.html,” because this is where I’ll be - * rendering feedback on the answer the user submits. - * - * The switch statement is checking the value submitted by the