dictionary.translation()
The dictionary.translation()
function returns a translation of $search
from $dictionaries...
.
// Sass.
@use 'sass:list';
// The `translator.dictionary-translation()` or `dictionary.translation()`
@function translation($search, $dictionaries...) {
@each $dictionary in $dictionaries {
@each $phrase, $translation in $dictionary {
@if list.index($phrase, $search) and $translation {
@return $translation;
}
}
}
@return null;
}
https://github.com/angular-package/sass/blob/main/translator/dictionary/_dictionary.translation.function.scss
Parameters
$search
$search
A word(string) or phrase(list space separated) to search for translation.
$dictionaries...
$dictionaries...
Dictionaries to look for $search
translation.
Return
The return value is a translation of the $search
.
Examples
// Use.
@use '@angular-package/sass/translator';
// Examples.
$-nested-dictionary: (
general: (word: słowo, (wrapper, wrap): owijka, (technology, technologia): tech, color: c),
class: (prefix: class-prefix, separator: class-separator, suffix: class-suffix, calendars: (calendar: cal), labels: (label: lab)),
var: (prefix: var-prefix, suffix: var-suffix),
);
$-flatten-dictionary: (
'extra small': xs,
(extra large, extra-large): xl,
border: b,
color: c,
delimiter: '-',
outline: o,
prefix: spectre,
separator: '-',
suffix: end,
);
// single dictionary
@debug dictionary.translation(prefix, $-flatten-dictionary); // spectre
@debug dictionary.translation(extra large, $-flatten-dictionary); // xl
// multiple dictionaries
@debug dictionary.translation(extra-large, $-nested-dictionary, $-flatten-dictionary); // xl
@debug dictionary.translation('extra small', $-nested-dictionary, $-flatten-dictionary); // xs
@debug dictionary.translation(prefix, $-nested-dictionary, $-flatten-dictionary); // spectre
@debug dictionary.translation(outline, $-nested-dictionary, $-flatten-dictionary); // o
@debug dictionary.translation(delimiter, $-nested-dictionary, $-flatten-dictionary); // -
Last updated
Was this helpful?