- font-size affects
line-heightneeds - translations affect
line-heightneeds - responsive accomodations
deepskyblue ryanve
🟣
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .border-between-top:not(:first-child) { border-top-style: solid; border-top-width: 1px } | |
| .border-between-bottom:not(:last-child) { border-bottom-style: solid; border-bottom-width: 1px } | |
| .border-between-left:not(:first-child) { border-left-style: solid; border-left-width: 1px } | |
| .border-between-right:not(:last-child) { border-right-style: solid; border-right-width: 1px } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .flow-baseline { vertical-align: baseline } | |
| .flow-sub { vertical-align: sub } | |
| .flow-super { vertical-align: super } | |
| .flow-text-top { vertical-align: text-top } | |
| .flow-text-bottom { vertical-align: text-bottom } | |
| .flow-top { vertical-align: top } | |
| .flow-bottom { vertical-align: bottom } | |
| .flow-middle { vertical-align: middle } | |
| .flow-single { line-height: 1 } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| :root { | |
| --size-h0: 2.25rem; | |
| --size-h1: 2rem; | |
| --size-h2: 1.625rem; | |
| --size-h3: 1.375rem; | |
| --size-h4: 1.25rem; | |
| --size-lede: 1.125rem; | |
| --size-text: 1rem; | |
| --size-fine: .875rem; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .line-single { line-height: 1 } | |
| .line-compact { line-height: 1.25 } | |
| .line-passing { line-height: 1.5 } | |
| .line-optimal { line-height: 1.75 } | |
| .line-double { line-height: 2 } | |
| .line-inherit { line-height: inherit } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .pointer { | |
| --enabled-cursor: pointer; | |
| --disabled-cursor: not-allowed; | |
| } | |
| .pointer, | |
| .pointer:enabled { | |
| cursor: pointer; | |
| cursor: var(--enabled-cursor); | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| function lookup(object, dots) { | |
| return dots.split('.').reduce(function(memo, next) { | |
| return memo[next] | |
| }, object) | |
| } |
ryanve
/ hire-artists.md
Last active
May 23, 2017 22:20
Notes from https://designersandgeeks.com/events/hire-artists
- Tech has a look and it's kinda boring.
- You wanna disrupt? Hire artists.
- Visual vernacular
- You are what you make.
- layout
- flexbox
- grid system
- spacing
positionborderz-indexdisplayoverflow
- floats
- approachability (be simple, expressive)
- decoupling (create bridges, swim lanes)
- empowering (inspire confidence)
- feedback (listen, collaborate, ask why)
- inclusivity (accessibility, empathy, appropriate tone)
- impact (exposure to diverse ideas)
- prototyping (facilitate consumption, deliver standards)
- resilience (compose isolated modules, enforce with tooling)