From cd1392f0955acc28867c323a166168bf3ed68992 Mon Sep 17 00:00:00 2001 From: Danny van Kooten Date: Wed, 31 Oct 2018 19:56:42 +0100 Subject: [PATCH] switch to plain css so we can get rid of gulp-sass / node-sass --- assets/src/css/chart.css | 78 +++++++ assets/src/css/fonts-overpass.css | 189 +++++++++++++++++ .../{sass/pikaday.scss => css/pikaday.css} | 1 - assets/src/css/styles.css | 155 ++++++++++++++ assets/src/css/util.css | 62 ++++++ assets/src/sass/chart.scss | 76 ------- assets/src/sass/fonts-overpass.scss | 190 ------------------ assets/src/sass/styles.scss | 164 --------------- assets/src/sass/util.scss | 62 ------ gulpfile.js | 30 ++- package-lock.json | 149 +++++++++----- package.json | 3 +- 12 files changed, 593 insertions(+), 566 deletions(-) create mode 100644 assets/src/css/chart.css create mode 100644 assets/src/css/fonts-overpass.css rename assets/src/{sass/pikaday.scss => css/pikaday.css} (99%) create mode 100644 assets/src/css/styles.css create mode 100644 assets/src/css/util.css delete mode 100644 assets/src/sass/chart.scss delete mode 100644 assets/src/sass/fonts-overpass.scss delete mode 100644 assets/src/sass/styles.scss delete mode 100644 assets/src/sass/util.scss diff --git a/assets/src/css/chart.css b/assets/src/css/chart.css new file mode 100644 index 00000000..00737c5a --- /dev/null +++ b/assets/src/css/chart.css @@ -0,0 +1,78 @@ +.box-graph { + background: white; + margin-left: 0 !important; +} + +#chart * { + box-sizing: content-box; +} + +#chart .muted { + fill: #98a0a6; +} + +#chart { + height: 240px; +} + +.bar-pageviews { + fill: #88ffc6; +} + +.bar-visitors { + fill: #533feb; +} + +.axis .domain{ + stroke: none; +} + +.axis line { + stroke: rgba(218, 218, 218, 0.5); +} + +.axis text { + font-size: 12px; + fill: #98a0a6; +} + +.d3-tip { + font-size: 12px; + color: #959da5; + text-align: left; + background: rgba(0,0,0,.8); + border-radius: 3px; +} + +.tip-heading { + font-weight: 600; + padding: 10px; + line-height: 1; +} + +.tip-content { + display: flex; + +} + +.tip-content > div { + padding: 5px 10px; + width: 50%; + display: block; + flex: 1; + min-width: 90px; +} + + +.tip-pageviews { + border-top: 3px solid rgb(136, 255, 198); +} + +.tip-visitors { + border-top: 3px solid rgb(83, 63, 235); +} + +.tip-number { + color: #dfe2e5; + font-weight: 600; +} diff --git a/assets/src/css/fonts-overpass.css b/assets/src/css/fonts-overpass.css new file mode 100644 index 00000000..0b6efac9 --- /dev/null +++ b/assets/src/css/fonts-overpass.css @@ -0,0 +1,189 @@ +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-thin.eot'); /* IE9 Compat Modes */ + src: url('../fonts/overpass-thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('../fonts/overpass-thin.woff2') format('woff2'), /* Super Modern Browsers */ + url('../fonts/overpass-thin.woff') format('woff'), /* Pretty Modern Browsers */ + url('../fonts/overpass-thin.ttf') format('truetype'); /* Safari, Android, iOS */ + font-weight: 200; + font-style: normal; +} + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-thin-italic.eot'); + src: url('../fonts/overpass-thin-italic.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-thin-italic.woff2') format('woff2'), + url('../fonts/overpass-thin-italic.woff') format('woff'), + url('../fonts/overpass-thin-italic.ttf') format('truetype'); + font-weight: 200; + font-style: italic; +} + + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-extralight.eot'); + src: url('../fonts/overpass-extralight.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-extralight.woff2') format('woff2'), + url('../fonts/overpass-extralight.woff') format('woff'), + url('../fonts/overpass-extralight.ttf') format('truetype'); + font-weight: 300; + font-style: normal; +} + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-extralight-italic.eot'); + src: url('../fonts/overpass-extralight-italic.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-extralight-italic.woff2') format('woff2'), + url('../fonts/overpass-extralight-italic.woff') format('woff'), + url('../fonts/overpass-extralight-italic.ttf') format('truetype'); + font-weight: 300; + font-style: italic; +} + + + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-light.eot'); + src: url('../fonts/overpass-light.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-light.woff2') format('woff2'), + url('../fonts/overpass-light.woff') format('woff'), + url('../fonts/overpass-light.ttf') format('truetype'); + font-weight: 400; + font-style: normal; +} + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-light-italic.eot'); + src: url('../fonts/overpass-light-italic.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-light-italic.woff2') format('woff2'), + url('../fonts/overpass-light-italic.woff') format('woff'), + url('../fonts/overpass-light-italic.ttf') format('truetype'); + font-weight: 400; + font-style: italic; +} + + + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-regular.eot'); + src: url('../fonts/overpass-regular.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-regular.woff2') format('woff2'), + url('../fonts/overpass-regular.woff') format('woff'), + url('../fonts/overpass-regular.ttf') format('truetype'); + font-weight: 500; + font-style: normal; +} + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-italic.eot'); + src: url('../fonts/overpass-italic.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-italic.woff2') format('woff2'), + url('../fonts/overpass-italic.woff') format('woff'), + url('../fonts/overpass-italic.ttf') format('truetype'); + font-weight: 500; + font-style: italic; +} + + + + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-semibold.eot'); + src: url('../fonts/overpass-semibold.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-semibold.woff2') format('woff2'), + url('../fonts/overpass-semibold.woff') format('woff'), + url('../fonts/overpass-semibold.ttf') format('truetype'); + font-weight: 600; + font-style: normal; +} + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-semibold-italic.eot'); + src: url('../fonts/overpass-semibold-italic.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-semibold-italic.woff2') format('woff2'), + url('../fonts/overpass-semibold-italic.woff') format('woff'), + url('../fonts/overpass-semibold-italic.ttf') format('truetype'); + font-weight: 600; + font-style: italic; +} + + + + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-bold.eot'); + src: url('../fonts/overpass-bold.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-bold.woff2') format('woff2'), + url('../fonts/overpass-bold.woff') format('woff'), + url('../fonts/overpass-bold.ttf') format('truetype'); + font-weight: 700; + font-style: normal; +} + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-bold-italic.eot'); + src: url('../fonts/overpass-bold-italic.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-bold-italic.woff2') format('woff2'), + url('../fonts/overpass-bold-italic.woff') format('woff'), + url('../fonts/overpass-bold-italic.ttf') format('truetype'); + font-weight: 700; + font-style: italic; +} + + + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-extrabold.eot'); + src: url('../fonts/overpass-extrabold.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-extrabold.woff2') format('woff2'), + url('../fonts/overpass-extrabold.woff') format('woff'), + url('../fonts/overpass-extrabold.ttf') format('truetype'); + font-weight: 800; + font-style: normal; +} + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-extrabold-italic.eot'); + src: url('../fonts/overpass-extrabold-italic.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-extrabold-italic.woff2') format('woff2'), + url('../fonts/overpass-extrabold-italic.woff') format('woff'), + url('../fonts/overpass-extrabold-italic.ttf') format('truetype'); + font-weight: 800; + font-style: italic; +} + + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-heavy.eot'); + src: url('../fonts/overpass-heavy.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-heavy.woff2') format('woff2'), + url('../fonts/overpass-heavy.woff') format('woff'), + url('../fonts/overpass-heavy.ttf') format('truetype'); + font-weight: 900; + font-style: normal; +} + +@font-face { + font-family: 'overpass'; + src: url('../fonts/overpass-heavy-italic.eot'); + src: url('../fonts/overpass-heavy-italic.eot?#iefix') format('embedded-opentype'), + url('../fonts/overpass-heavy-italic.woff2') format('woff2'), + url('../fonts/overpass-heavy-italic.woff') format('woff'), + url('../fonts/overpass-heavy-italic.ttf') format('truetype'); + font-weight: 900; + font-style: italic; +} diff --git a/assets/src/sass/pikaday.scss b/assets/src/css/pikaday.css similarity index 99% rename from assets/src/sass/pikaday.scss rename to assets/src/css/pikaday.css index 8abdc4b8..7d7346d7 100644 --- a/assets/src/sass/pikaday.scss +++ b/assets/src/css/pikaday.css @@ -1,4 +1,3 @@ - @charset "UTF-8"; /*! diff --git a/assets/src/css/styles.css b/assets/src/css/styles.css new file mode 100644 index 00000000..e59a1f9c --- /dev/null +++ b/assets/src/css/styles.css @@ -0,0 +1,155 @@ +/* +overpass 200, 500, 600 +purple #533feb +green #88ffc6 + +dark #46494d +medium #98a0a6 +light #f5f7fa + +padding 8, 16, 20, 32, 64, 128, 256, 512, 1024 +font size 12, 16, 64 + */ + +::selection { background: #a0ffd1; } +::-moz-selection { background: #a0ffd1; } +* { margin: 0; padding: 0; border: none; outline: none; list-style: none; box-sizing: border-box; text-decoration: none; font-size: 100%; vertical-align: baseline; line-height: 1.2; } + +html, body, #root { height: 100%; background: #f5f7fa; } +body { overflow-y: scroll; font: 400 16px "overpass", sans-serif; color: #222; text-align: center; padding: 8px; } + +.rapper { text-align: left; margin: 0 auto; max-width: 1124px; } + +header, footer { margin: 16px 0; } +section {} +footer { font-size: 12px; color: #aaa; } + +a { transition: ease color .2s; } + +nav { position: relative; font-size: 12px; } + +nav a { color: #222; } +footer nav a { color: #aaa; padding: 4px 0; display: inline-block; } +footer nav a:hover { color: #222; } + +header li { padding: 8px 0; } +nav li.logo a { color: #533feb; font-size: 16px; } +nav li.logo a:hover { color: #222; } + +nav li.sites { background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23533feb' d='M151.5 347.8L3.5 201c-4.7-4.7-4.7-12.3 0-17l19.8-19.8c4.7-4.7 12.3-4.7 17 0L160 282.7l119.7-118.5c4.7-4.7 12.3-4.7 17 0l19.8 19.8c4.7 4.7 4.7 12.3 0 17l-148 146.8c-4.7 4.7-12.3 4.7-17 0z'%3E%3C/path%3E%3C/svg%3E") 97% 8px no-repeat; border-radius: 4px; padding: 8px; background-size: 10px auto; } +nav li.sites.expanded { background: #533feb url("data:image/svg+xml;charset=utf8,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23fff' d='M168.5 164.2l148 146.8c4.7 4.7 4.7 12.3 0 17l-19.8 19.8c-4.7 4.7-12.3 4.7-17 0L160 229.3 40.3 347.8c-4.7 4.7-12.3 4.7-17 0L3.5 328c-4.7-4.7-4.7-12.3 0-17l148-146.8c4.7-4.7 12.3-4.7 17 0z'%3E%3C/path%3E%3C/svg%3E") 97% 8px no-repeat; background-size: 10px auto; } +nav li ul { display: none; position: absolute; z-index: 1001; width: 100%; background: #533feb; border-radius: 4px; padding: 8px 0; margin: 0 0 0 -8px; } +nav li.expanded ul { display: block; box-shadow: 0 2px 8px 0 rgba(34,34,34,.10); } +nav li.sites.expanded a { color: #fff; } +nav li ul li { padding: 0 4px; width: 100%; } +nav li ul a { color: #ddd; display: inline-block; width: 100%; font-size: 13px; padding: 4px; } +nav li ul a:hover { background: rgba(255,255,255,.2); border-radius: 2px; } +nav li ul li.add-new a { color: #88ffc6 !important; } + +nav .settings svg { width: 16px; display: inline-block; transition: ease all .2s; } +nav .settings svg path { fill: #533feb; } +nav .settings svg:hover { transform: rotate(45deg); } + +.date-nav { margin-bottom: 12px; } +.date-nav li a { position: relative; font-size: 12px; text-transform: uppercase; padding-right: 8px; } +.date-nav li.custom { color: #aaa; float: right; margin: 0; } +.date-nav li.custom input { + display: inline-block; + width: 75px; + border: 0; + font-size: inherit; + background: transparent; + padding: 0; + cursor: pointer; +} +.date-nav li a:hover { color: #aaa; } +.date-nav li.active a { padding-right: 8px; z-index: 1; color: #222; } +.date-nav li.active a:after { content:""; background: #88ffc6; display: block; width: 100%; height: 3px; position: absolute; top: 6px; z-index: -1; margin: 0 0 0 -4px; } + +.box { background: #fff; border-radius: 4px; margin-bottom: 16px; padding: 16px; box-shadow: 0 2px 8px 0 rgba(34,34,34,.10); } + +.box-totals { background: #222; color: #ddd; } + +.totals-detail { display: grid; grid-template-columns: 1fr 1.6fr; grid-gap: 12px; } +.total-numbers { text-align: right; } +.current-detail div { color: #88ffc6; } + +.table-row { display: grid; grid-template-columns: 4fr 1fr 1fr; grid-gap: 12px; padding: 8px 0; position: relative; } +.table-row.header { font-size: 12px; text-transform: uppercase; color: #aaa; } +.table-row a { color: #222; } +.table-row a:hover { color: #533feb; } +.cell { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: right; z-index: 1; position: relative; } +.cell.main-col { text-align: left; } + +.table-row:after { content: ""; background: #88ffc6; position: absolute; height: 34px; top: 0; left: -16px; opacity: .2; border-right: 2px solid #45ce8c; z-index: 0; } +.table-row.header:after { background: none; border: none; } + +.modal-wrap { position: fixed; height: 100%; width: 100%; top: 0; left: 0; z-index: 1977; background: rgba(20,20,20,.8); display: grid; grid-template-columns: 1fr; align-items: center; } +.modal { max-width: 480px; width: 100%; margin: 0 auto; text-align: left; background: #fff; z-index: 1978; height: auto; border-radius: 4px; box-shadow: 0 2px 8px 0 rgba(34,34,34,.10); overflow: hidden; } +.modal p { padding: 16px; font-size: 12px; color: #aaa; } + +small { font-size: 12px; color: #aaa; } +small a { color: #aaa; } + +.modal form { padding: 0 16px; } +label { padding: 4px 0; display: block; } +fieldset { display: block; width: 100%; margin-bottom: 32px; } +fieldset:last-child { margin-bottom: 16px; } +input, textarea { background: #f5f7fa; padding: 4px; width: 100%; display: block; font: 400 16px "overpass", sans-serif; color: #222; border-bottom: 2px solid #e6e8eb; } +textarea { font-size: 12px; min-height: 120px; resize: none; overflow-y: scroll; } +button { background: #88ffc6; color: #222; padding: 4px 16px; font: 400 16px "overpass", sans-serif; cursor: pointer; border-radius: 4px; } +div.delete a { color: red; } + +.w100:after{width:99%}.w99:after{width:99%}.w98:after{width:98%}.w97:after{width:97%}.w96:after{width:96%}.w95:after{width:95%}.w94:after{width:94%}.w93:after{width:93%}.w92:after{width:92%}.w91:after{width:91%}.w90:after{width:90%}.w89:after{width:89%}.w88:after{width:88%}.w87:after{width:87%}.w86:after{width:86%}.w85:after{width:85%}.w84:after{width:84%}.w83:after{width:83%}.w82:after{width:82%}.w81:after{width:81%}.w80:after{width:80%}.w79:after{width:79%}.w78:after{width:78%}.w77:after{width:77%}.w76:after{width:76%}.w75:after{width:75%}.w74:after{width:74%}.w73:after{width:73%}.w72:after{width:72%}.w71:after{width:71%}.w70:after{width:70%}.w69:after{width:69%}.w68:after{width:68%}.w67:after{width:67%}.w66:after{width:66%}.w65:after{width:65%}.w64:after{width:64%}.w63:after{width:63%}.w62:after{width:62%}.w61:after{width:61%}.w60:after{width:60%}.w59:after{width:59%}.w58:after{width:58%}.w57:after{width:57%}.w56:after{width:56%}.w55:after{width:55%}.w54:after{width:54%}.w53:after{width:53%}.w52:after{width:52%}.w51:after{width:51%}.w50:after{width:50%}.w49:after{width:49%}.w48:after{width:48%}.w47:after{width:47%}.w46:after{width:46%}.w45:after{width:45%}.w44:after{width:44%}.w43:after{width:43%}.w42:after{width:42%}.w41:after{width:41%}.w40:after{width:40%}.w39:after{width:39%}.w38:after{width:38%}.w37:after{width:37%}.w36:after{width:36%}.w35:after{width:35%}.w34:after{width:34%}.w33:after{width:33%}.w32:after{width:32%}.w31:after{width:31%}.w30:after{width:30%}.w29:after{width:29%}.w28:after{width:28%}.w27:after{width:27%}.w26:after{width:26%}.w25:after{width:25%}.w24:after{width:24%}.w23:after{width:23%}.w22:after{width:22%}.w21:after{width:21%}.w20:after{width:20%}.w19:after{width:19%}.w18:after{width:18%}.w17:after{width:17%}.w16:after{width:16%}.w15:after{width:15%}.w14:after{width:14%}.w13:after{width:13%}.w12:after{width:12%}.w11:after{width:11%}.w10:after{width:10%}.w09:after{width:9%}.w08:after{width:8%}.w07:after{width:7%}.w06:after{width:6%}.w05:after{width:5%}.w04:after{width:4%}.w03:after{width:3%}.w02:after{width:2%}.w01:after{width:1%}.w00:after{width:0} + + + +@media ( min-width: 1220px ) { + body { padding: 0; } + header, footer { margin: 32px 0; } + + nav li { display: inline-block; position: relative; margin-right: 16px; } + nav li.sites { width: 204px; margin-right: 0; } + nav li.sites, nav li.settings { float: right; } + nav li.sites, nav li.sites.expanded { background-position: 184px 8px; } + + nav .date-nav li { margin-right: 8px; } + nav li ul { width: 204px; right: 0; margin: 0; } + + .box { margin: 0; padding: 32px 16px; } + .boxes { display: grid; grid-template-columns: 276px 420px 420px; grid-gap: 4px; } + .box-totals { grid-column: 1; grid-row: 1/3; } + .box-graph { grid-column: 2/4; grid-row: 1; margin: 0 0 4px 0; } + .box-pages { grid-column: 2; grid-row: 2 ; } + .box-referrers { grid-column: 3; grid-row: 2; } + + /* since we hide chart for views with less than a day worth of data, move tables to row 1 */ + .ltday .box-pages, .ltday .box-referrers{ grid-row: 1; } + + .half { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 12px; align-items: center; } + .half div { text-align: right; } + .half div.submit { text-align: left; } + + .totals-detail { display: block; margin-bottom: 32px; } + .total-heading { font-size: 12px; text-transform: uppercase; color: #888; line-height: .8; } + .total-numbers { font-size: 68px; font-weight: 200; letter-spacing: -.06em; text-align: left; } + +} + + + + +.login-page.flex-rapper { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } +.login-rapper { text-align: left; width: 320px; } +.login-page label { position: relative; } +.login-page label svg { width: 16px; height: auto; fill: #533feb; position: absolute; left: -28px; top: 12px; } +.login-page input { border-radius: 0; border: none; outline: none; background: #fff; box-sizing: border-box; width: 100%; padding: 8px; margin-bottom: 4px; display: block; } +.login-page input{ line-height: 1; font: 400 16px/1 'overpass', sans-serif; } + +.login-page button { width: 100%; box-sizing: border-box; padding: 8px; background: #533feb; color: #fff; border: 0; font: 400 16px/1 'overpass', sans-serif; } + +.login-page small { color: #98a0a6; font-size: 14px; margin: 48px auto 0 auto; text-align: center; display: block; } +.login-page small a { color: #98a0a6; font-size: 14px; display: inline-block; padding: 0 8px; } + + + diff --git a/assets/src/css/util.css b/assets/src/css/util.css new file mode 100644 index 00000000..a0dbc7b9 --- /dev/null +++ b/assets/src/css/util.css @@ -0,0 +1,62 @@ +.small-margin { + margin-top: 20px; + margin-bottom: 20px; +} + +.cf:after { + content: ""; + display: table; + clear: both; +} + +@media(max-width: 600px) { + .hide-on-mobile { display: none !important; } +} + +.right { + float: right; +} + +.left { + float: left; +} + +.notification { + position: fixed; + top: 20px; + left: 0; right: 0; + text-align: center; + width: 100%; +} + +.notification .notification-error { + padding: 4px; + display: inline-block; + background-color: #f2dede; + border: 1px solid #ebccd1; +} + +@keyframes fadeInUp { + 0% { opacity: 0; transform: translateY(20px); } + 100% { opacity: 1; transform: translateY(0); } +} + +@keyframes fadeInDown { + 0% { opacity: 0; transform: translateY(-20px); } + 100% { opacity: 1; transform: translateY(0); } +} + +.animated { animation-duration: .4s; animation-fill-mode: both; } + +.delayed_02s { animation-delay: .2s; } +.delayed_03s { animation-delay: .3s; } +.delayed_04s { animation-delay: .4s; } +.delayed_05s { animation-delay: .5s; } +.delayed_06s { animation-delay: .6s; } + +.fadeInUp { animation-name: fadeInUp; } +.fadeInDown { animation-name: fadeInDown; } + +.loading { + opacity: 0.8; +} diff --git a/assets/src/sass/chart.scss b/assets/src/sass/chart.scss deleted file mode 100644 index 19a3d282..00000000 --- a/assets/src/sass/chart.scss +++ /dev/null @@ -1,76 +0,0 @@ -.box-graph { - background: white; - margin-left: 0 !important; -} - -#chart { - height: 240px; - - * { box-sizing: content-box; } - - .muted { - fill: #98a0a6; - } -} - -.bar-pageviews { - fill: #88ffc6; -} - -.bar-visitors { - fill: #533feb; -} - -.axis { - .domain{ - stroke: none; - } - - line { - stroke: rgba(218, 218, 218, 0.5); - } - - text { - font-size: 12px; - fill: #98a0a6; - } -} - -.d3-tip { - font-size: 12px; - color: #959da5; - text-align: left; - background: rgba(0,0,0,.8); - border-radius: 3px; -} - -.tip-heading { - font-weight: 600; - padding: 10px; - line-height: 1; -} - -.tip-content { - display: flex; - - > div { - padding: 5px 10px; - width: 50%; - display: block; - flex: 1; - min-width: 90px; - } -} - -.tip-pageviews { - border-top: 3px solid rgb(136, 255, 198); -} - -.tip-visitors { - border-top: 3px solid rgb(83, 63, 235); -} - -.tip-number { - color: #dfe2e5; - font-weight: 600; -} diff --git a/assets/src/sass/fonts-overpass.scss b/assets/src/sass/fonts-overpass.scss deleted file mode 100644 index 73cab272..00000000 --- a/assets/src/sass/fonts-overpass.scss +++ /dev/null @@ -1,190 +0,0 @@ -@font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-thin.eot'); /* IE9 Compat Modes */ - src: url('../fonts/overpass-thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ - url('../fonts/overpass-thin.woff2') format('woff2'), /* Super Modern Browsers */ - url('../fonts/overpass-thin.woff') format('woff'), /* Pretty Modern Browsers */ - url('../fonts/overpass-thin.ttf') format('truetype'); /* Safari, Android, iOS */ - font-weight: 200; - font-style: normal; - } - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-thin-italic.eot'); - src: url('../fonts/overpass-thin-italic.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-thin-italic.woff2') format('woff2'), - url('../fonts/overpass-thin-italic.woff') format('woff'), - url('../fonts/overpass-thin-italic.ttf') format('truetype'); - font-weight: 200; - font-style: italic; - } - - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-extralight.eot'); - src: url('../fonts/overpass-extralight.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-extralight.woff2') format('woff2'), - url('../fonts/overpass-extralight.woff') format('woff'), - url('../fonts/overpass-extralight.ttf') format('truetype'); - font-weight: 300; - font-style: normal; - } - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-extralight-italic.eot'); - src: url('../fonts/overpass-extralight-italic.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-extralight-italic.woff2') format('woff2'), - url('../fonts/overpass-extralight-italic.woff') format('woff'), - url('../fonts/overpass-extralight-italic.ttf') format('truetype'); - font-weight: 300; - font-style: italic; - } - - - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-light.eot'); - src: url('../fonts/overpass-light.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-light.woff2') format('woff2'), - url('../fonts/overpass-light.woff') format('woff'), - url('../fonts/overpass-light.ttf') format('truetype'); - font-weight: 400; - font-style: normal; - } - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-light-italic.eot'); - src: url('../fonts/overpass-light-italic.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-light-italic.woff2') format('woff2'), - url('../fonts/overpass-light-italic.woff') format('woff'), - url('../fonts/overpass-light-italic.ttf') format('truetype'); - font-weight: 400; - font-style: italic; - } - - - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-regular.eot'); - src: url('../fonts/overpass-regular.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-regular.woff2') format('woff2'), - url('../fonts/overpass-regular.woff') format('woff'), - url('../fonts/overpass-regular.ttf') format('truetype'); - font-weight: 500; - font-style: normal; - } - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-italic.eot'); - src: url('../fonts/overpass-italic.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-italic.woff2') format('woff2'), - url('../fonts/overpass-italic.woff') format('woff'), - url('../fonts/overpass-italic.ttf') format('truetype'); - font-weight: 500; - font-style: italic; - } - - - - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-semibold.eot'); - src: url('../fonts/overpass-semibold.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-semibold.woff2') format('woff2'), - url('../fonts/overpass-semibold.woff') format('woff'), - url('../fonts/overpass-semibold.ttf') format('truetype'); - font-weight: 600; - font-style: normal; - } - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-semibold-italic.eot'); - src: url('../fonts/overpass-semibold-italic.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-semibold-italic.woff2') format('woff2'), - url('../fonts/overpass-semibold-italic.woff') format('woff'), - url('../fonts/overpass-semibold-italic.ttf') format('truetype'); - font-weight: 600; - font-style: italic; - } - - - - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-bold.eot'); - src: url('../fonts/overpass-bold.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-bold.woff2') format('woff2'), - url('../fonts/overpass-bold.woff') format('woff'), - url('../fonts/overpass-bold.ttf') format('truetype'); - font-weight: 700; - font-style: normal; - } - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-bold-italic.eot'); - src: url('../fonts/overpass-bold-italic.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-bold-italic.woff2') format('woff2'), - url('../fonts/overpass-bold-italic.woff') format('woff'), - url('../fonts/overpass-bold-italic.ttf') format('truetype'); - font-weight: 700; - font-style: italic; - } - - - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-extrabold.eot'); - src: url('../fonts/overpass-extrabold.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-extrabold.woff2') format('woff2'), - url('../fonts/overpass-extrabold.woff') format('woff'), - url('../fonts/overpass-extrabold.ttf') format('truetype'); - font-weight: 800; - font-style: normal; - } - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-extrabold-italic.eot'); - src: url('../fonts/overpass-extrabold-italic.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-extrabold-italic.woff2') format('woff2'), - url('../fonts/overpass-extrabold-italic.woff') format('woff'), - url('../fonts/overpass-extrabold-italic.ttf') format('truetype'); - font-weight: 800; - font-style: italic; - } - - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-heavy.eot'); - src: url('../fonts/overpass-heavy.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-heavy.woff2') format('woff2'), - url('../fonts/overpass-heavy.woff') format('woff'), - url('../fonts/overpass-heavy.ttf') format('truetype'); - font-weight: 900; - font-style: normal; - } - - @font-face { - font-family: 'overpass'; - src: url('../fonts/overpass-heavy-italic.eot'); - src: url('../fonts/overpass-heavy-italic.eot?#iefix') format('embedded-opentype'), - url('../fonts/overpass-heavy-italic.woff2') format('woff2'), - url('../fonts/overpass-heavy-italic.woff') format('woff'), - url('../fonts/overpass-heavy-italic.ttf') format('truetype'); - font-weight: 900; - font-style: italic; - } - \ No newline at end of file diff --git a/assets/src/sass/styles.scss b/assets/src/sass/styles.scss deleted file mode 100644 index 57dc2fa0..00000000 --- a/assets/src/sass/styles.scss +++ /dev/null @@ -1,164 +0,0 @@ -/* -overpass 200, 500, 600 -purple #533feb -green #88ffc6 - -dark #46494d -medium #98a0a6 -light #f5f7fa - -padding 8, 16, 20, 32, 64, 128, 256, 512, 1024 -font size 12, 16, 64 -*/ -@import "fonts-overpass"; - -::selection { background: #a0ffd1; } -::-moz-selection { background: #a0ffd1; } -* { margin: 0; padding: 0; border: none; outline: none; list-style: none; box-sizing: border-box; text-decoration: none; font-size: 100%; vertical-align: baseline; line-height: 1.2; } - -html, body, #root { height: 100%; } -body { overflow-y: scroll; } -html, body { background: #f5f7fa; } -body { font: 400 16px "overpass", sans-serif; color: #222; text-align: center; padding: 8px; } - - -.app-page { - - .rapper { text-align: left; margin: 0 auto; max-width: 1124px; } - - header, footer { margin: 16px 0; } - section {} - footer { font-size: 12px; color: #aaa; } - - a { transition: ease color .2s; } - - nav { position: relative; font-size: 12px; } - - nav a { color: #222; } - footer nav a { color: #aaa; padding: 4px 0; display: inline-block; } - footer nav a:hover { color: #222; } - - header li { padding: 8px 0; } - nav li.logo a { color: #533feb; font-size: 16px; } - nav li.logo a:hover { color: #222; } - - nav li.sites { background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23533feb' d='M151.5 347.8L3.5 201c-4.7-4.7-4.7-12.3 0-17l19.8-19.8c4.7-4.7 12.3-4.7 17 0L160 282.7l119.7-118.5c4.7-4.7 12.3-4.7 17 0l19.8 19.8c4.7 4.7 4.7 12.3 0 17l-148 146.8c-4.7 4.7-12.3 4.7-17 0z'%3E%3C/path%3E%3C/svg%3E") 97% 8px no-repeat; border-radius: 4px; padding: 8px; background-size: 10px auto; } - nav li.sites.expanded { background: #533feb url("data:image/svg+xml;charset=utf8,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23fff' d='M168.5 164.2l148 146.8c4.7 4.7 4.7 12.3 0 17l-19.8 19.8c-4.7 4.7-12.3 4.7-17 0L160 229.3 40.3 347.8c-4.7 4.7-12.3 4.7-17 0L3.5 328c-4.7-4.7-4.7-12.3 0-17l148-146.8c4.7-4.7 12.3-4.7 17 0z'%3E%3C/path%3E%3C/svg%3E") 97% 8px no-repeat; background-size: 10px auto; } - nav li ul { display: none; position: absolute; z-index: 1001; width: 100%; background: #533feb; border-radius: 4px; padding: 8px 0; margin: 0 0 0 -8px; } - nav li.expanded ul { display: block; box-shadow: 0 2px 8px 0 rgba(34,34,34,.10); } - nav li.sites.expanded a { color: #fff; } - nav li ul li { padding: 0 4px; width: 100%; } - nav li ul a { color: #ddd; display: inline-block; width: 100%; font-size: 13px; padding: 4px; } - nav li ul a:hover { background: rgba(255,255,255,.2); border-radius: 2px; } - nav li ul li.add-new a { color: #88ffc6 !important; } - - nav .settings svg { width: 16px; display: inline-block; transition: ease all .2s; } - nav .settings svg path { fill: #533feb; } - nav .settings svg:hover { transform: rotate(45deg); } - - .date-nav { margin-bottom: 12px; } - .date-nav li a { position: relative; font-size: 12px; text-transform: uppercase; padding-right: 8px; } - .date-nav li.custom { color: #aaa; float: right; margin: 0; } - .date-nav li.custom input { - display: inline-block; - width: 75px; - border: 0; - font-size: inherit; - background: transparent; - padding: 0; - cursor: pointer; - } - .date-nav li a:hover { color: #aaa; } - .date-nav li.active a { padding-right: 8px; z-index: 1; color: #222; } - .date-nav li.active a:after { content:""; background: #88ffc6; display: block; width: 100%; height: 3px; position: absolute; top: 6px; z-index: -1; margin: 0 0 0 -4px; } - - .box { background: #fff; border-radius: 4px; margin-bottom: 16px; padding: 16px; box-shadow: 0 2px 8px 0 rgba(34,34,34,.10); } - - .box-totals { background: #222; color: #ddd; } - - .totals-detail { display: grid; grid-template-columns: 1fr 1.6fr; grid-gap: 12px; } - .total-numbers { text-align: right; } - .current-detail div { color: #88ffc6; } - - .table-row { display: grid; grid-template-columns: 4fr 1fr 1fr; grid-gap: 12px; padding: 8px 0; position: relative; } - .table-row.header { font-size: 12px; text-transform: uppercase; color: #aaa; } - .table-row a { color: #222; } - .table-row a:hover { color: #533feb; } - .cell { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: right; z-index: 1; position: relative; } - .cell.main-col { text-align: left; } - - .table-row:after { content: ""; background: #88ffc6; position: absolute; height: 34px; top: 0; left: -16px; opacity: .2; border-right: 2px solid #45ce8c; z-index: 0; } - .table-row.header:after { background: none; border: none; } - - .modal-wrap { position: fixed; height: 100%; width: 100%; top: 0; left: 0; z-index: 1977; background: rgba(20,20,20,.8); display: grid; grid-template-columns: 1fr; align-items: center; } - .modal { max-width: 480px; width: 100%; margin: 0 auto; text-align: left; background: #fff; z-index: 1978; height: auto; border-radius: 4px; box-shadow: 0 2px 8px 0 rgba(34,34,34,.10); overflow: hidden; } - .modal p { padding: 16px; font-size: 12px; color: #aaa; } - - small { font-size: 12px; color: #aaa; } - small a { color: #aaa; } - - .modal form { padding: 0 16px; } - label { padding: 4px 0; display: block; } - fieldset { display: block; width: 100%; margin-bottom: 32px; } - fieldset:last-child { margin-bottom: 16px; } - input, textarea { background: #f5f7fa; padding: 4px; width: 100%; display: block; font: 400 16px "overpass", sans-serif; color: #222; border-bottom: 2px solid #e6e8eb; } - textarea { font-size: 12px; min-height: 120px; resize: none; overflow-y: scroll; } - button { background: #88ffc6; color: #222; padding: 4px 16px; font: 400 16px "overpass", sans-serif; cursor: pointer; border-radius: 4px; } - div.delete a { color: red; } - - .w100:after{width:99%}.w99:after{width:99%}.w98:after{width:98%}.w97:after{width:97%}.w96:after{width:96%}.w95:after{width:95%}.w94:after{width:94%}.w93:after{width:93%}.w92:after{width:92%}.w91:after{width:91%}.w90:after{width:90%}.w89:after{width:89%}.w88:after{width:88%}.w87:after{width:87%}.w86:after{width:86%}.w85:after{width:85%}.w84:after{width:84%}.w83:after{width:83%}.w82:after{width:82%}.w81:after{width:81%}.w80:after{width:80%}.w79:after{width:79%}.w78:after{width:78%}.w77:after{width:77%}.w76:after{width:76%}.w75:after{width:75%}.w74:after{width:74%}.w73:after{width:73%}.w72:after{width:72%}.w71:after{width:71%}.w70:after{width:70%}.w69:after{width:69%}.w68:after{width:68%}.w67:after{width:67%}.w66:after{width:66%}.w65:after{width:65%}.w64:after{width:64%}.w63:after{width:63%}.w62:after{width:62%}.w61:after{width:61%}.w60:after{width:60%}.w59:after{width:59%}.w58:after{width:58%}.w57:after{width:57%}.w56:after{width:56%}.w55:after{width:55%}.w54:after{width:54%}.w53:after{width:53%}.w52:after{width:52%}.w51:after{width:51%}.w50:after{width:50%}.w49:after{width:49%}.w48:after{width:48%}.w47:after{width:47%}.w46:after{width:46%}.w45:after{width:45%}.w44:after{width:44%}.w43:after{width:43%}.w42:after{width:42%}.w41:after{width:41%}.w40:after{width:40%}.w39:after{width:39%}.w38:after{width:38%}.w37:after{width:37%}.w36:after{width:36%}.w35:after{width:35%}.w34:after{width:34%}.w33:after{width:33%}.w32:after{width:32%}.w31:after{width:31%}.w30:after{width:30%}.w29:after{width:29%}.w28:after{width:28%}.w27:after{width:27%}.w26:after{width:26%}.w25:after{width:25%}.w24:after{width:24%}.w23:after{width:23%}.w22:after{width:22%}.w21:after{width:21%}.w20:after{width:20%}.w19:after{width:19%}.w18:after{width:18%}.w17:after{width:17%}.w16:after{width:16%}.w15:after{width:15%}.w14:after{width:14%}.w13:after{width:13%}.w12:after{width:12%}.w11:after{width:11%}.w10:after{width:10%}.w09:after{width:9%}.w08:after{width:8%}.w07:after{width:7%}.w06:after{width:6%}.w05:after{width:5%}.w04:after{width:4%}.w03:after{width:3%}.w02:after{width:2%}.w01:after{width:1%}.w00:after{width:0} - - - - @media ( min-width: 1220px ) { - body { padding: 0; } - header, footer { margin: 32px 0; } - - nav li { display: inline-block; position: relative; margin-right: 16px; } - nav li.sites { width: 204px; margin-right: 0; } - nav li.sites, nav li.settings { float: right; } - nav li.sites, nav li.sites.expanded { background-position: 184px 8px; } - - nav .date-nav li { margin-right: 8px; } - nav li ul { width: 204px; right: 0; margin: 0; } - - .box { margin: 0; padding: 32px 16px; } - .boxes { display: grid; grid-template-columns: 276px 420px 420px; grid-gap: 4px; } - .box-totals { grid-column: 1; grid-row: 1/3; } - .box-graph { grid-column: 2/4; grid-row: 1; margin: 0 0 4px 0; } - .box-pages { grid-column: 2; grid-row: 2 ; } - .box-referrers { grid-column: 3; grid-row: 2; } - - /* since we hide chart for views with less than a day worth of data, move tables to row 1 */ - .ltday .box-pages, .ltday .box-referrers{ grid-row: 1; } - - .half { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 12px; align-items: center; } - .half div { text-align: right; } - .half div.submit { text-align: left; } - - .totals-detail { display: block; margin-bottom: 32px; } - .total-heading { font-size: 12px; text-transform: uppercase; color: #888; line-height: .8; } - .total-numbers { font-size: 68px; font-weight: 200; letter-spacing: -.06em; text-align: left; } - - } -} - -.login-page{ - - &.flex-rapper { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } - .login-rapper { text-align: left; width: 320px; } - label { position: relative; } - label svg { width: 16px; height: auto; fill: #533feb; position: absolute; left: -28px; top: 12px; } - input { border-radius: 0; border: none; outline: none; background: #fff; box-sizing: border-box; width: 100%; padding: 8px; margin-bottom: 4px; display: block; } - input{ line-height: 1; font: 400 16px/1 'overpass', sans-serif; } - - button { width: 100%; box-sizing: border-box; padding: 8px; background: #533feb; color: #fff; border: 0; font: 400 16px/1 'overpass', sans-serif; } - - small { color: #98a0a6; font-size: 14px; margin: 48px auto 0 auto; text-align: center; display: block; } - small a { color: #98a0a6; font-size: 14px; display: inline-block; padding: 0 8px; } -} - - -@import "util"; -@import "pikaday"; -@import "chart"; diff --git a/assets/src/sass/util.scss b/assets/src/sass/util.scss deleted file mode 100644 index 9432ef9e..00000000 --- a/assets/src/sass/util.scss +++ /dev/null @@ -1,62 +0,0 @@ -.small-margin { - margin-top: 20px; - margin-bottom: 20px; -} - -.cf:after { - content: ""; - display: table; - clear: both; -} - -@media(max-width: 600px) { - .hide-on-mobile { display: none !important; } -} - -.right { - float: right; -} - -.left { - float: left; -} - -.notification { - position: fixed; - top: 20px; - left: 0; right: 0; - text-align: center; - width: 100%; - - .notification-error { - padding: 4px; - display: inline-block; - background-color: #f2dede; - border: 1px solid #ebccd1; - } -} - -@keyframes fadeInUp { - 0% { opacity: 0; transform: translateY(20px); } - 100% { opacity: 1; transform: translateY(0); } -} - -@keyframes fadeInDown { - 0% { opacity: 0; transform: translateY(-20px); } - 100% { opacity: 1; transform: translateY(0); } -} - -.animated { animation-duration: .4s; animation-fill-mode: both; } - -.delayed_02s { animation-delay: .2s; } -.delayed_03s { animation-delay: .3s; } -.delayed_04s { animation-delay: .4s; } -.delayed_05s { animation-delay: .5s; } -.delayed_06s { animation-delay: .6s; } - -.fadeInUp { animation-name: fadeInUp; } -.fadeInDown { animation-name: fadeInDown; } - -.loading { - opacity: 0.8; -} diff --git a/gulpfile.js b/gulpfile.js index deabaadd..a268dfee 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -6,16 +6,16 @@ const source = require('vinyl-source-stream') const buffer = require('vinyl-buffer') const rename = require('gulp-rename') const gutil = require('gulp-util') -const sass = require('gulp-sass') const uglify = require('gulp-uglify') const babel = require('gulp-babel'); const cachebust = require('gulp-cache-bust'); +const concat = require('gulp-concat'); +const gulpif = require('gulp-if') const debug = process.env.NODE_ENV !== 'production'; - gulp.task('app-js', function () { - let stream = browserify({ + return browserify({ entries: './assets/src/js/script.js', debug: debug, ignoreMissing: true, @@ -29,12 +29,9 @@ gulp.task('app-js', function () { }) .bundle() .pipe(source('script.js')) - - if(!debug) { - stream.pipe(buffer()).pipe(uglify()) - } - - return stream.pipe(gulp.dest(`./assets/build/js`)) + .pipe(buffer()) + .pipe(gulpif(!debug, uglify())) + .pipe(gulp.dest(`./assets/build/js`)) }); gulp.task('tracker-js', function () { @@ -42,7 +39,7 @@ gulp.task('tracker-js', function () { .pipe(babel({ presets: ["@babel/preset-env"], })) - .pipe(uglify()) + .pipe(gulpif(!debug, uglify())) .pipe(gulp.dest('./assets/build/js')); }); @@ -64,20 +61,17 @@ gulp.task('html', function() { .pipe(gulp.dest(`./assets/build/`)) }); -gulp.task('sass', function () { - var files = './assets/src/sass/[^_]*.scss'; - return gulp.src(files) - .pipe(sass()) - .on('error', gutil.log) - .pipe(rename({ extname: '.css' })) +gulp.task('css', function () { + return gulp.src('./assets/src/css/*.css') + .pipe(concat('styles.css')) .pipe(gulp.dest(`./assets/build/css`)) }); -gulp.task('default', gulp.series('app-js', 'tracker-js', 'sass', 'html', 'img', 'fonts' ) ); +gulp.task('default', gulp.series('app-js', 'tracker-js', 'css', 'html', 'img', 'fonts' ) ); gulp.task('watch', gulp.series('default', function() { gulp.watch(['./assets/src/js/**/*.js'], gulp.parallel('app-js', 'tracker-js') ); - gulp.watch(['./assets/src/sass/**/**/*.scss'], gulp.parallel( 'sass') ); + gulp.watch(['./assets/src/sass/**/**/*.scss'], gulp.parallel( 'css') ); gulp.watch(['./assets/src/**/*.html'], gulp.parallel( 'html') ); gulp.watch(['./assets/src/img/**/*'], gulp.parallel( 'img') ); gulp.watch(['./assets/src/fonts/**/*'], gulp.parallel( 'fonts') ); diff --git a/package-lock.json b/package-lock.json index 1b3d5d63..efbb908a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2023,6 +2023,23 @@ "typedarray": "^0.0.6" } }, + "concat-with-sourcemaps": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/concat-with-sourcemaps/-/concat-with-sourcemaps-1.1.0.tgz", + "integrity": "sha512-4gEjHJFT9e+2W/77h/DS5SGUgwDaOwprX8L/gl5+3ixnzkVJJsZWDSelmN3Oilw3LNDZjZV0yqH1hLG3k6nghg==", + "dev": true, + "requires": { + "source-map": "^0.6.1" + }, + "dependencies": { + "source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "dev": true + } + } + }, "console-browserify": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz", @@ -3143,6 +3160,12 @@ "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=", "dev": true }, + "fork-stream": { + "version": "0.0.4", + "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz", + "integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA=", + "dev": true + }, "form-data": { "version": "2.1.4", "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz", @@ -4113,53 +4136,28 @@ } } }, - "gulp-rename": { - "version": "1.2.2", - "resolved": "https://registry.npmjs.org/gulp-rename/-/gulp-rename-1.2.2.tgz", - "integrity": "sha1-OtRCh2PwXidk3sHGfYaNsnVoeBc=", - "dev": true - }, - "gulp-sass": { - "version": "4.0.1", - "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-4.0.1.tgz", - "integrity": "sha512-OMQEgWNggpog8Tc5v1MuI6eo+5iiPkVeLL76iBhDoEEScLUPfZlpvzmgTnLkpcqdrNodZxpz5qcv6mS2rulk3g==", + "gulp-concat": { + "version": "2.6.1", + "resolved": "https://registry.npmjs.org/gulp-concat/-/gulp-concat-2.6.1.tgz", + "integrity": "sha1-Yz0WyV2IUEYorQJmVmPO5aR5M1M=", "dev": true, "requires": { - "chalk": "^2.3.0", - "lodash.clonedeep": "^4.3.2", - "node-sass": "^4.8.3", - "plugin-error": "^1.0.1", - "replace-ext": "^1.0.0", - "strip-ansi": "^4.0.0", + "concat-with-sourcemaps": "^1.0.0", "through2": "^2.0.0", - "vinyl-sourcemaps-apply": "^0.2.0" + "vinyl": "^2.0.0" }, "dependencies": { - "ansi-regex": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz", - "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=", + "clone": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz", + "integrity": "sha1-G39Ln1kfHo+DZwQBYANFoCiHQ18=", "dev": true }, - "ansi-styles": { - "version": "3.2.1", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz", - "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==", - "dev": true, - "requires": { - "color-convert": "^1.9.0" - } - }, - "chalk": { - "version": "2.4.0", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.0.tgz", - "integrity": "sha512-Wr/w0f4o9LuE7K53cD0qmbAMM+2XNLzR29vFn5hqko4sxGlUsyy363NvmyGIyk5tpe9cjTr9SJYbysEyPkRnFw==", - "dev": true, - "requires": { - "ansi-styles": "^3.2.1", - "escape-string-regexp": "^1.0.5", - "supports-color": "^5.3.0" - } + "clone-stats": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz", + "integrity": "sha1-s3gt/4u1R04Yuba/D9/ngvh3doA=", + "dev": true }, "replace-ext": { "version": "1.0.0", @@ -4167,26 +4165,48 @@ "integrity": "sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs=", "dev": true }, - "strip-ansi": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz", - "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=", - "dev": true, - "requires": { - "ansi-regex": "^3.0.0" - } - }, - "supports-color": { - "version": "5.4.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.4.0.tgz", - "integrity": "sha512-zjaXglF5nnWpsq470jSv6P9DwPvgLkuapYmfDm3JWOm0vkNTVF2tI4UrN2r6jH1qM/uc/WtxYY1hYoA2dOKj5w==", + "vinyl": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.2.0.tgz", + "integrity": "sha512-MBH+yP0kC/GQ5GwBqrTPTzEfiiLjta7hTtvQtbxBgTeSXsmKQRQecjibMbxIXzVT3Y9KJK+drOz1/k+vsu8Nkg==", "dev": true, "requires": { - "has-flag": "^3.0.0" + "clone": "^2.1.1", + "clone-buffer": "^1.0.0", + "clone-stats": "^1.0.0", + "cloneable-readable": "^1.0.0", + "remove-trailing-separator": "^1.0.1", + "replace-ext": "^1.0.0" } } } }, + "gulp-if": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz", + "integrity": "sha1-pJe351cwBQQcqivIt92jyARE1ik=", + "dev": true, + "requires": { + "gulp-match": "^1.0.3", + "ternary-stream": "^2.0.1", + "through2": "^2.0.1" + } + }, + "gulp-match": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz", + "integrity": "sha1-kcfA1/Kb7NZgbVfYCn+Hdqh6uo4=", + "dev": true, + "requires": { + "minimatch": "^3.0.3" + } + }, + "gulp-rename": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/gulp-rename/-/gulp-rename-1.2.2.tgz", + "integrity": "sha1-OtRCh2PwXidk3sHGfYaNsnVoeBc=", + "dev": true + }, "gulp-uglify": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/gulp-uglify/-/gulp-uglify-3.0.0.tgz", @@ -5347,6 +5367,15 @@ } } }, + "merge-stream": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz", + "integrity": "sha1-QEEgLVCKNCugAXQAjfDCUbjBNeE=", + "dev": true, + "requires": { + "readable-stream": "^2.0.1" + } + }, "micromatch": { "version": "3.1.10", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.10.tgz", @@ -7065,6 +7094,18 @@ } } }, + "ternary-stream": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-2.0.1.tgz", + "integrity": "sha1-Bk5Im0tb9gumpre8fy9cJ07Pgmk=", + "dev": true, + "requires": { + "duplexify": "^3.5.0", + "fork-stream": "^0.0.4", + "merge-stream": "^1.0.0", + "through2": "^2.0.1" + } + }, "through": { "version": "2.3.8", "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz", diff --git a/package.json b/package.json index c48b937a..3b200236 100644 --- a/package.json +++ b/package.json @@ -14,8 +14,9 @@ "gulp": "^4.0.0", "gulp-babel": "^8.0.0", "gulp-cache-bust": "^1.4.0", + "gulp-concat": "^2.6.1", + "gulp-if": "^2.0.2", "gulp-rename": "^1.2.2", - "gulp-sass": "^4.0.1", "gulp-uglify": "^3.0.0", "gulp-util": "^3.0.7", "node-sass": "^4.9.0",