variant: only export generated colors if changed from parent #188

This commit is contained in:
Sören Weber 2022-02-20 17:33:16 +01:00
parent 56c680d7a7
commit c31edb7f1f
No known key found for this signature in database
GPG key ID: 07D17FF580AE7589

View file

@ -38,19 +38,11 @@ function initGraph(){
}; };
function download(data, mimetype, filename){ function download(data, mimetype, filename){
// Creating a Blob for having a csv file format var blob = new Blob([data], { type: mimetype });
// and passing the data with type var url = window.URL.createObjectURL(blob);
const blob = new Blob([data], { type: mimetype }); var a = document.createElement('a');
// Creating an object for downloading url
const url = window.URL.createObjectURL(blob);
// Creating an anchor(a) tag of HTML
const a = document.createElement('a');
// Passing the blob downloading url
a.setAttribute('href', url); a.setAttribute('href', url);
// Setting the anchor tag attribute for downloading
// and passing the download file name
a.setAttribute('download', filename); a.setAttribute('download', filename);
// Performing a download with click
a.click(); a.click();
} }
@ -87,8 +79,17 @@ function adjustCSSRules(selector, props, sheets){
} }
} }
function normalizeColor( c ){
c = c.trim();
c = c.replace( /\s*\(\s*/, "( " );
c = c.replace( /\s*\)\s*/, " )" );
c = c.replace( /\s*,\s*/, ", " );
c = c.replace( /0*\./, "." );
c = c.replace( / +/, " " );
return c;
}
function getColorValue( c ){ function getColorValue( c ){
return getComputedStyle( document.documentElement ).getPropertyValue( '--INTERNAL-'+c ).trim(); return normalizeColor( getComputedStyle( document.documentElement ).getPropertyValue( '--INTERNAL-'+c ) );
} }
function changeColor( c ){ function changeColor( c ){
@ -123,11 +124,29 @@ function changeColor( c ){
} }
} }
function generateColorVariable( e ){
var v = '';
var gen = true;
if( e.fallback ){
f = variables.find( function( x ){
return x.name == e.fallback;
});
gen = getColorValue(f.name) != getColorValue(e.name);
}
else if( e.default ){
gen = e.default != getColorValue(e.name);
}
if( gen ){
v += ' --' + e.name + ': ' + getColorValue(e.name) + ';\n';
}
return v;
}
function generateStylesheet(){ function generateStylesheet(){
var style = var style =
'/* ' + themename + ' */\n' + '/* ' + themename + ' */\n' +
':root {\n' + ':root {\n' +
variables.reduce( function( a, e ){ return a + ' --' + e.name + ': ' + getColorValue(e.name) + ';\n'; }, '' ) + variables.reduce( function( a, e ){ return a + generateColorVariable( e ); }, '' ) +
'}\n'; '}\n';
return style; return style;
} }
@ -144,7 +163,6 @@ function generateGraphStyles(){
variables.forEach( function( e ){ variables.forEach( function( e ){
styleGroup( '.'+e.name, e.name ); styleGroup( '.'+e.name, e.name );
}); });
//styleGroup( '.root', 'MAIN-TEXT-color' )
styleGroup( '#maincontent', 'MAIN-BG-color' ) styleGroup( '#maincontent', 'MAIN-BG-color' )
styleGroup( '#mainheadings', 'MAIN-BG-color' ) styleGroup( '#mainheadings', 'MAIN-BG-color' )
styleGroup( '#inlinecode', 'CODE-INLINE-BG-color' ) styleGroup( '#inlinecode', 'CODE-INLINE-BG-color' )
@ -281,7 +299,7 @@ var variables = [
{ name: 'BOX-ORANGE-TEXT-color', group: 'colored boxes', fallback: 'BOX-TEXT-color' }, { name: 'BOX-ORANGE-TEXT-color', group: 'colored boxes', fallback: 'BOX-TEXT-color' },
{ name: 'BOX-NOTE-TEXT-color', group: 'colored boxes', fallback: 'BOX-ORANGE-TEXT-color' }, { name: 'BOX-NOTE-TEXT-color', group: 'colored boxes', fallback: 'BOX-ORANGE-TEXT-color' },
{ name: 'BOX-RED-color', group: 'colored boxes', default: 'rgba( 237, 153, 9, 1 )' }, { name: 'BOX-RED-color', group: 'colored boxes', default: 'rgba( 224, 62, 62, 1 )' },
{ name: 'BOX-WARNING-color', group: 'colored boxes', fallback: 'BOX-RED-color' }, { name: 'BOX-WARNING-color', group: 'colored boxes', fallback: 'BOX-RED-color' },
{ name: 'BOX-RED-TEXT-color', group: 'colored boxes', fallback: 'BOX-TEXT-color' }, { name: 'BOX-RED-TEXT-color', group: 'colored boxes', fallback: 'BOX-TEXT-color' },
{ name: 'BOX-WARNING-TEXT-color', group: 'colored boxes', fallback: 'BOX-RED-TEXT-color' }, { name: 'BOX-WARNING-TEXT-color', group: 'colored boxes', fallback: 'BOX-RED-TEXT-color' },