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.

Sign up for GitHub

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

Jump to bottom

Themes #1

Closed
wwebfor opened this issue Jan 21, 2014 · 4 comments
Closed

Themes #1

wwebfor opened this issue Jan 21, 2014 · 4 comments
Labels
enhancement

Comments

@wwebfor
Copy link
Member

wwebfor commented Jan 21, 2014

No description provided.

@afknapping
Copy link
Contributor

Proposal:

  1. Add sematic classes to all markup elements. (but do not use for styling yet, keeping representational and library classes in markup).
  2. Move styles within stylesheets to the semantic classes (via mixins or preferably @extends).
  3. In case of integration/acceptance tests, update them to the semantic classes.
  4. Remove representational and library classes from the markup.

The look of the page should not change at all during these steps. Might be a use case for PhantomCSS.

When finished, the semantic classes can be used as an API for custom CSS styling.

Notes on the CSS classes:

I have been playing with stuff based on Simple Naming for Modular CSS Class Names and settled on giving most elements a three point identifier like view--component--element.

While using double dashes raises eyebrows at first, these classes have not only been a breeze to style, but also to write tests for.

I'll try to send a PR for step one.

@afknapping
Copy link
Contributor

@wwebfor How do I start the app locally? grunt serve outputs this:

@wwebfor
Copy link
Member Author

wwebfor commented Apr 13, 2014

@filtercake, you should compile less file with grunt task: grunt lessc

afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 13, 2014
move stylesheets to a theme folder. refs Laverna#1
00decb9
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 13, 2014
move stylesheets to a theme folder. refs Laverna#1
dcbf665
This was referenced Apr 16, 2014
Merged
Merged
Merged
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 16, 2014
first green test with phantomcss. Laverna#1
4bb2cfc
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 16, 2014
move reference screenshots to test folder. Laverna#1
3b337f6
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 16, 2014
force failed test. Laverna#1
9b3dad3 
- failed screenshots folder is in base directory. that way a git status will output a list with failed test diff images
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 16, 2014
get tests back to green. Laverna#1
96c864b 
- without any more setup, fail screenshots need to be manually removed from failure/ and test/visual/screenshots
- an automated setup in grunt should clean up failures when tests are back to  green.
- a watch task for the failures folder could open an interface where you approve a failed test image as still passing or mark a new master (which should trigger the tests again). see csscritic.
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 16, 2014
move failures. set up git to show failed tests. Laverna#1
19a345b 
- screenshot folder is now ignored by git
- failures folder moved to test directory and is not ignored.
- that way failed tests show up as untracked files in git status.
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 16, 2014
update readme. Laverna#1
e9b2a3e
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
first green test with phantomcss. Laverna#1
459de8e
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
move reference screenshots to test folder. Laverna#1
4fb13f8
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
force failed test. Laverna#1
feaa235 
- failed screenshots folder is in base directory. that way a git status will output a list with failed test diff images
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
get tests back to green. Laverna#1
c8131cb 
- without any more setup, fail screenshots need to be manually removed from failure/ and test/visual/screenshots
- an automated setup in grunt should clean up failures when tests are back to  green.
- a watch task for the failures folder could open an interface where you approve a failed test image as still passing or mark a new master (which should trigger the tests again). see csscritic.
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
move failures. set up git to show failed tests. Laverna#1
cf5ac4a 
- screenshot folder is now ignored by git
- failures folder moved to test directory and is not ignored.
- that way failed tests show up as untracked files in git status.
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
update readme. Laverna#1
8964efe
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
remove sourcemaps from git. Laverna#1
0a6afe4
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
move styles to semantic class proof of concept. Laverna#1
1f14004
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
add test. Laverna#1
01234a5
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
remove sourcemaps from git. Laverna#1
1c53462
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
add test. Laverna#1
eb4ffde
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
move styles to semantic class proof of concept. Laverna#1
bca0187
afknapping pushed a commit to afknapping/laverna that referenced this issue Apr 18, 2014
remove sourcemaps from git. Laverna#1
047b7f3
wwebfor added a commit that referenced this issue Apr 19, 2014
@wwebfor
Merge pull request #66 from filtercake/master
2a6f5b0 
remove sourcemaps from git. #1
afknapping pushed a commit to afknapping/laverna that referenced this issue May 4, 2014
add visual test for welcome page. Laverna#1
08a366d
afknapping pushed a commit to afknapping/laverna that referenced this issue May 4, 2014
add css of styles subfolders to gitignore. Laverna#1
f4d41b6
afknapping pushed a commit to afknapping/laverna that referenced this issue May 4, 2014
isolate welcome styles, split within default theme. Laverna#1
197ad0f
afknapping pushed a commit to afknapping/laverna that referenced this issue May 4, 2014
fix fontello path. Laverna#1
370df07
afknapping pushed a commit to afknapping/laverna that referenced this issue May 4, 2014
add build config for splitted styles. Laverna#1
86c561a
afknapping pushed a commit to afknapping/laverna that referenced this issue May 4, 2014
move bootstrap dependency to theme. Laverna#1
f93708b
wwwredfish pushed a commit that referenced this issue Aug 5, 2014
Merge pull request #1 from Laverna/master
f3c40ca 
update
wwebfor referenced this issue Jul 18, 2015
@wwebfor
Create a default theme.
3731df0
@tovletoglou
Copy link

Related issues:
#226 Request: Night mode
#421 Dark theme

@JerJohn15 JerJohn15 mentioned this issue Aug 15, 2016
Open
@praxiq praxiq mentioned this issue Feb 5, 2017
Open
wwebfor added a commit that referenced this issue Oct 19, 2017
@wwebfor
[Feature] Add a dark theme
4acc821 
Close #1, #421, #656, #764. Related issue: #825, #226.
@wwebfor wwebfor closed this as completed Dec 26, 2017
4lch4 pushed a commit to 4lch4/laverna that referenced this issue Aug 13, 2022
@wwwredfish
Merged in wwwredfish (pull request Laverna#1)
45c64a4 
Added notes search form
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
enhancement
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@afknapping @wwebfor @tovletoglou