diff --git a/src/components/Seek/Seek.js b/src/components/Seek/Seek.js index d3d439e..e92ebb4 100644 --- a/src/components/Seek/Seek.js +++ b/src/components/Seek/Seek.js @@ -14,10 +14,11 @@ const SeekHeader = styled.header` border-bottom-width: 1px; border-bottom-style: solid; border-color: ${props => props.theme.colors.quarternary}; + margin-top: 15px; ` const SeekH1 = styled.h1` display: block; - font-size: ${SIZES.normal}; + font-size: ${SIZES.small}; color: ${props => props.theme.colors.secondary}; ` const SeekArrows = styled.div` diff --git a/src/components/screens/Day/Day.js b/src/components/screens/Day/Day.js index 1868dd5..37c1864 100644 --- a/src/components/screens/Day/Day.js +++ b/src/components/screens/Day/Day.js @@ -1,6 +1,7 @@ import React, { Component } from "react" import styled from "@emotion/styled" -import { css, keyframes } from "@emotion/core" +/** @jsx jsx */ +import { jsx, css, keyframes } from "@emotion/core" import { compose } from "recompose" import { withRouter } from "react-router-dom" import { withTheme } from "emotion-theming" @@ -39,6 +40,9 @@ const JournalEntryArea = styled.textarea` &::placeholder { color: ${props => props.theme.colors.tertiary}; } + &::selection { + background: ${props => props.theme.colors.hover}; + } &:focus { box-shadow: 0 0 0 8px ${props => props.theme.colors.bodyBackground}, 0 0 0 10px ${props => props.theme.colors.hover}; @@ -54,7 +58,6 @@ const fadeKeyFrames = keyframes` ` const LoadingSpinner = styled(BeatLoader)` opacity: 0; - animation: fadein 2s; ` const AUTOSAVE_DELAY = 2000 @@ -126,7 +129,6 @@ class Day extends Component { this.setState({ text }) this.timeout = setTimeout(() => { - console.log(text) this.saveText(text) }, AUTOSAVE_DELAY) } @@ -176,10 +178,9 @@ class Day extends Component { /> RECORD THOUGHTS ABOUT YOUR DAY {loading ? ( - //
this.onChangeText(e)} value={text} + css={css` + animation: ${fadeKeyFrames} 0.2s ease-in; + `} /> )}