Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add color themes to CSS file generation #611

Open
jpfiset opened this issue Dec 22, 2016 · 0 comments
Open

Add color themes to CSS file generation #611

jpfiset opened this issue Dec 22, 2016 · 0 comments
Labels
Enhancement Desired improvement to design or implementation that adds value.
Milestone

Comments

@jpfiset
Copy link
Collaborator

jpfiset commented Dec 22, 2016

Add the means to replace portion of the generated CSS files given a properties file.

Nunaliit offers a large set of CSS instructions, out of the box, to make a default atlas generated from it work with a certain amount of useful functions. Visual layouts and colourings are crucial parts to make the atlas work.

However, modifying the CSS thus acquired is not always easy. This is because there are numerous values used in the CSS that are identical, but used in different ways. One can not simply perform a search/replace method on CSS values since one would inevitably change values that are out of scope.

Instead of creating a stock CSS for Nunaliit with "values", I propose instead to insert names for those values and associate each name with a value in a property file. At generation, the names in the CSS are replaced with the values.

.n2help_dialog .ui-dialog-titlebar {
	background: {{header.background}};
	color: {{header.color}};
	font-family: helvetica, sans-serif;
	font-weight: 500;
}

Property file:

header.background: #3a3a3a
header.background.button: #2f2f2f
header.background.hover: #1f1f1f
header.background.selected: #160E7D
header.background.module: #444444
header.color: #fff
header.border.color: rgba(255,255,255,0.6)
header.border.color.module: #575757
header.border.button.color: #838383
@jpfiset jpfiset added the Enhancement Desired improvement to design or implementation that adds value. label Dec 22, 2016
@jpfiset jpfiset added this to the 2.2.9 milestone Dec 22, 2016
@jpfiset jpfiset self-assigned this Dec 22, 2016
jpfiset added a commit that referenced this issue Dec 22, 2016
files using theme files.

nunaliit2-css: Add option "--theme-file" to the CSS generation command.

nunaliit2-js: Add theme file to javascript project.

Issue #611
jpfiset added a commit that referenced this issue Dec 22, 2016
file for test theme.

nunaliit2-js: Add theme files for "basic" and "test". Start color
replacement.

Issue #611
jpfiset added a commit that referenced this issue Dec 22, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Enhancement Desired improvement to design or implementation that adds value.
Projects
None yet
Development

No branches or pull requests

1 participant