summaryrefslogtreecommitdiffstats
path: root/stepped-solutions/05/frontend/components/styles/NavStyles.js
diff options
context:
space:
mode:
authorWes Bos <wesbos@gmail.com>2018-06-27 13:02:25 -0400
committerWes Bos <wesbos@gmail.com>2018-06-27 13:02:25 -0400
commitff7fc88e36bb66a47327fa2c7e8513b222e539ef (patch)
treeecfc2901b53d8e068252b058a07d1a4e63d42816 /stepped-solutions/05/frontend/components/styles/NavStyles.js
parent4e52a98a0f78d2bedfdd31a1955639143cd26fc6 (diff)
Video 21
Diffstat (limited to 'stepped-solutions/05/frontend/components/styles/NavStyles.js')
-rw-r--r--stepped-solutions/05/frontend/components/styles/NavStyles.js64
1 files changed, 0 insertions, 64 deletions
diff --git a/stepped-solutions/05/frontend/components/styles/NavStyles.js b/stepped-solutions/05/frontend/components/styles/NavStyles.js
deleted file mode 100644
index 41523df..0000000
--- a/stepped-solutions/05/frontend/components/styles/NavStyles.js
+++ /dev/null
@@ -1,64 +0,0 @@
-import styled from 'styled-components';
-
-const NavStyles = styled.ul`
- margin: 0;
- padding: 0;
- display: flex;
- justify-self: end;
- font-size: 2rem;
- a,
- button {
- padding: 1rem 3rem;
- display: flex;
- align-items: center;
- position: relative;
- text-transform: uppercase;
- font-weight: 900;
- font-size: 1em;
- background: none;
- border: 0;
- cursor: pointer;
- @media (max-width: 700px) {
- font-size: 10px;
- padding: 0 10px;
- }
- &:before {
- content: '';
- width: 2px;
- background: ${props => props.theme.lightgrey};
- height: 100%;
- left: 0;
- position: absolute;
- transform: skew(-20deg);
- top: 0;
- bottom: 0;
- }
- &:after {
- height: 2px;
- background: red;
- content: '';
- width: 0;
- position: absolute;
- transform: translateX(-50%);
- transition: width 0.4s;
- transition-timing-function: cubic-bezier(1, -0.65, 0, 2.31);
- left: 50%;
- margin-top: 2rem;
- }
- &:hover,
- &:focus {
- outline: none;
- &:after {
- width: calc(100% - 60px);
- }
- }
- }
- @media (max-width: 1300px) {
- border-top: 1px solid ${props => props.theme.lightgrey};
- width: 100%;
- justify-content: center;
- font-size: 1.5rem;
- }
-`;
-
-export default NavStyles;