lukechilds
/
ledger-live-desktop
mirror of https://github.com/lukechilds/ledger-live-desktop.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Styles adjustments on theme, icons and modals

master
meriadec 7 years ago
parent
502c8bba67
commit
e47b2fd6fb
No known key found for this signature in database GPG Key ID: 1D2FC2305E2CB399
4 changed files with 23 additions and 6 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/components/AccountPage.js
  2. 1
      src/components/base/Icon.js
  3. 24
      src/components/base/Modal/index.js
  4. 2
      src/styles/theme.js

2
src/components/AccountPage.js
View File

@ -49,7 +49,7 @@ const Action = styled(Box).attrs({
text-transform: uppercase; text-transform: uppercase;
&:hover { &:hover {
color: ${p => p.theme.colors.gray}; color: ${p => p.theme.colors.grey};
} }
` `

1
src/components/base/Icon.js
View File

@ -7,6 +7,7 @@ import { fontSize, color } from 'styled-system'
const Container = styled.div` const Container = styled.div`
${fontSize}; ${fontSize};
${color}; ${color};
line-height: 1;
` `
export default ({ name, ...props }: { name: string }) => ( export default ({ name, ...props }: { name: string }) => (

24
src/components/base/Modal/index.js
View File

@ -16,6 +16,7 @@ import { rgba } from 'styles/helpers'
import { closeModal, isModalOpened } from 'reducers/modals' import { closeModal, isModalOpened } from 'reducers/modals'
import Box from 'components/base/Box' import Box from 'components/base/Box'
import Icon from 'components/base/Icon'
type Props = { type Props = {
isOpened?: boolean, isOpened?: boolean,
@ -26,7 +27,7 @@ type Props = {
} }
const springConfig = { const springConfig = {
stiffness: 350, stiffness: 400,
} }
const mapStateToProps = (state, { name, isOpened }) => ({ const mapStateToProps = (state, { name, isOpened }) => ({
@ -43,6 +44,7 @@ const mapDispatchToProps = (dispatch, { name, onClose = noop }) => ({
}) })
const Container = styled(Box).attrs({ const Container = styled(Box).attrs({
color: 'grey',
align: 'center', align: 'center',
justify: 'flex-start', justify: 'flex-start',
sticky: true, sticky: true,
@ -86,6 +88,20 @@ const Body = styled(Box).attrs({
border-radius: 5px; border-radius: 5px;
` `
const CloseContainer = styled(Box).attrs({
p: 2,
color: 'mouse',
})`
cursor: pointer;
position: absolute;
top: 0;
right: 0;
&:hover {
color: ${p => p.theme.colors.grey};
}
`
export class Modal extends PureComponent<Props> { export class Modal extends PureComponent<Props> {
static defaultProps = { static defaultProps = {
onClose: noop, onClose: noop,
@ -127,9 +143,9 @@ export const ModalBody = ({
}) => ( }) => (
<Body> <Body>
{onClose && ( {onClose && (
<Box align="flex-end"> <CloseContainer onClick={onClose}>
<Box onClick={onClose}>[x]</Box> <Icon fontSize={3} name="times" />
</Box> </CloseContainer>
)} )}
{children} {children}
</Body> </Body>

2
src/styles/theme.js
View File

@ -11,7 +11,7 @@ export default {
argile: '#eeeeee', argile: '#eeeeee',
blue: '#6193ff', blue: '#6193ff',
cream: '#f9f9f9', cream: '#f9f9f9',
gray: '#a8b6c2', grey: '#a8b6c2',
grenade: '#ea2e49', grenade: '#ea2e49',
lead: '#999999', lead: '#999999',
mouse: '#e2e2e2', mouse: '#e2e2e2',

Write Preview
Loading…
Cancel
Save