Skip to content
This repository has been archived by the owner on Aug 16, 2023. It is now read-only.

Commit

Permalink
Добавил функцию color-common (#15)
Browse files Browse the repository at this point in the history
Функция `color-common` позволяет проще получать цвета из цветовых палитр из Common.

> Функция требует рефакторинга, но в будущем интерфейс
> функции не будет изменён. Так что пользоваться можно.

close #12
  • Loading branch information
therteenten committed May 23, 2023
2 parents 3269e23 + 8df94a9 commit fa34439
Show file tree
Hide file tree
Showing 9 changed files with 159 additions and 997 deletions.
2 changes: 1 addition & 1 deletion .gitignore
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@

test.*
sassdoc/
docs/

Expand Down
5 changes: 5 additions & 0 deletions _test.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
@use 'index.scss' as * with (
$setting--strict-mode: false
);


7 changes: 7 additions & 0 deletions config/_valid-values.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,10 @@
/// @name vvalues--color-common
/// @group Valid Values
/// @since 8.0.0
/// @access public
/// @type list
$vvalues--color-common: 'ios' 'ios-dark' 'iosd' 'macos' 'macos-dark' 'macosd' 'watchos' 'windown' 'ms' 'md-amber' 'md-blue-grey' 'md-blue' 'md-brown' 'md-cyan' 'md-deep-orange' 'md-deep-purple' 'md-green' 'md-grey' 'md-indigo' 'md-light-blue' 'md-light-green' 'md-lime' 'md-orange' 'md-pink' 'md-purple' 'md-red' 'md-yellow' 'md-teal';

/// @name vvalues--justify-content
/// @group Valid Values
/// @since 8.0.0
Expand Down
124 changes: 124 additions & 0 deletions core/utility/color/_color-common.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,124 @@
@use '../../../config' as config;
@use '../../../devpack/invalid-value-message' as *;
@use '../map/map-deep-get' as *;
@use '../validator/is-list-contains' as *;

@use '../../../common/color/apple-hig/ios' as *;
@use '../../../common/color/apple-hig/macos' as *;
@use '../../../common/color/apple-hig/watchos' as *;
@use '../../../common/color/material-design/amber' as *;
@use '../../../common/color/material-design/blue' as *;
@use '../../../common/color/material-design/blue-grey' as *;
@use '../../../common/color/material-design/brown' as *;
@use '../../../common/color/material-design/cyan' as *;
@use '../../../common/color/material-design/deep-orange' as *;
@use '../../../common/color/material-design/deep-purple' as *;
@use '../../../common/color/material-design/green' as *;
@use '../../../common/color/material-design/grey' as *;
@use '../../../common/color/material-design/indigo' as *;
@use '../../../common/color/material-design/light-blue' as *;
@use '../../../common/color/material-design/light-green' as *;
@use '../../../common/color/material-design/lime' as *;
@use '../../../common/color/material-design/orange' as *;
@use '../../../common/color/material-design/pink' as *;
@use '../../../common/color/material-design/purple' as *;
@use '../../../common/color/material-design/red' as *;
@use '../../../common/color/material-design/teal' as *;
@use '../../../common/color/material-design/yellow' as *;
@use '../../../common/color/microsoft-windows' as *;

/// Функция `color-common` позволяет проще получать цвета
/// из цветовых палитр из Common.
///
/// > Функция требует рефакторинга, но в будущем интерфейс
/// > функции не будет изменён. Так что пользоваться можно.
/// ---
/// @name color-common
/// @group Core
/// @since 8.1.1
/// @access public
/// @author Haba Kudzaev (therteenten)
/// @link https://github.com/therteenten/sassify/blob/develop/core/utility/color/_color-common.scss Исходный код миксина
/// @example scss Пример использования в Sass (SCSS)
/// @debug color-common(ios, red); //=> Debug: #ff0000
/// @debug color-common(md-amber, 600); //=> Debug: #ffb300
/// @debug color-common(ms, BlanchedAlmond); //=> Debug: #FFEBCD
/// @debug color-common(macosd, blue); //=> Debug: #2e57ff
/// @return {color} цвет из карты
/// @param {map} $color-palette - название цветовой палитры
/// @param {string} $color-name - название цвета в цветовой палитре
@function color-common($color-palette, $color-name) {

// TODO: реализовать как-нибудь подход ниже
// $-color-palette: '$color--#{$color-palette}';

$-color-palette: '';

// С помощью функции `is-list-contains` проверяем наличие значения
// параметра `$color-palette` в списке `config.$vvalues--color-common`:
@if is-list-contains(config.$vvalues--color-common, $color-palette) {

// если значение содержится в списке, то присваиваем приватной
// переменной `$-color-palette` значение карты (`map`) с цветовой палитрой:
@if $color-palette == 'ios' {
$-color-palette: $color--ios;
} @else if $color-palette == 'ios-dark' or $color-palette == 'iosd' {
$-color-palette: $color--ios-dark;
} @else if $color-palette == 'macos' {
$-color-palette: $color--macos;
} @else if $color-palette == 'macos-dark' or $color-palette == 'macosd' {
$-color-palette: $color--macos-dark;
} @else if $color-palette == 'watchos' {
$-color-palette: $color--watchos;
} @else if $color-palette == 'windown' or $color-palette == 'ms' {
$-color-palette: $color--windows;
} @else if $color-palette == 'md-amber' {
$-color-palette: $color--md-amber;
} @else if $color-palette == 'md-blue-grey' {
$-color-palette: $color--md-blue-grey;
} @else if $color-palette == 'md-blue' {
$-color-palette: $color--md-blue;
} @else if $color-palette == 'md-brown' {
$-color-palette: $color--md-brown;
} @else if $color-palette == 'md-cyan' {
$-color-palette: $color--md-cyan;
} @else if $color-palette == 'md-deep-orange' {
$-color-palette: $color--md-deep-orange;
} @else if $color-palette == 'md-deep-purple' {
$-color-palette: $color--md-deep-purple;
} @else if $color-palette == 'md-green' {
$-color-palette: $color--md-green;
} @else if $color-palette == 'md-grey' {
$-color-palette: $color--md-grey;
} @else if $color-palette == 'md-indigo' {
$-color-palette: $color--md-indigo;
} @else if $color-palette == 'md-light-blue' {
$-color-palette: $color--md-light-blue;
} @else if $color-palette == 'md-light-green' {
$-color-palette: $color--md-light-green;
} @else if $color-palette == 'md-lime' {
$-color-palette: $color--md-lime;
} @else if $color-palette == 'md-orange' {
$-color-palette: $color--md-orange;
} @else if $color-palette == 'md-pink' {
$-color-palette: $color--md-pink;
} @else if $color-palette == 'md-purple' {
$-color-palette: $color--md-purple;
} @else if $color-palette == 'md-red' {
$-color-palette: $color--md-red;
} @else if $color-palette == 'md-yellow' {
$-color-palette: $color--md-yellow;
} @else if $color-palette == 'md-teal' {
$-color-palette: $color--md-teal;
}
}

// Если совпадений не найдено, то отображаем сообщений об этом:
@else {
@return invalid-value-message('color-common', $color-palette, 'Common Color Palette');
}

// Возвращаем цвет из палитры:
@return map-deep-get($-color-palette, $color-name);

}
25 changes: 20 additions & 5 deletions core/utility/map/_map-deep-get.scss
Original file line number Diff line number Diff line change
@@ -1,4 +1,7 @@
@use 'sass:map';
@use '../validator/is-map' as *;
@use '../../../config' as config;
@use '../../../devpack/invalid-value-message' as *;

/// Функция `map-deep-get` получает какое-либо значение
/// из указанной карты (`Map`).
Expand Down Expand Up @@ -27,16 +30,28 @@

$-key: null;

// Прохожу циклом по карте и забираю значение:
@each $key in $keys {
$map: map-get($map, $key);
$-key: $key;
@if is-map($map) {
// Прохожу циклом по карте и забираю значение:
@each $key in $keys {
$map: map-get($map, $key);
$-key: $key;
}
} @else {
@return invalid-value-message('map-deep-get', $map, 'Map');
}

// Показываю предепреждение в консоль, если
// ключ `$-key` равен `null`:
@if type-of($map) == 'null' {
@warn '#{config.$string--emoji__warning} Не удалось найти ключ «#{$-key}». Будет возвращено значение «null»!';

$-error-message: 'Не удалось найти ключ «#{$-key}». Будет возвращено значение «null»!';

@if config.$setting--strict-mode == true {
@error '#{config.$string--emoji__error} #{$-error-message}';
} @else {
@warn '#{config.$string--emoji__warning} #{$-error-message}';
}

}

// Возвращаю значение из карты:
Expand Down
1 change: 1 addition & 0 deletions index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@

@forward 'core/utility/color/color-shade';
@forward 'core/utility/color/color-tint';
@forward 'core/utility/color/color-common';
@forward 'core/utility/contains-modifier';
@forward 'core/utility/get-block';
@forward 'core/utility/list/list-first-item';
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
"description": "Большой набор миксинов и функций на языке CSS-препроцессора Sass",
"main": "index.scss",
"scripts": {
"test": "sass --watch tests/index.scss:tests/dist/stylesheets/index.test.css",
"test": "sass --watch _test.scss:test.css",
"sassdoc": "npx sassdoc . -d docs/",
"npm:publish": "npm publish --access public",
"npm:version-major": "npm version major -m \"Обновил версию пакета до %s\"",
Expand Down
Loading

0 comments on commit fa34439

Please sign in to comment.