Stronger iconkitchen banner

yxlolxy · Nov 22, 2022 · 827eb37 · 827eb37
1 parent 24d8e4f
commit 827eb37
Show file tree

Hide file tree

Showing 7 changed files with 18,561 additions and 729 deletions.
diff --git a/app/_generator-base.html b/app/_generator-base.html
@@ -1,6 +1,7 @@
 {% extends '_base.html' %}
 
 {% block body %}
+{% block banner %}{% endblock %}
 <header class="page-header">
   <a class="page-header-back-button icon-button theme-dark" href="index.html">
     <i class="material-icons">arrow_back</i>
@@ -33,5 +34,4 @@ <h1 class="page-header-title">{{ title }}</h1>
   </div>
   {% endblock %}
 </div>
-{% block banner %}{% endblock %}
 {% endblock %}
diff --git a/app/components/page-header.scss b/app/components/page-header.scss
@@ -38,7 +38,7 @@
   justify-content: center;
   padding: 16px 0;
   box-shadow: material-shadow(4);
-  background-color: $colorAccent;
+  background-color: material-color('red', '700');
   color: $colorWhitePrimary;
   font-weight: 500;
   z-index: 4;

diff --git a/app/pages/home/home.scss b/app/pages/home/home.scss
@@ -1,3 +1,5 @@
+@use 'sass:math';
+
 $homeCardWidth: 296px;
 $homeCardGutter: 24px;
 $homeHeaderOverlap: 48px;
@@ -106,7 +108,7 @@ body.page-home {
 
     .generator-image {
       width: $homeCardWidth;
-      height: $homeCardWidth / 1.48;
+      height: math.div($homeCardWidth, 1.48);
       color: $colorAccent;
     }
 

diff --git a/app/pages/launcher-icon-generator.html b/app/pages/launcher-icon-generator.html
@@ -8,11 +8,10 @@
 
 {% block banner %}
 <div class="page-header-banner">
-  <i class="material-icons">new_releases</i>
+  <i class="material-icons">error</i>
   <span>
-    <a href="https://icon.kitchen">Try IconKitchen</a>, the successor to the
-    Android Asset Studio, and a great new way to make highly customizable
-    app icons for Android, iOS, and the web.
+    This page is no longer maintained. <a href="https://icon.kitchen">Switch to IconKitchen</a>, the successor to the
+    Android Asset Studio.
   </span>
 </div>
 {% endblock %}

diff --git a/gulpfile.babel.js b/gulpfile.babel.js
@@ -24,6 +24,7 @@ const path = require('path');
 const workboxBuild = require('workbox-build');
 const prettyBytes = require('pretty-bytes');
 const webpack = require('webpack');
+const sass = require('gulp-sass')(require('sass'));
 
 const AUTOPREFIXER_BROWSERS = [
   'ff >= 30',
@@ -93,7 +94,7 @@ gulp.task('styles', () => {
   return gulp.src('app/app.entry.scss')
     .pipe($.changed('styles', {extension: '.scss'}))
     .pipe($.sassGlob())
-    .pipe($.sass({
+    .pipe(sass({
       style: 'expanded',
       precision: 10,
       quiet: true