Commit 94f42f2e authored by Derek Nutile's avatar Derek Nutile

Initialize assets: js, scss; test and compile

parent 6f46176e
Pipeline #48972589 canceled with stage
@import url(https://fonts.googleapis.com/css?family=Roboto);html {
font-size: 12px;
font-family: 'Roboto';
background-color: whitesmoke; }
section {
margin-bottom: 1em; }
#main {
font-size: 1.2em;
display: grid;
width: 80%; }
#main > header {
grid-area: head;
padding: 1em;
background-color: #fff; }
#main > nav {
grid-area: nav;
padding: 1em;
background-color: #eee; }
#main > main {
grid-area: main;
padding: 1em;
background-color: #ddd; }
#main > footer {
grid-area: foot;
padding: 1em;
background-color: #ccc; }
.card {
cursor: pointer;
width: 10vw;
height: 10vw;
padding: .5em .2em 0 .2em;
margin: .5em;
border: 1px solid #dcedb9;
border-collapse: collapse;
overflow: hidden; }
.card:hover {
background: #cbd081;
transition: .5s; }
.card:hover .card-title {
color: #d2e59e; }
.card:hover .card-copy {
color: #001; }
.empty {
background: none;
border: none; }
.card-title {
font-weight: 700;
text-align: center;
font-size: 4.5vw;
padding-bottom: 1vw;
color: #b1c1c0; }
.card-copy {
font-size: 1.9vw;
text-align: center;
color: #918868; }
.boxed {
border: 1px solid #000;
padding: 1em; }
.light {
background: whitesmoke; }
.display-box {
display: -webkit-box; }
.pack-end {
-webkit-box-pack: end;
-moz-box-pack: end;
-webkit-flex-pack: end; }
.pack-justify {
-webkit-box-pack: justify;
-moz-box-pack: justify;
-webkit-flex-pack: justify; }
.pack-center {
-webkit-box-pack: center;
-moz-box-pack: center;
-webkit-flex-pack: center; }
.align-start {
-webkit-box-align: start;
-moz-box-align: start;
-webkit-flex-align: start; }
.align-end {
-webkit-box-align: end;
-moz-box-align: end;
-webkit-flex-align: end; }
.align-center {
-webkit-box-align: center;
-moz-box-align: center;
-webkit-flex-align: center; }
.align-baseline {
-webkit-box-align: baseline;
-moz-box-align: baseline;
-webkit-flex-align: baseline; }
.align-stretch {
-webkit-box-align: stretch;
-moz-box-align: stretch;
-webkit-flex-align: stretch; }
.height-200 {
height: 200px; }
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 0);
/******/ })
/************************************************************************/
/******/ ({
/***/ "./src/app.js":
/*!********************!*\
!*** ./src/app.js ***!
\********************/
/*! no static exports found */
/***/ (function(module, exports) {
eval("var greeting = \"Last edited: 2019-02-24\";\nconsole.log(greeting);\n\n//# sourceURL=webpack:///./src/app.js?");
/***/ }),
/***/ "./src/scss/app.scss":
/*!***************************!*\
!*** ./src/scss/app.scss ***!
\***************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
eval("module.exports = __webpack_require__.p + \"css/app.css\";\n\n//# sourceURL=webpack:///./src/scss/app.scss?");
/***/ }),
/***/ 0:
/*!**********************************************!*\
!*** multi ./src/app.js ./src/scss/app.scss ***!
\**********************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
eval("__webpack_require__(/*! ./src/app.js */\"./src/app.js\");\nmodule.exports = __webpack_require__(/*! ./src/scss/app.scss */\"./src/scss/app.scss\");\n\n\n//# sourceURL=webpack:///multi_./src/app.js_./src/scss/app.scss?");
/***/ })
/******/ });
\ No newline at end of file
var greeting = "Last edited: 2019-02-24";
console.log(greeting);
\ No newline at end of file
// Body
$body-bg: #f8fafc;
// Typography
$font-family-sans-serif: "Nunito", sans-serif;
$font-size-base: 0.9rem;
$line-height-base: 1.6;
// Colors
$blue: #3490dc;
$indigo: #6574cd;
$purple: #9561e2;
$pink: #f66d9b;
$red: #e3342f;
$orange: #f6993f;
$yellow: #ffed4a;
$green: #38c172;
$teal: #4dc0b5;
$cyan: #6cb2eb;
// Fonts
@import url("https://fonts.googleapis.com/css?family=Roboto");
// Colors
@import "colors";
// Typography
@import "typography";
// Core css/reset
html {
font-size: 12px;
font-family: 'Roboto';
background-color: whitesmoke;
}
section {
margin-bottom: 1em;
}
// CSS Grid testing
#main {
font-size: 1.2em;
display: grid;
width: 80%;
// height: 100%;
// note the template areas below
// grid-template-areas:
// "nav head"
// "nav main"
// "nav foot";
// grid-template-rows: 25%;
// grid-template-columns: 14% 14% 14% 14% 14% 14% 1fr;
}
#main > header {
grid-area: head;
padding: 1em;
background-color: #fff;
}
#main > nav {
grid-area: nav;
padding: 1em;
background-color: #eee;
}
#main > main {
grid-area: main;
padding: 1em;
background-color: #ddd;
}
#main > footer {
grid-area: foot;
padding: 1em;
background-color: #ccc;
}
.card {
cursor: pointer;
width: 10vw;
height: 10vw;
padding: .5em .2em 0 .2em;
margin: .5em;
border: 1px solid #dcedb9;
border-collapse: collapse;
overflow: hidden;
}
.card:hover {
background: #cbd081;
transition: .5s;
}
.card:hover .card-title {
color: #d2e59e;
}
.card:hover .card-copy {
color: #001;
}
.empty {
background: none;
border: none;
}
.card-title {
font-weight: 700;
text-align: center;
font-size: 4.5vw;
padding-bottom: 1vw;
color: #b1c1c0;
}
.card-copy {
font-size: 1.9vw;
text-align: center;
color: #918868;
}
.boxed {
border: 1px solid #000;
padding: 1em;
}
.light {
background: whitesmoke;
}
.display-box {
display: -webkit-box;
}
.pack-end {
-webkit-box-pack: end;
-moz-box-pack: end;
-webkit-flex-pack: end;
}
.pack-justify {
-webkit-box-pack: justify;
-moz-box-pack: justify;
-webkit-flex-pack: justify;
}
.pack-center {
-webkit-box-pack: center;
-moz-box-pack: center;
-webkit-flex-pack: center;
}
.align-start {
-webkit-box-align: start;
-moz-box-align: start;
-webkit-flex-align: start;
}
.align-end {
-webkit-box-align: end;
-moz-box-align: end;
-webkit-flex-align: end;
}
.align-center {
-webkit-box-align: center;
-moz-box-align: center;
-webkit-flex-align: center;
}
.align-baseline {
-webkit-box-align: baseline;
-moz-box-align: baseline;
-webkit-flex-align: baseline;
}
.align-stretch {
-webkit-box-align: stretch;
-moz-box-align: stretch;
-webkit-flex-align: stretch;
}
.height-200 {
height: 200px;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment