Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-15 10:14:29 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add unitless type

Browse Source
This commit is contained in:
Jeremy Thomas
2018-06-17 01:05:48 +01:00
parent e8f3fc0d66
commit dd59374591
25 changed files with 248 additions and 155 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
docs/scripts/plugins/02-read-derived-variables.js
View File

@@ -4,6 +4,7 @@ const utils = require('./utils');
const fs = require('fs');
let initial_variables = JSON.parse(fs.readFileSync(utils.files.initial_variables));
let derived_variables = JSON.parse(fs.readFileSync(utils.files.derived_variables));
function plugin() {
return (files, metalsmith, done) => {
@@ -21,7 +22,13 @@ function plugin() {
const variable = utils.parseLine(line);
if (variable != false) {
variable.computed_value = utils.getInitialValue(variable.value, variable.type, initial_variables);
const computed_data = utils.getComputedData(variable.name, variable.value, variable.type, initial_variables, derived_variables);
if (Object.keys(computed_data).length > 0) {
variable.computed_type = computed_data.computed_type;
variable.computed_value = computed_data.computed_value;
}
variables.by_name[variable.name] = variable;
variables.list.push(variable.name);
}

2
docs/scripts/plugins/03-read-other-variables.js
View File

@@ -26,7 +26,7 @@ function plugin() {
const variable = utils.parseLine(line);
if (variable != false) {
const computed_data = utils.getComputedData(variable.value, variable.type, initial_variables, derived_variables);
const computed_data = utils.getComputedData(variable.name, variable.value, variable.type, initial_variables, derived_variables);
if (Object.keys(computed_data).length > 0) {
variable.computed_type = computed_data.computed_type;

73
docs/scripts/plugins/utils.js
View File

@@ -2,31 +2,59 @@ const fs = require('fs');
const path = require('path');
const base_path = '../_data/variables/';
const css_keywords = ['null', 'ease-out', 'optimizeLegibility'];
const regex_unitless = /^([0-9]+\.[0-9]+)$/;
let utils = {
getVariableType: (value) => {
getVariableType: (name, value) => {
if (!value) {
return 'string';
}
if (value.startsWith('hsl')) {
if (name == '$sizes') {
return 'map';
}
if (value.startsWith('hsl') || value.startsWith('#') || value.startsWith('rgb')) {
return 'color';
} else if (css_keywords.includes(value)) {
return 'keyword';
} else if (
value.startsWith('findColorInvert')
|| value.startsWith('mergeColorMaps')
) {
return 'function';
} else if (value.startsWith('$')) {
return 'variable';
} else if (value.startsWith('BlinkMacSystemFont') || value == 'monospace') {
} else if (
value.startsWith('BlinkMacSystemFont')
|| value == 'monospace'
) {
return 'font-family';
} else if (value == 'true' || value == 'false') {
} else if (value == 'true'
|| value == 'false'
) {
return 'boolean';
} else if (value.endsWith('ms')) {
return 'duration';
} else if (value.includes('+')) {
return 'computed';
} else if (value.endsWith('00')) {
} else if (
value.endsWith('00')
|| value == 'normal'
) {
return 'font-weight';
} else if (value.endsWith('px') || value.endsWith('em')) {
} else if (
value.endsWith('px')
|| value.endsWith('em')
|| value.includes('px ')
|| value.includes('em ')
) {
return 'size';
} else if (value.includes('$')) {
return 'compound';
} else if (value.startsWith('findColorInvert')) {
return 'function';
} else if (value.match(regex_unitless)) {
return 'unitless';
}
return 'string';
@@ -43,7 +71,7 @@ let utils = {
return variable = {
name: variable_name,
value: variable_value,
type: utils.getVariableType(variable_value),
type: utils.getVariableType(variable_name, variable_value),
};
}
@@ -83,7 +111,6 @@ let utils = {
if (second_value.startsWith('$') && second_value in initial_variables.by_name) {
const third_value = initial_variables.by_name[second_value].value;
console.log('third_value', third_value);
return third_value;
}
@@ -94,7 +121,7 @@ let utils = {
return value;
},
getComputedData: (value, type, initial_variables, derived_variables) => {
getComputedData: (name, value, type, initial_variables, derived_variables = {}) => {
let computed_value = '';
if (value.startsWith('$')) {
@@ -102,7 +129,7 @@ let utils = {
if (value in initial_variables.by_name) {
second_value = initial_variables.by_name[value].value;
} else if (value in derived_variables.by_name) {
} else if (derived_variables.by_name && value in derived_variables.by_name) {
second_value = derived_variables.by_name[value].value;
}
@@ -111,7 +138,7 @@ let utils = {
if (second_value in initial_variables.by_name) {
third_value = initial_variables.by_name[second_value].value;
} else if (second_value in derived_variables.by_name) {
} else if (derived_variables.by_name && second_value in derived_variables.by_name) {
third_value = derived_variables.by_name[second_value].value;
}
@@ -119,10 +146,26 @@ let utils = {
} else {
computed_value = second_value;
}
} else if (value.startsWith('findColorInvert')) {
// e.g. $turquoise-invert -> findColorInvert($turquoise)
if (value.endsWith('($yellow)')) {
computed_value = 'rgba(0, 0, 0, 0.7)';
} else {
computed_value = '#fff';
}
}
if (computed_value != '') {
const computed_type = utils.getVariableType(computed_value);
if (computed_value && computed_value != '') {
// e.g. $primary-invert -> $turquoise-invert -> findColorInvert($turquoise)
if (computed_value.startsWith('findColorInvert')) {
if (computed_value.endsWith('($yellow)')) {
computed_value = 'rgba(0, 0, 0, 0.7)';
} else {
computed_value = '#fff';
}
}
const computed_type = utils.getVariableType(name, computed_value);
return {
computed_type,