From 14403aa1f864df81e2736398920cdc9e51c87398 Mon Sep 17 00:00:00 2001 From: Nathanael Sensfelder Date: Mon, 25 May 2020 19:01:17 +0200 Subject: Added a way to set default values for a single collection. --- src/css/src/shared/additive-css.scss | 82 +++++++++++++----------------------- 1 file changed, 29 insertions(+), 53 deletions(-) (limited to 'src') diff --git a/src/css/src/shared/additive-css.scss b/src/css/src/shared/additive-css.scss index 96ba797..de7a8e2 100644 --- a/src/css/src/shared/additive-css.scss +++ b/src/css/src/shared/additive-css.scss @@ -195,68 +195,44 @@ $var-prefix: additive; } } -@mixin define-all-neutral-values () +@mixin define-neutral-values-for-collection ($collection) { - :root + @if (not map-has-key($collections, $collection)) { - @each $collection, $env in $collections - { - $collections: + @error "Using undefined collection #{$collection}."; + } + $collection-state: map-get($collections, $collection); + $collections: + map-merge( + $collections, + ( + $collection: map-merge( - $collections, + $collection-state, ( - $collection: - map-merge( - $env, - ( - "has_been_used": true - ) - ) + "has_been_used": true ) ) - !global; - @each $property in map-get($env, "properties") - { - $default-value: map-get($properties, $property); - @for $i from 0 to map-get($env, "instances") - { - #{variable_name($collection, $property, $i)}: $default-value; - } - } + ) + ) + !global; + @each $property in map-get($collection-state, "properties") + { + $default-value: map-get($properties, $property); + @for $i from 0 to map-get($collection-state, "instances") + { + #{variable_name($collection, $property, $i)}: $default-value; } } } -/* Each "collection" is used to count the number of variables to create */ -@include new-collection("char-effect"); -@include new-collection("tile-effect"); - -/* This simply defines the default value for the property, a value that must not have any effect. */ -@include new-property("transform", none); - -/* We add the attribute to the collection, so that the default values are properly initialized later on, according to the number of variables the collection needs. */ -@include add-property-to-collection("char-effect", "transform"); -@include add-property-to-collection("tile-effect", "transform"); - -/* And now we define the effects: */ -.char-icon.scale-up -{ - @include set-property("char-effect", "transform", scale(1.5)); -} -.char-icon.rotate -{ - @include set-property("char-effect", "transform", rotate(1.5turn)); -} -.char-icon.translate -{ - @include set-property("char-effect", "transform", translatex(1.5em)); -} - -/* Then we define the actual class that applies the effects, indicating we want a comma to separate the values: */ -.char-icon.use-effects +@mixin define-all-neutral-values () { - @include use-collection("char-effect"); + :root + { + @each $collection in map-keys($collections) + { + @include define-neutral-values-for-collection($collection); + } + } } - -/* We also need to define the default values, in case some of the effects are not being used: */ -@include define-all-neutral-values(); -- cgit v1.2.3-70-g09d2