Skip to content
GitLab
Projects Groups Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
  • Register
  • Sign in
  • D design
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
    • Locked Files
  • Issues 20
    • Issues 20
    • List
    • Boards
    • Service Desk
    • Milestones
    • Iterations
    • Requirements
  • Merge requests 0
    • Merge requests 0
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
    • Test Cases
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Code review
    • Insights
    • Issue
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • pubsweetpubsweet
  • design
  • Issues
  • #1
Closed
Open
Issue created Jan 09, 2018 by Yannis Barlas@yannisMaintainer

Color variables

The purpose of this issue is to come up with a common list of color variables for theming in pubsweet applications.
The idea is to compare the ideas that elife and coko/collabra have on the subject and find a "vanilla" list that organisations can build on.

Elife asset name Elife suggested variable Coko suggested variable Vanilla variable Notes
Primary color $color-primary $color-primary This color is the branding main color
Primary secodary $color-secondary This color is the branding secondary color
Interation color $hover-focus $color-action This color is the color used when hovering a button, a link.
Text color $color-text $color-text Main color for the text, which should be inherited by all elements
Text secondary color $color-text-secondary What is the use of this color?
Text placeholder / disabled color $color-tex-placeholder
Furniture color (dividers) $color-text-dividers
Background color hue $color-text-background-hue Where is that variable used?
Success color $color-success $color-valid
Attention color $attention-color $color-warning
Attention color $color-danger
Attention color $attention-color
**light grey ** This color comes from editoria alignmentBox, need to be updated
**grey ** This color comes from editoria alignmentBox, need to be updated
dark grey This color comes from editoria alignmentBox, need to be updated
whitergba This color comes from editoria alignmentBox, need to be updated (used for the inset of the alignmentBox)

@julientaq @Nick

Edited Jan 19, 2018 by julientaq
Assignee
Assign to
Time tracking