@iris.interactive/handcook 2.10.26 → 2.10.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/README.md +1 -1
  2. package/package.json +1 -1
  3. package/public/styles/scss/_variables.scss +16 -1
  4. package/public/styles/scss/mixins/_mixin-style.scss +3 -1
package/README.md CHANGED
@@ -1,5 +1,5 @@
1
1
  # Welcome to HandCook 👨‍🍳
2
- ![Version](https://img.shields.io/badge/version-2.10.26-blue.svg?cacheSeconds=2592000)
2
+ ![Version](https://img.shields.io/badge/version-2.10.28-blue.svg?cacheSeconds=2592000)
3
3
  ![Prerequisite](https://img.shields.io/badge/node-%3E%3D%2012.14.0-blue.svg)
4
4
  [![License: UNLICENSED](https://img.shields.io/badge/License-UNLICENSED-yellow.svg)](#)
5
5
  [![Twitter: captain\_iris](https://img.shields.io/twitter/follow/captain\_iris.svg?style=social)](https://twitter.com/captain\_iris)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@iris.interactive/handcook",
3
- "version": "2.10.26",
3
+ "version": "2.10.28",
4
4
  "description": "The web cooking by IRIS Interactive",
5
5
  "main": "./public/scripts/index.js",
6
6
  "scripts": {
package/public/styles/scss/_variables.scss CHANGED
@@ -238,6 +238,19 @@ $h6-color: var(--iris--h6--color);
238
238
  $h6-text-align: var(--iris--h6--text-align);
239
239
  $h6-text-transform: var(--iris--h6--text-transform);
240
240
 
241
+ //Over-title
242
+ $over-title-font-family: var(--iris--over-title--font-family, $font-family);
243
+ $over-title-font-weight: var(--iris--over-title--font-weight, 400);
244
+ $over-title-font-size: var(--iris--over-title--font-size, $font-size);
245
+ $over-title-font-size--rem: var(--iris--over-title--font-size--rem, $font-size--rem);
246
+ $over-title-font-size-medium: var(--iris--over-title--font-size--medium, $font-size);
247
+ $over-title-font-size-medium--rem: var(--iris--over-title--font-size--medium--rem, $font-size--rem);
248
+ $over-title-font-size-small: var(--iris--over-title--font-size--small, $font-size);
249
+ $over-title-font-size-small--rem: var(--iris--over-title--font-size--small--rem, $font-size--rem);
250
+ $over-title-color: var(--iris--over-title--color, $color);
251
+ $over-title-text-align: var(--iris--over-title--text-align, left);
252
+ $over-title-text-transform: var(--iris--over-title--text-transform, none);
253
+
241
254
  /* Appearance
242
255
  / ================================================== */
243
256
  $appearance-color: var(--iris--appearance--color, var(--iris--global--color));
@@ -314,7 +327,9 @@ $button-background-color: var(--iris--button--background-color);
314
327
  $button-color-hover: var(--iris--button--color-hover);
315
328
  $button-background-color-hover: var(--iris--button--background-color-hover, none);
316
329
  $button-background-image: var(--iris--button--background-image, none);
317
- $button-gradient-background-image-size: var(--iris--global--gradient-background-size, (200% 100%));
330
+ $button-gradient-background-image-size: var(--iris--button--background-size, var(--iris--global--gradient-background-size, (200% 100%))); //This
331
+ $button-gradient-background-image-position: var(--iris--button--background-position, initial); //This
332
+ $button-gradient-background-image-position-hover: var(--iris--button--background-position-hover, (bottom right, top right)); //This
318
333
  $button-border: var(--iris--button--border, none);
319
334
  $button-border-hover: var(--iris--button--border-hover, none);
320
335
  $button-background-color--force: var(--iris--button--border-color, $button-background-color);
package/public/styles/scss/mixins/_mixin-style.scss CHANGED
@@ -153,6 +153,7 @@
153
153
  background-color: $button-background-color;
154
154
  background-image: $button-background-image;
155
155
  background-size: $button-gradient-background-image-size;
156
+ background-position: $button-gradient-background-image-position;
156
157
  border: $button-border;
157
158
  word-break: normal;
158
159
  @include transition;
@@ -176,6 +177,7 @@
176
177
  background-color: $button-background-color;
177
178
  background-image: $button-background-image;
178
179
  background-size: $button-gradient-background-image-size;
180
+ background-position: $button-gradient-background-image-position;
179
181
  border: $button-border;
180
182
  }
181
183
 
@@ -183,7 +185,7 @@
183
185
  color: $button-color-hover;
184
186
  background-color: $button-background-color-hover;
185
187
  border: $button-border-hover;
186
- background-position: bottom right, top right;
188
+ background-position: $button-gradient-background-image-position-hover;
187
189
 
188
190
  &:before {
189
191
  color: $button-color-hover;