Colorway additions and management (additions of GMK Nautilus and SA J…

…ukebox) (qmk#4) * Add GMK Nautilus colorway (includes SCSS file for Pantone color codes) GMK Nautilus used Pantone codes for some of its colors. I know other sets have as well, so those color codes will need to go in pantone.scss. * Add SA Jukebox colorway * Add capitalization rules for SA and DSA keysets Some forward planning... * Add colorway profile prefixes * Sort colorways by profile and name Grouped the sets by profile - SA, GMK, then DSA. Each profile's colorways are sorted by name alphabetically. * Disable DSA Drifter per mechmerlin Can re-enable if/when we get permission.
mattpcaswell · Feb 11, 2019 · dfc1411 · dfc1411
1 parent 8892b4c
commit dfc1411
Show file tree

Hide file tree

Showing 5 changed files with 116 additions and 41 deletions.
diff --git a/configurator/src/components/BaseKey.vue b/configurator/src/components/BaseKey.vue
@@ -203,6 +203,7 @@ export default {
 @import '../scss/gmk-abs';
 @import '../scss/sp-abs';
 @import '../scss/sp-pbt';
+@import '../scss/pantone';
 @import '../scss/colorways';
 
 .key.overme {

diff --git a/configurator/src/components/Main.vue b/configurator/src/components/Main.vue
@@ -72,6 +72,8 @@ export default {
  .map(word => capitalize(word))
  .join(' ')
  .replace(/Gmk/, 'GMK')
+ .replace(/^Sa/, 'SA')
+ .replace(/^Dsa/, 'DSA')
  .replace(/Wob/, 'WOB')
  .replace(/Ta/, 'TA');
  });

diff --git a/configurator/src/components/colorways.js b/configurator/src/components/colorways.js
@@ -1,10 +1,44 @@
 export default {
  list: [
- { name: 'carbon' },
- { name: 'danger-zone' },
- { name: 'drifter' },
+ { name: 'sa-carbon' },
+ { name: 'sa-danger-zone' },
+ {
+ name: 'sa-jukebox',
+ override: {
+ KC_ESC: 'accent',
+ KC_ENT: 'accent'
+ }
+ },
+ { name: 'sa-modern-selectric' },
+ { name: 'sa-nantucket-selectric' },
+ { name: 'sa-oblivion-hagoromo' },
+
  { name: 'gmk-dolch' },
  { name: 'gmk-merlin' },
+ {
+ name: 'gmk-metaverse',
+ override: {
+ KC_ESC: 'accent',
+ KC_ENT: 'accent',
+ KC_F5: 'accent',
+ KC_F6: 'accent',
+ KC_F7: 'accent',
+ KC_F8: 'accent',
+ KC_LGUI: 'accent',
+ KC_RGUI: 'accent',
+ KC_LEFT: 'accent',
+ KC_RGHT: 'accent',
+ KC_DOWN: 'accent',
+ KC_UP: 'accent'
+ }
+ },
+ {
+ name: 'gmk-nautilus',
+ override: {
+ KC_ENT: 'accent',
+ KC_ESC: 'accent'
+ }
+ },
  { name: 'gmk-olivetti' },
  {
  name: 'gmk-olivia',
@@ -27,27 +61,9 @@ export default {
  }
  },
  { name: 'gmk-ta-royal-alpha' },
- { name: 'gmk-wob' },
- {
- name: 'gmk-metaverse',
- override: {
- KC_ESC: 'accent',
- KC_ENT: 'accent',
- KC_F5: 'accent',
- KC_F6: 'accent',
- KC_F7: 'accent',
- KC_F8: 'accent',
- KC_LGUI: 'accent',
- KC_RGUI: 'accent',
- KC_LEFT: 'accent',
- KC_RGHT: 'accent',
- KC_DOWN: 'accent',
- KC_UP: 'accent'
- }
- },
- { name: 'modern-selectric' },
- { name: 'nantucket-selectric' },
- { name: 'oblivion-hagoromo' }
+ { name: 'gmk-wob' }
+ //,
+ //{ name: 'dsa-drifter' }
  ],
  /*
  * List of codes we should use icons for instead of text

diff --git a/configurator/src/scss/colorways.scss b/configurator/src/scss/colorways.scss
@@ -1,88 +1,115 @@
 // Signature Plastics keysets
 
-.danger-zone-key {
+.sa-danger-zone-key {
  background: $color-sp-abs-BFU;
  color: $color-sp-abs-YY;
  input {
  background: lighten($color-sp-abs-BFU, 40%);
  }
 }
-.danger-zone-mod {
+.sa-danger-zone-mod {
  background: $color-sp-abs-GSM;
  color: $color-sp-abs-YY;
  input {
  background: lighten($color-sp-abs-GSM, 40%);
  }
 }
-.danger-zone-kb {
+.sa-danger-zone-kb {
 }
 
-.carbon-key {
+.sa-carbon-key {
  background: $color-sp-abs-WBO;
  color: $color-sp-abs-GQM;
  input {
  background: lighten($color-sp-abs-WBO, 40%);
  }
 }
-.carbon-mod {
+.sa-carbon-mod {
  background: $color-sp-abs-GQM;
  color: $color-sp-abs-OBC;
  input {
  background: lighten($color-sp-abs-GQM, 40%);
  }
 }
 
-.modern-selectric-key {
+.sa-modern-selectric-key {
  background: $color-sp-abs-NN;
  color: $color-sp-abs-WFK;
  input {
  background: lighten($color-sp-abs-NN, 40%);
  }
 }
-.modern-selectric-mod {
+.sa-modern-selectric-mod {
  background: $color-sp-abs-BDH;
  color: $color-sp-abs-WFK;
  input {
  background: lighten($color-sp-abs-BDH, 40%);
  }
 }
-.modern-selectric-kb {
+.sa-modern-selectric-kb {
 }
 
-.nantucket-selectric-key {
+.sa-nantucket-selectric-key {
  background: $color-sp-abs-WV;
  color: $color-sp-abs-BBI;
  input {
  background: lighten($color-sp-abs-WV, 40%);
  }
 }
-.nantucket-selectric-mod {
+.sa-nantucket-selectric-mod {
  background: $color-sp-abs-BBI;
  color: $color-sp-abs-YCF;
  input {
  background: lighten($color-sp-abs-BBI, 40%);
  }
 }
-.nantucket-selectric-kb {
+.sa-nantucket-selectric-kb {
 }
 
-.oblivion-hagoromo-key {
+.sa-oblivion-hagoromo-key {
  background: $color-sp-abs-WFK;
  color: $color-sp-abs-GD;
  input {
  background: lighten($color-sp-abs-WFK, 40%);
  }
 }
-.oblivion-hagoromo-mod {
+.sa-oblivion-hagoromo-mod {
  background: $color-sp-abs-GD;
  color: $color-sp-abs-GAL;
  input {
  background: lighten($color-sp-abs-GD, 40%);
  }
 }
-.oblivion-hagoromo-kb {
+.sa-oblivion-hagoromo-kb {
 }
 
+
+.sa-jukebox-key {
+ background: $color-sp-abs-TM;
+ color: $color-sp-abs-RN;
+ input {
+ background: lighten($color-sp-abs-TM, 40%);
+ color: $color-sp-abs-RN;
+ }
+}
+.sa-jukebox-mod {
+ background: $color-sp-abs-VCO;
+ color: $color-sp-abs-RN;
+ input {
+ background: lighten($color-sp-abs-VCO, 40%);
+ }
+}
+.sa-jukebox-accent {
+ background: $color-sp-abs-RN;
+ color: $color-sp-abs-TM;
+ input {
+ background: lighten($color-sp-abs-RN, 40%);
+ }
+}
+.sa-jukebox-kb {
+}
+
+
 // GMK Keysets
 
 .gmk-merlin-key {
@@ -210,21 +237,48 @@
  // placeholder
 }
 
+
+.gmk-nautilus-key {
+ background: $color-pantone-534C;
+ color: $color-gmk-abs-TU2;
+ input {
+ background: lighten($color-pantone-534C, 40%);
+ }
+}
+.gmk-nautilus-mod {
+ background: $color-pantone-533C;
+ color: $color-gmk-abs-N6;
+ input {
+ background: lighten($color-pantone-533C, 40%);
+ }
+}
+.gmk-nautilus-accent {
+ background: $color-gmk-abs-N6;
+ color: $color-pantone-533C;
+ input {
+ background: lighten($color-gmk-abs-N6, 40%);
+ }
+}
+.gmk-nautilus-kb {
+ // placeholder
+ background: $color-pantone-533C;
+}
+
 // Keyreative
 
-.drifter-key {
+.dsa-drifter-key {
  background: #e5e1e6;
  color: #222222;
  input {
  background: lighten(#e5e1e6, 40%);
  }
 }
-.drifter-mod {
+.dsa-drifter-mod {
  background: #9b2242;
  color: #71dbd4;
  input {
  background: lighten(#9b2242, 40%);
  }
 }
-.drifter-kb {
+.dsa-drifter-kb {
 }
diff --git a/configurator/src/scss/pantone.scss b/configurator/src/scss/pantone.scss
@@ -0,0 +1,2 @@
+$color-pantone-534C: rgb(27,54,93);
+$color-pantone-533C: rgb(31,42,68);