From 2f2716f82b7d4b85be3af5d9c3f707e395e4a171 Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Wed, 19 Oct 2016 20:38:11 +0300 Subject: [PATCH] Module restructure - part 2 --- docs/v2/DEVLOG.md | 6 ++++ flavors/v2/mini-default.scss | 2 +- scss/v2/{_base.scss => _core.scss} | 50 ++---------------------------- scss/v2/mini-core/_contextual.scss | 50 ++++++++++++++++++++++++++++++ 4 files changed, 59 insertions(+), 49 deletions(-) rename scss/v2/{_base.scss => _core.scss} (85%) create mode 100644 scss/v2/mini-core/_contextual.scss diff --git a/docs/v2/DEVLOG.md b/docs/v2/DEVLOG.md index 2b7aed2..9deee74 100644 --- a/docs/v2/DEVLOG.md +++ b/docs/v2/DEVLOG.md @@ -101,3 +101,9 @@ - Added flag for `a` `text-decoration:underline` (`$apply-link-underline`) and checks/optimizations for `font-weight`. - Removed fixes from Normalize about `a` elements, as they were opinionated and unnecessary. - Added flag for `a` using fancy `:hover` and other focused effects instead of `color` (`$apply-link-hover-fade`). +- Opened issue for module restructure (#14). +- Module restructure based on issue #14 (partial for whatever work was already done): + - Renamed `_base.scss` to `_core.scss` and created folder for submodules (`mini-core`). + - Created `_contextual.scss` for `mark` styling. + - Comments and sections for core. +- Changed import in flavor, imported contextual in core. diff --git a/flavors/v2/mini-default.scss b/flavors/v2/mini-default.scss index c2b97af..7e22b48 100644 --- a/flavors/v2/mini-default.scss +++ b/flavors/v2/mini-default.scss @@ -100,7 +100,7 @@ $apply-link-hover-fade: true; // Should the :hover and :focus state // color (`true`/`false`) [8] //$link-hover-fore-color: #0288d1; // Text color for when hovered or focused // Enable base -@import '../../scss/v2/base'; +@import '../../scss/v2/core'; // Use mixins frm base @include make-mark-alt-color($mark-variant1-name, $mark-variant1-back-color); @include make-mark-alt-color($mark-variant2-name, $mark-variant2-back-color); diff --git a/scss/v2/_base.scss b/scss/v2/_core.scss similarity index 85% rename from scss/v2/_base.scss rename to scss/v2/_core.scss index e1a8e69..993df88 100644 --- a/scss/v2/_base.scss +++ b/scss/v2/_core.scss @@ -314,54 +314,8 @@ a{ //=================================================== // SECTION: External files. //=================================================== -// Default styling for mark. Use mixins for alternate styles. -mark { - background: $mark-back-color; - color: $mark-fore-color; -@if $mark-font-size != 100% { - font-size: $mark-font-size; -} -@if $mark-line-height != $base-line-height { - line-height: $mark-line-height; -} -@if $mark-padding != 0 { - padding: $mark-padding; -} -@if $mark-margin != 0 { - margin: $mark-margin; -} -} -// Mixin for alternate mark (contextual color variants). -// Variables: -// - $mark-alt-name : The name of the class used for the alternate mark. -// - $mark-alt-back-color : The background color of the alternate mark. -// - $mark-alt-fore-color : (Optional) The text color of the alternate mark. Defaults to the text color of the mark. -@mixin make-mark-alt-color ($mark-alt-name, $mark-alt-back-color, $mark-alt-fore-color: $mark-fore-color) { -mark.#{$mark-alt-name} { -@if $mark-alt-back-color != $mark-back-color { - background: $mark-alt-back-color; -} -@if $mark-alt-fore-color != $mark-fore-color { - color: $mark-alt-fore-color; -} -} -} -// Mixin for alternative mark styles (contextual tags). -// Variables: -// - $mark-alt-name : The name of the class used for the alternate mark style. -// - $mark-alt-border-radius : The border-radius of the alternate mark style. -// - $mark-alt-padding : (Optional) The padding of the alternate mark style. Defaults to the padding of the mark. -@mixin make-mark-alt-style ($mark-alt-name, $mark-alt-border-radius, $mark-alt-padding: $mark-padding) { -mark.#{$mark-alt-name} { - display: inline-block; -@if $mark-alt-border-radius != 0 { - border-radius: $mark-alt-border-radius; -} -@if $mark-alt-padding != $mark-padding { - padding: $mark-alt-padding; -} -} -} +// Contextual background elements. +@import 'mini-core/contextual'; diff --git a/scss/v2/mini-core/_contextual.scss b/scss/v2/mini-core/_contextual.scss new file mode 100644 index 0000000..4e6a465 --- /dev/null +++ b/scss/v2/mini-core/_contextual.scss @@ -0,0 +1,50 @@ +// Definitions for contextual background elements. +// Contextual background elements use the mark element as their base. +// Default styling for mark. Use mixins for alternate styles. +mark { + background: $mark-back-color; + color: $mark-fore-color; +@if $mark-font-size != 100% { + font-size: $mark-font-size; +} +@if $mark-line-height != $base-line-height { + line-height: $mark-line-height; +} +@if $mark-padding != 0 { + padding: $mark-padding; +} +@if $mark-margin != 0 { + margin: $mark-margin; +} +} +// Mixin for alternate mark (contextual color variants). +// Variables: +// - $mark-alt-name : The name of the class used for the alternate mark. +// - $mark-alt-back-color : The background color of the alternate mark. +// - $mark-alt-fore-color : (Optional) The text color of the alternate mark. Defaults to the text color of the mark. +@mixin make-mark-alt-color ($mark-alt-name, $mark-alt-back-color, $mark-alt-fore-color: $mark-fore-color) { +mark.#{$mark-alt-name} { +@if $mark-alt-back-color != $mark-back-color { + background: $mark-alt-back-color; +} +@if $mark-alt-fore-color != $mark-fore-color { + color: $mark-alt-fore-color; +} +} +} +// Mixin for alternative mark styles (contextual tags). +// Variables: +// - $mark-alt-name : The name of the class used for the alternate mark style. +// - $mark-alt-border-radius : The border-radius of the alternate mark style. +// - $mark-alt-padding : (Optional) The padding of the alternate mark style. Defaults to the padding of the mark. +@mixin make-mark-alt-style ($mark-alt-name, $mark-alt-border-radius, $mark-alt-padding: $mark-padding) { +mark.#{$mark-alt-name} { + display: inline-block; +@if $mark-alt-border-radius != 0 { + border-radius: $mark-alt-border-radius; +} +@if $mark-alt-padding != $mark-padding { + padding: $mark-alt-padding; +} +} +} \ No newline at end of file