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

Adjusting the Spine colors #353

Closed
18 tasks done
jeremyfelt opened this issue Mar 29, 2016 · 5 comments
Closed
18 tasks done

Adjusting the Spine colors #353

jeremyfelt opened this issue Mar 29, 2016 · 5 comments
Assignees
Milestone

Comments

@jeremyfelt
Copy link
Contributor

jeremyfelt commented Mar 29, 2016

Global

  • In general, change gray from #5e6a71 to #717171

White

  • Spine action items - default #717171, hover #981e32
  • Offside links to #717171, hover #981e32, always show the offsite icon
  • Mobile menu button #717171
  • List item border-color: rgba(0,0,0,.1);

Dark

  • Spine background to #3b4042
  • Spine action items - default #d7dadb, hover #fff
  • Offsite links to #d7dadb, hover #fff, always show the offsite icon
  • Mobile menu button #d7dadb
  • List item border-color: rgba(255,255,255,0.1);

Darker

  • Spine action items - default #d7dadb, hover #fff
  • Offsite links to #d7dadb, hover #fff, always show the offsite icon
  • Mobile menu button #d7dadb
  • List item border-color: rgba(255,255,255,0.1);

Crimson

  • Spine action items - default #d7dadb, hover #fff
  • Offsite links to #d7dadb, hover #fff, always show the offsite icon
  • Mobile menu button #d7dadb
  • List item border-color: #81192a
@quantumJLBass
Copy link

I will throw this out here again; I think would be helpful for there to be a json object that apps can pull in with the mapping of all brand colors, so that changes like this can propagate when used in the content generated areas out side of the spine. Up side is that you can use it in the build process as well as out side sources can consume it as needed.

On example is that I have a few systems that does a build of css and uses the brand colors based on the spine in html elements that I can't adjust the classes. So I have a custom map of the brand colors that I maintain. I could pull in this json file from the repo and remap colors every so offend when the user choses which version of the spine to use or such.

I know we have talked about this a while back since it is a simple thing. Just want to put that thought out again given this change came up and request to change the built to use a mapping from a json which should be fairly simple and provide something for other systems to consume easily. Thank you -Jeremy

@jeremyfelt
Copy link
Contributor Author

The colors above are more for slight adjustments to the Spine itself for contrast reasons. They aren't necessarily all brand colors, so I'm not sure if it is as helpful as the colors listed on https://brand.wsu.edu/visual/colors/. We can probably discuss providing some set of color data via JSON in another issue. It would be interesting to see what kind of demand there was.

@quantumJLBass
Copy link

As far as I recall the brand site had the colors from here too, but didn't double check. I know Nate said it would. But the point is that I have a few systems that hold a mapping of the spine colors, so keeping it up to date when minor changes happen is preferred. I image there are a few others that do or would if they know they could. Honestly I think it would be hard to tell the demand till it is made but I know there is at least the stores at this vary moment that would benefit for the minor change. Field of dreams type thing here I am betting :D

@jeremyfelt
Copy link
Contributor Author

jeremyfelt commented May 19, 2016

In 45d785f, I adjusted $gray-dark to be #3b4042 rather than just changing the Spine background for the dark theme.

  • Need to verify that this is the right change.

@jeremyfelt jeremyfelt self-assigned this May 19, 2016
@jeremyfelt jeremyfelt added this to the 1.4.3 milestone May 19, 2016
jeremyfelt added a commit that referenced this issue May 19, 2016
 Spine action items - default #d7dadb, hover #fff
 Offsite links to #d7dadb, hover #fff, always show the offsite icon
 Mobile menu button #d7dadb
 List item border-color: rgba(255,255,255,0.1);

See #353
jeremyfelt added a commit that referenced this issue May 19, 2016
Spine action items - default #d7dadb, hover #fff
 Offsite links to #d7dadb, hover #fff, always show the offsite icon
 Mobile menu button #d7dadb
 List item border-color: #81192a

See #353
jeremyfelt added a commit that referenced this issue May 19, 2016
* Adjust default gray from `#5e6a71` to `#717171`

See #353.

* Adjust Spine action tab defaults to `$gray` with `$crimson` hover

See #353

* Adjust offsite links to gray/crimson, always show icon

See #353

* Adjust default mobile menu color to gray

See #353

* Adjust color of border on Spine list items

See #353.

* Change `$gray-dark` from `#464e54` to `#3b4042`

See #353

* Adjust Dark spine action items to gray-lightly/white

See #353

* Adjust a series of dark theme Spine nav colors

See #353

* Adjust mobile menu color to gray-lightly in dark theme

See #353

* Adjust Darker theme with new color combinations

 Spine action items - default #d7dadb, hover #fff
 Offsite links to #d7dadb, hover #fff, always show the offsite icon
 Mobile menu button #d7dadb
 List item border-color: rgba(255,255,255,0.1);

See #353

* Adjust crimson theme color combinations

Spine action items - default #d7dadb, hover #fff
 Offsite links to #d7dadb, hover #fff, always show the offsite icon
 Mobile menu button #d7dadb
 List item border-color: #81192a

See #353

* Align crimson spine nav colors with action and offsite

See #353
@jeremyfelt
Copy link
Contributor Author

Fixed in #381.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants