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

Dark mode color tweaks #1279

Merged
merged 8 commits into from
Jun 14, 2021
Merged

Dark mode color tweaks #1279

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
ddbe22a
use functional shadow for overlay
VanAnderson Jun 7, 2021
bd90630
Create honest-apes-travel.md
VanAnderson Jun 9, 2021
c0c6065
Merge remote-tracking branch 'origin/main' into VanAnderson/overlay-s…
colebemis Jun 14, 2021
45bac5b
Update overlay shadows
colebemis Jun 14, 2021
8b08a4d
Update input border
colebemis Jun 14, 2021
68f52c4
Create strong-eggs-yawn.md
colebemis Jun 14, 2021
75b5d16
Update honest-apes-travel.md
colebemis Jun 14, 2021
1d086e3
Merge branch 'main' into VanAnderson/overlay-shadow
colebemis Jun 14, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/honest-apes-travel.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@primer/components": patch
---

Update overlay shadows
5 changes: 5 additions & 0 deletions .changeset/strong-eggs-yawn.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@primer/components": patch
---

Update TextInput border color
2 changes: 1 addition & 1 deletion src/Dialog/Dialog.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -184,7 +184,7 @@ const StyledDialog = styled.div<StyledDialogProps & SystemCommonProps & SystemPo
display: flex;
flex-direction: column;
background-color: ${get('colors.bg.overlay')};
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0px 8px 24px rgba(149, 157, 165, 0.2);
box-shadow: ${get('shadows.overlay.shadow')};
min-width: 296px;
max-width: calc(100vw - 64px);
max-height: calc(100vh - 64px);
Expand Down
3 changes: 1 addition & 2 deletions src/Overlay.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,10 +33,9 @@ const widthMap = {
auto: 'auto'
}

/*TODO replace with shadow functional color variable when it's shipped to primer/primitives*/
const StyledOverlay = styled.div<StyledOverlayProps & SystemCommonProps & SystemPositionProps & SxProp>`
background-color: ${get('colors.bg.overlay')};
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0px 8px 24px rgba(149, 157, 165, 0.2);
box-shadow: ${get('shadows.overlay.shadow')};
position: absolute;
min-width: 192px;
max-width: 640px;
Expand Down
2 changes: 1 addition & 1 deletion src/TextInput.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ const Wrapper = styled.span<StyledWrapperProps>`
vertical-align: middle;
background-repeat: no-repeat; // Repeat and position set for form states (success, error, etc)
background-position: right 8px center; // For form validation. This keeps images 8px from right and centered vertically.
border: 1px solid ${get('colors.input.border')};
border: 1px solid ${get('colors.border.primary')};
border-radius: ${get('radii.2')};
outline: none;
box-shadow: ${get('shadows.shadow.inset')};
Expand Down