Merge branch 'release/2.0.0'

getgrav · Apr 11, 2019 · a4de997 · a4de997
2 parents 3b33407 + d54e1fa
commit a4de997
Show file tree

Hide file tree

Showing 35 changed files with 1,213 additions and 381 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,17 @@
+# v2.0.0
+## 04/11/2019
+
+1. [](#improved)
+ * Updated to use new `GRAV` core language prefix
+ * Updated [Spectre.css](https://picturepan2.github.io/spectre/) to latest `0.5.8` version
+ * Support for 2FA panel styling
+ * Updated to Yarn 4.0 syntax
+ * Restructured SCSS to ensure easier Spectre updates in future
+1. [](#bugfix)
+ * Some checkboxes fixes for Forms 3.0
+ * More Twig 2.0 compatibility fixes
+ * Fixed a Twig 2.0 issue with assets rendering
+
 # v1.2.6
 ## 03/21/2019
 
@@ -11,7 +25,7 @@
 1. [](#improved)
  * Updated [Spectre.css](https://picturepan2.github.io/spectre/) to latest `0.5.7` version
 1. [](#bugfix)
- * Fixed missing `</html>` close tag in bae template [#76](https://github.com/getgrav/grav-theme-quark/pull/)
+ * Fixed missing `</html>` close tag in bae template [#76](https://github.com/getgrav/grav-theme-quark/pull/) 
 
 # v1.2.4
 ## 11/12/2018
@@ -26,6 +40,7 @@
  * Fixed `continue_link:` showing up as toggled [#65](https://github.com/getgrav/grav-theme-quark/issues/65)
  * Fixed issue with modular pages not hidden in on-page menu with `visible: false` [#71](https://github.com/getgrav/grav-theme-quark/issues/71)
 
+
 # v1.2.3
 ## 11/05/2018
 

diff --git a/blueprints.yaml b/blueprints.yaml
@@ -1,5 +1,5 @@
 name: Quark
-version: 1.2.6
+version: 2.0.0
 description: New Grav Default Theme
 icon: microchip
 author:
@@ -13,7 +13,7 @@ bugs: https://github.com/getgrav/grav-theme-quark/issues
 license: MIT
 
 dependencies:
-  - { name: grav, version: '>=1.5.10' }
+ - { name: grav, version: '>=1.6.0' }
 
 form:
  validation: loose

diff --git a/css-compiled/spectre-exp.css b/css-compiled/spectre-exp.css
diff --git a/css-compiled/spectre-exp.min.css b/css-compiled/spectre-exp.min.css
diff --git a/css-compiled/spectre-icons.css b/css-compiled/spectre-icons.css
diff --git a/css-compiled/spectre-icons.min.css b/css-compiled/spectre-icons.min.css
diff --git a/css-compiled/spectre.css b/css-compiled/spectre.css
diff --git a/css-compiled/spectre.min.css b/css-compiled/spectre.min.css
diff --git a/css-compiled/theme.css b/css-compiled/theme.css
diff --git a/css-compiled/theme.min.css b/css-compiled/theme.min.css
diff --git a/gulpfile.js b/gulpfile.js
@@ -15,25 +15,29 @@ var paths = {
  source: src_dir
 };
 
-gulp.task('watch', function() {
- gulp.watch(watch_dir, ['build']);
-});
+function watch() {
+ return gulp.watch(watch_dir, build);
+}
 
-gulp.task('build', function() {
- gulp.src(paths.source)
- .pipe(sourcemaps.init())
- .pipe(sass({outputStyle: 'compact', precision: 10})
- .on('error', sass.logError)
- )
- .pipe(sourcemaps.write())
- .pipe(autoprefixer()) 
- .pipe(gulp.dest(dest_dir))
- .pipe(csscomb())
- .pipe(cleancss())
- .pipe(rename({
- suffix: '.min'
- }))
- .pipe(gulp.dest(dest_dir));
-});
+function build() {
+ return gulp.src(paths.source)
+ .pipe(sourcemaps.init())
+ .pipe(sass({
+ outputStyle: 'compact',
+ precision: 10
+ }).on('error', sass.logError)
+ )
+ .pipe(sourcemaps.write())
+ .pipe(autoprefixer())
+ .pipe(gulp.dest(dest_dir))
+ .pipe(csscomb())
+ .pipe(cleancss())
+ .pipe(rename({
+ suffix: '.min'
+ }))
+ .pipe(gulp.dest(dest_dir));
+}
 
-gulp.task('default', ['build']);
+exports.watch = watch;
+exports.build = build;
+exports.default = build;
diff --git a/images/favicon.png b/images/favicon.png
diff --git a/package.json b/package.json
@@ -24,7 +24,7 @@
  "url": "https://github.com/picturepan2/spectre/issues"
  },
  "devDependencies": {
- "gulp": "latest",
+ "gulp": "^4.0.0",
  "gulp-autoprefixer": "latest",
  "gulp-clean-css": "^3.9.4",
  "gulp-csscomb": "^3.0.8",

diff --git a/scss/spectre-exp.scss b/scss/spectre-exp.scss
@@ -1,4 +1,5 @@
 // Variables and mixins
+@import "theme/variables";
 @import "spectre/variables";
 @import "spectre/mixins";
 

diff --git a/scss/spectre-icons.scss b/scss/spectre-icons.scss
@@ -1,4 +1,5 @@
 // Variables and mixins
+@import "theme/variables";
 @import "spectre/variables";
 @import "spectre/mixins";
 

diff --git a/scss/spectre.scss b/scss/spectre.scss
@@ -1,4 +1,5 @@
 // Variables and mixins
+@import "theme/variables";
 @import "spectre/variables";
 @import "spectre/mixins";
 
@@ -19,6 +20,7 @@
 
 // Layout
 @import "spectre/layout";
+@import "spectre/hero";
 @import "spectre/navbar";
 
 // Components

diff --git a/scss/spectre/_forms.scss b/scss/spectre/_forms.scss
@@ -203,7 +203,7 @@ textarea.form-input {
  display: block;
  line-height: $line-height;
  margin: ($control-size - $control-size-sm) / 2 0;
- min-height: 1.2rem;
+ min-height: $control-size-sm;
  padding: (($control-size-sm - $line-height) / 2) $control-padding-x (($control-size-sm - $line-height) / 2) ($control-icon-size + $control-padding-x);
  position: relative;
 

diff --git a/scss/spectre/_layout.scss b/scss/spectre/_layout.scss
@@ -76,7 +76,8 @@
  &.col-4,
  &.col-3,
  &.col-2,
- &.col-1 {
+ &.col-1,
+ &.col-auto {
  flex: none;
  }
 }
@@ -143,7 +144,8 @@
  .col-xl-4,
  .col-xl-3,
  .col-xl-2,
- .col-xl-1 {
+ .col-xl-1,
+ .col-xl-auto {
  flex: none;
  }
  .col-xl-12 {
@@ -182,6 +184,9 @@
  .col-xl-1 {
  width: 8.33333333%;
  }
+ .col-xl-auto {
+ width: auto;
+ }
  .hide-xl {
  display: none !important;
  }
@@ -201,7 +206,8 @@
  .col-lg-4,
  .col-lg-3,
  .col-lg-2,
- .col-lg-1 {
+ .col-lg-1,
+ .col-lg-auto {
  flex: none;
  }
  .col-lg-12 {
@@ -240,6 +246,9 @@
  .col-lg-1 {
  width: 8.33333333%;
  }
+ .col-lg-auto {
+ width: auto;
+ }
  .hide-lg {
  display: none !important;
  }
@@ -259,7 +268,8 @@
  .col-md-4,
  .col-md-3,
  .col-md-2,
- .col-md-1 {
+ .col-md-1,
+ .col-md-auto {
  flex: none;
  }
  .col-md-12 {
@@ -298,6 +308,9 @@
  .col-md-1 {
  width: 8.33333333%;
  }
+ .col-md-auto {
+ width: auto;
+ }
  .hide-md {
  display: none !important;
  }
@@ -317,7 +330,8 @@
  .col-sm-4,
  .col-sm-3,
  .col-sm-2,
- .col-sm-1 {
+ .col-sm-1,
+ .col-sm-auto {
  flex: none;
  }
  .col-sm-12 {
@@ -356,6 +370,9 @@
  .col-sm-1 {
  width: 8.33333333%;
  }
+ .col-sm-auto {
+ width: auto;
+ }
  .hide-sm {
  display: none !important;
  }
@@ -375,7 +392,8 @@
  .col-xs-4,
  .col-xs-3,
  .col-xs-2,
- .col-xs-1 {
+ .col-xs-1,
+ .col-xs-auto {
  flex: none;
  }
  .col-xs-12 {
@@ -414,6 +432,9 @@
  .col-xs-1 {
  width: 8.33333333%;
  }
+ .col-xs-auto {
+ width: auto;
+ }
  .hide-xs {
  display: none !important;
  }

diff --git a/scss/spectre/_menus.scss b/scss/spectre/_menus.scss
@@ -18,8 +18,8 @@
  .menu-item {
  margin-top: 0;
  padding: 0 $unit-2;
+ position: relative;
  text-decoration: none;
- user-select: none;
 
  & > a {
  border-radius: $border-radius;
@@ -52,11 +52,15 @@
  }
 
  .menu-badge {
- float: right;
- padding: $unit-1 0;
+ align-items: center;
+ display: flex;
+ height: 100%;
+ position: absolute;
+ right: 0;
+ top: 0;
 
- .btn {
- margin-top: -$unit-h;
+ .label {
+ margin-right: $unit-2;
  }
  }
-}
+}
diff --git a/scss/spectre/_variables.scss b/scss/spectre/_variables.scss
@@ -1,27 +1,28 @@
 // Core variables
-$version: "0.5.7";
+$version: "0.5.8";
 
 // Core features
 $rtl: false !default;
 
 // Core colors
-$primary-color: #3085EE !default;
+$primary-color: #5755d9 !default;
 $primary-color-dark: darken($primary-color, 3%) !default;
 $primary-color-light: lighten($primary-color, 3%) !default;
 $secondary-color: lighten($primary-color, 37.5%) !default;
 $secondary-color-dark: darken($secondary-color, 3%) !default;
 $secondary-color-light: lighten($secondary-color, 3%) !default;
 
 // Gray colors
-$dark-color: #454d5d !default;
+$dark-color: #303742 !default;
 $light-color: #fff !default;
-$gray-color: lighten($dark-color, 40%) !default;
-$gray-color-dark: darken($gray-color, 25%) !default;
+$gray-color: lighten($dark-color, 55%) !default;
+$gray-color-dark: darken($gray-color, 30%) !default;
 $gray-color-light: lighten($gray-color, 20%) !default;
 
-$border-color: lighten($dark-color, 60%) !default;
+$border-color: lighten($dark-color, 65%) !default;
 $border-color-dark: darken($border-color, 10%) !default;
-$bg-color: lighten($dark-color, 66%) !default;
+$border-color-light: lighten($border-color, 8%) !default;
+$bg-color: lighten($dark-color, 75%) !default;
 $bg-color-dark: darken($bg-color, 3%) !default;
 $bg-color-light: $light-color !default;
 

diff --git a/scss/spectre/_viewer-360.scss b/scss/spectre/_viewer-360.scss
@@ -1,19 +1,21 @@
 // 360 Degree Viewer
-// The number of images 
-$image-height: 9rem;
-$image-number: 36 !default;
-$image-width: 24rem;
 
-.viewer-360 {
- align-items: center;
- display: flex;
- flex-direction: column;
-
+// Mixin: Viewer slider sizes
+@mixin viewer-slider-size($image-number: 36) {
  @for $s from 1 through ($image-number) {
- .viewer-slider[value='#{$s}'] + .viewer-image {
+ .viewer-slider[max='#{$image-number}'][value='#{$s}'] + .viewer-image {
  background-position-y: percentage((($s)-1) * 1/(($image-number)-1));
  }
  }
+}
+
+.viewer-360 {
+ align-items: center;
+ display: flex;
+ flex-direction: column;
+
+ // Copy and add more numbers if you need
+ @include viewer-slider-size(36);
 
  .viewer-slider {
  cursor: ew-resize;
@@ -26,8 +28,7 @@ $image-width: 24rem;
  background-position-y: 0;
  background-repeat: no-repeat;
  background-size: 100%;
- height: $image-height;
+ max-width: 100%;
  order: 1;
- width: $image-width;
  }
-}
+}
diff --git a/scss/spectre/mixins/_label.scss b/scss/spectre/mixins/_label.scss
@@ -1,7 +1,7 @@
 // Label base style
 @mixin label-base() {
  border-radius: $border-radius;
- line-height: 1.2;
+ line-height: 1.25;
  padding: .1rem .2rem;
 }
 

diff --git a/scss/spectre/spectre-exp.scss b/scss/spectre/spectre-exp.scss
@@ -0,0 +1,18 @@
+// Variables and mixins
+@import "variables";
+@import "mixins";
+
+/*! Spectre.css Experimentals v#{$version} | MIT License | github.com/picturepan2/spectre */
+// Experimentals
+@import "autocomplete";
+@import "calendars";
+@import "carousels";
+@import "comparison-sliders";
+@import "filters";
+@import "meters";
+@import "off-canvas";
+@import "parallax";
+@import "progress";
+@import "sliders";
+@import "timelines";
+@import "viewer-360";