diff --git a/assets/media/brand/react-redux-saga.png b/assets/media/brand/react-redux-saga.png
new file mode 100644
index 0000000..9c6a6c7
Binary files /dev/null and b/assets/media/brand/react-redux-saga.png differ
diff --git a/assets/media/brand/react-redux-saga.svg b/assets/media/brand/react-redux-saga.svg
new file mode 100644
index 0000000..3e26f4c
--- /dev/null
+++ b/assets/media/brand/react-redux-saga.svg
@@ -0,0 +1,12 @@
+
+
diff --git a/src/components/Background.jsx b/src/components/Background.jsx
index c42b63f..f45dab4 100644
--- a/src/components/Background.jsx
+++ b/src/components/Background.jsx
@@ -1,7 +1,7 @@
import styled from 'styled-components';
const Background = styled.div`
- background: #000 linear-gradient(to bottom, #00b4d5 0%, #002529 100%) fixed;
+ background: #000 linear-gradient(to bottom, #00657e 0%, #002529 100%) fixed;
color: #fff;
min-height: 100vh;
overflow: hidden;
@@ -16,7 +16,7 @@ const Background = styled.div`
position: absolute;
right: 0;
top: 0;
- transform: rotate(-20deg) scale(1.5) translate(0, 43%);
+ transform: rotate(-20deg) scale(2) translate(0, 45%);
}
`;
diff --git a/src/components/Header.jsx b/src/components/Header.jsx
index 9827c43..ff8b5cd 100755
--- a/src/components/Header.jsx
+++ b/src/components/Header.jsx
@@ -1,7 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
-import rgba from 'polished/lib/color/rgba';
import { appColor, headerHeight } from 'modules/theme';
import { logOut } from 'actions';
@@ -13,7 +12,7 @@ import Logo from 'components/Logo';
const { responsive, spacer } = utils;
const HeaderWrapper = styled.header`
- background-color: ${rgba(appColor, 0.9)};
+ background-color: #113740;
height: ${headerHeight}px;
left: 0;
position: fixed;
@@ -44,7 +43,7 @@ const HeaderContainer = styled(Container)`
const Logout = styled.button`
align-items: center;
- color: #333;
+ color: #fff;
display: flex;
font-size: 1.3rem;
padding: ${spacer(2)};
@@ -52,7 +51,7 @@ const Logout = styled.button`
${responsive({ lg: 'font-size: 1.6rem;' })}; /* stylelint-disable-line */
&.active {
- color: #000;
+ color: #fff;
}
span {
@@ -77,7 +76,7 @@ export default class Header extends React.PureComponent {
return (
-
+
logout
diff --git a/src/components/Logo.jsx b/src/components/Logo.jsx
index 30590fe..64dc13f 100644
--- a/src/components/Logo.jsx
+++ b/src/components/Logo.jsx
@@ -1,22 +1,26 @@
import React from 'react';
+import PropTypes from 'prop-types';
import styled from 'styled-components';
import { ReactComponent as Icon } from 'assets/media/brand/icon.svg';
+import { ReactComponent as RRS } from 'assets/media/brand/react-redux-saga.svg';
-export const Logo = styled.div`
+export const Wrapper = styled.div`
align-items: flex-start;
display: inline-flex;
font-size: 0;
svg {
- height: auto;
+ height: 4.2rem;
max-height: 100%;
- width: 4.8rem;
+ width: auto;
}
`;
-export default () => (
-
-
-
-);
+const Logo = ({ type = 'icon' }) => {type === 'icon' ? : };
+
+Logo.propTypes = {
+ type: PropTypes.string,
+};
+
+export default Logo;
diff --git a/src/routes/Home.jsx b/src/routes/Home.jsx
index 8eb130e..2ec0b01 100755
--- a/src/routes/Home.jsx
+++ b/src/routes/Home.jsx
@@ -26,7 +26,14 @@ const Header = styled.div`
text-align: center;
svg {
- width: 20rem;
+ height: 10rem;
+ width: auto;
+
+ ${/* sc-custom '@media-query' */ utils.responsive({
+ lg: `
+ height: 15rem;
+ `,
+ })};
}
`;
@@ -43,7 +50,6 @@ const Heading = styled.h1`
font-size: 4rem;
`,
})};
- /* stylelint-enable */
`;
export class Home extends React.PureComponent {
@@ -65,7 +71,7 @@ export class Home extends React.PureComponent {
{config.name}