55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || File | 64 |65 | | Statements | 66 |67 | | Branches | 68 |69 | | Functions | 70 |71 | | Lines | 72 |73 | |
|---|---|---|---|---|---|---|---|---|---|
| ModernDatepicker.js | 77 |
78 |
79 | |
80 | 60.76% | 81 |96/158 | 82 |52.61% | 83 |212/403 | 84 |37.04% | 85 |10/27 | 86 |60.26% | 87 |94/156 | 88 |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 67 | 8 68 | 9 69 | 10 70 | 11 71 | 12 72 | 13 73 | 14 74 | 15 75 | 16 76 | 17 77 | 18 78 | 19 79 | 20 80 | 21 81 | 22 | 82 | 1x 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | | import styled from 'styled-components';
103 | const CalendarContainer = styled.div.attrs({
104 | // we can define static props
105 | tabIndex: '1'
106 | })`
107 | width : 100%;
108 | user-select: none;
109 | height : 315px;
110 | max-width : 325px;
111 | min-width: 315px;
112 | max-height : 315px;
113 | position : absolute;
114 | top : 100%;
115 | background-color : ${props => props.secondaryColor};
116 | border: solid 1px #f4f4f4;
117 | border-radius: 6px;
118 | &:focus{
119 | outline : none;
120 | }
121 | `;
122 | export default CalendarContainer;
123 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 67 | 8 68 | 9 69 | 10 70 | 11 71 | 12 72 | 13 | 73 | 1x 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | | import styled from 'styled-components';
85 | const CalendarHeading = styled.div`
86 | width : 100%;
87 | height : 64px;
88 | max-width : 325px;
89 | max-height : 64px;
90 | position : relative;
91 | background-color : ${props => props.secondaryColor};
92 | border-bottom: solid 1px #f4f4f4;
93 | border-radius: 6px;
94 | `;
95 | export default CalendarHeading;
96 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 67 | 8 | 68 | 1x 69 | 70 | 71 | 72 | 73 | 74 | | import styled from 'styled-components'; 75 | const Container = styled.div` 76 | width : 100%; 77 | position : relative; 78 | font-family: 'Open Sans', sans-serif; 79 | `; 80 | export default Container; 81 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 | 67 | 1x 68 | 69 | 70 | 71 | 72 | | import styled from 'styled-components'; 73 | const Header = styled.div` 74 | width:100%; 75 | text-align : left; 76 | `; 77 | export default Header; 78 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 67 | 8 68 | 9 69 | 10 70 | 11 71 | 12 72 | 13 73 | 14 74 | 15 75 | 16 76 | 17 77 | 18 78 | 19 79 | 20 80 | 21 81 | 22 82 | 23 83 | 24 84 | 25 85 | 26 86 | 27 87 | 28 88 | 29 89 | 30 90 | 31 91 | 32 | 92 | 93 | 94 | 95 | 1x 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 1x 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 1x 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | | import styled from 'styled-components'; 123 | import React from 'react'; 124 | import PropTypes from 'prop-types'; 125 | 126 | const Img = styled.img` 127 | width: 22px; 128 | height: 22px; 129 | position : absolute; 130 | cursor: pointer; 131 | bottom: 3px; 132 | margin: auto; 133 | right: 10px; 134 | `; 135 | 136 | const Icon = props => { 137 | return ( 138 | <Img 139 | {...props} 140 | className={props.className} 141 | src={props.icon} 142 | /> 143 | ); 144 | }; 145 | Icon.propTypes = { 146 | className: PropTypes.oneOfType([ 147 | PropTypes.string, 148 | PropTypes.object 149 | ]), 150 | icon: PropTypes.string.isRequired 151 | }; 152 | export default Icon; 153 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 67 | 8 68 | 9 69 | 10 70 | 11 71 | 12 72 | 13 73 | 14 74 | 15 75 | 16 76 | 17 77 | 18 78 | 19 79 | 20 80 | 21 81 | 22 82 | 23 83 | 24 84 | 25 85 | 26 86 | 27 87 | 28 88 | 29 89 | 30 90 | 31 91 | 32 92 | 33 93 | 34 94 | 35 | 95 | 96 | 97 | 98 | 1x 99 | 100 | 101 | 102 | 103 | 1x 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 1x 112 | 1x 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 1x 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | | import styled from 'styled-components';
129 | import React from 'react';
130 | import PropTypes from 'prop-types';
131 |
132 | const DInput = styled.input`
133 | width:100%;
134 | padding: 5px;
135 | color: black;
136 | background: white;
137 | border: ${props => !props.showBorder ? 'none' : '1px solid'};
138 | border-radius: 3px;
139 | box-sizing : border-box;
140 | &:focus {
141 | outline: none;
142 | }
143 | `;
144 |
145 | const Input = props => {
146 | return (
147 | <DInput
148 | {...props}
149 | className={props.className}
150 | />
151 | );
152 | };
153 |
154 | Input.propTypes = {
155 | className: PropTypes.oneOfType([
156 | PropTypes.string,
157 | PropTypes.object
158 | ])
159 | };
160 |
161 | export default Input;
162 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 67 | 8 68 | 9 69 | 10 70 | 11 71 | 12 72 | 13 73 | 14 74 | 15 75 | 16 76 | 17 77 | 18 78 | 19 79 | 20 80 | 21 81 | 22 82 | 23 83 | 24 84 | 25 | 85 | 86 | 87 | 1x 88 | 89 | 90 | 91 | 1x 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 1x 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | | import styled from 'styled-components'; 109 | import React from 'react'; 110 | import PropTypes from 'prop-types'; 111 | const DLabel = styled.label` 112 | font-size: 15px; 113 | color: #000; 114 | `; 115 | const Label = props => { 116 | return ( 117 | <DLabel 118 | {...props} 119 | className={props.className} 120 | /> 121 | ); 122 | }; 123 | 124 | Label.propTypes = { 125 | className: PropTypes.oneOfType([ 126 | PropTypes.string, 127 | PropTypes.object 128 | ]) 129 | }; 130 | 131 | export default Label; 132 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 67 | 8 68 | 9 69 | 10 70 | 11 71 | 12 72 | 13 73 | 14 74 | 15 75 | 16 76 | 17 77 | 18 78 | 19 79 | 20 80 | 21 81 | 22 82 | 23 83 | 24 84 | 25 85 | 26 86 | 27 87 | 28 88 | 29 89 | 30 90 | 31 91 | 32 92 | 33 93 | 34 94 | 35 95 | 36 96 | 37 97 | 38 98 | 39 99 | 40 100 | 41 | 101 | 1x 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | | import styled from 'styled-components';
141 | const SingleArrow = styled.span`
142 | width: 22px;
143 | height: 22px;
144 | border-radius: 11.3px;
145 | background-color: ${props => props.secondaryColor};
146 | display: inline-block;
147 | position : absolute;
148 | top: 0;
149 | cursor: pointer;
150 | bottom: 0;
151 | margin: auto;
152 | color: #b8c2cb;
153 | font-weight: bold;
154 | opacity: 0.4;
155 | border-radius: 50%;
156 | border: ${props => '2px solid ' + props.primaryTextColor};
157 | ${props => props.left ? 'left' : 'right'} : 40px;
158 | &:after {
159 | content: '';
160 | display: inline-block;
161 | margin-top: 1px;
162 | margin-left: ${props => props.left ? '8px' : '6px'} ;
163 | width: 5px;
164 | height: 5px;
165 | border-top: ${props => '2px solid ' + props.primaryTextColor};
166 | border-right: ${props => '2px solid ' + props.primaryTextColor};
167 | -moz-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
168 | -webkit-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
169 | transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
170 | position: absolute;
171 | top: 0;
172 | right: 0;
173 | left: 0;
174 | bottom: 0;
175 | margin: auto;
176 | }
177 | `;
178 |
179 | export default SingleArrow;
180 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 67 | 8 68 | 9 69 | 10 70 | 11 71 | 12 72 | 13 73 | 14 74 | 15 | 75 | 1x 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | | import styled from 'styled-components'; 89 | const Span = styled.span` 90 | font-size: 14px; 91 | text-align: center; 92 | color: #222222; 93 | width:40px; 94 | height:40px; 95 | margin:15px; 96 | display:inline-block; 97 | line-height: 40px; 98 | cursor : pointer; 99 | overflow : auto; 100 | `; 101 | export default Span; 102 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || 1 61 | 2 62 | 3 63 | 4 64 | 5 65 | 6 66 | 7 67 | 8 68 | 9 69 | 10 70 | 11 71 | 12 72 | 13 73 | 14 74 | 15 75 | 16 76 | 17 | 77 | 1x 78 | 79 | 80 | 81 | 1x 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | | import styled, { keyframes } from 'styled-components';
93 | const fadeinout = keyframes`
94 | 0% { opacity: 0; }
95 | 50% { opacity: 1; }
96 | `;
97 | const Wrapper = styled.div`
98 | width: 100%;
99 | height: 250px;
100 | max-width: 280px;
101 | background: ${props => props.secondaryColor};
102 | text-align: center;
103 | box-sizing: border-box;
104 | margin: 0 auto;
105 | animation: ${fadeinout} .5s linear 1 forwards;
106 | `;
107 | export default Wrapper;
108 | |
55 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 56 |
57 || File | 64 |65 | | Statements | 66 |67 | | Branches | 68 |69 | | Functions | 70 |71 | | Lines | 72 |73 | |
|---|---|---|---|---|---|---|---|---|---|
| components | 77 |
78 |
79 | |
80 | 60.76% | 81 |96/158 | 82 |52.61% | 83 |212/403 | 84 |37.04% | 85 |10/27 | 86 |60.26% | 87 |94/156 | 88 |
| elements | 92 |
93 |
94 | |
95 | 30.53% | 96 |58/190 | 97 |0.33% | 98 |1/299 | 99 |2.9% | 100 |2/69 | 101 |31.52% | 102 |58/184 | 103 |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || File | 53 |54 | | Statements | 55 |56 | | Branches | 57 |58 | | Functions | 59 |60 | | Lines | 61 |62 | |
|---|---|---|---|---|---|---|---|---|---|
| ModernDatepicker.js | 66 |44.37% | 68 |63/142 | 69 |41.55% | 70 |155/373 | 71 |32% | 72 |8/25 | 73 |45% | 74 |63/140 | 75 |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 64 | 16 65 | 17 66 | 18 67 | 19 68 | 20 69 | 21 70 | 22 | 71 | 1x 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | | import styled from 'styled-components';
92 | const CalendarContainer = styled.div.attrs({
93 | // we can define static props
94 | tabIndex: '1'
95 | })`
96 | width : 100%;
97 | user-select: none;
98 | height : 315px;
99 | max-width : 325px;
100 | min-width: 315px;
101 | max-height : 315px;
102 | position : absolute;
103 | top : 100%;
104 | background-color : ${props => props.secondaryColor};
105 | border: solid 1px #f4f4f4;
106 | border-radius: 6px;
107 | &:focus{
108 | outline : none;
109 | }
110 | `;
111 | export default CalendarContainer;
112 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 | 62 | 1x 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | | import styled from 'styled-components';
74 | const CalendarHeading = styled.div`
75 | width : 100%;
76 | height : 64px;
77 | max-width : 325px;
78 | max-height : 64px;
79 | position : relative;
80 | background-color : ${props => props.secondaryColor};
81 | border-bottom: solid 1px #f4f4f4;
82 | border-radius: 6px;
83 | `;
84 | export default CalendarHeading;
85 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 | 57 | 1x 58 | 59 | 60 | 61 | 62 | 63 | | import styled from 'styled-components'; 64 | const Container = styled.div` 65 | width : 100%; 66 | position : relative; 67 | font-family: 'Open Sans', sans-serif; 68 | `; 69 | export default Container; 70 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 64 | 16 65 | 17 66 | 18 67 | 19 68 | 20 69 | 21 70 | 22 71 | 23 72 | 24 73 | 25 74 | 26 75 | 27 76 | 28 77 | 29 78 | 30 79 | 31 80 | 32 81 | 33 82 | 34 83 | 35 84 | 36 85 | 37 86 | 38 87 | 39 88 | 40 89 | 41 90 | 42 91 | 43 92 | 44 93 | 45 | 94 | 1x 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | | import styled from 'styled-components';
138 | const DoubleArrow = styled.span`
139 | width: 22px;
140 | height: 22px;
141 | border-radius: 11.3px;
142 | background-color: ${props => props.secondaryColor};
143 | display: inline-block;
144 | position : absolute;
145 | top: 0;
146 | cursor: pointer;
147 | bottom: 0;
148 | margin: auto;
149 | color: #b8c2cb;
150 | font-weight: bold;
151 | opacity: 0.4;
152 | ${props => props.left ? 'left' : 'right'} : 7px;
153 | border-radius: 50%;
154 | border: ${props => '2px solid ' + props.primaryTextColor};
155 | &:after, &:before {
156 | content: '';
157 | display: inline-block;
158 | width: 5px;
159 | height: 5px;
160 | border-top: ${props => '2px solid ' + props.primaryTextColor};
161 | border-right: ${props => '2px solid ' + props.primaryTextColor};
162 | -moz-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
163 | -webkit-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
164 | transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
165 | position: absolute;
166 | top: 0;
167 | right: 0;
168 | left: 0;
169 | bottom: 0;
170 | margin: auto;
171 | }
172 | &:after{
173 | margin-left: 5px;
174 | }
175 | &:before{
176 | margin-right: 5px;
177 | }
178 | `;
179 |
180 | export default DoubleArrow;
181 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 | 56 | 1x 57 | 58 | 59 | 60 | 61 | | import styled from 'styled-components'; 62 | const Header = styled.div` 63 | width:100%; 64 | text-align : left; 65 | `; 66 | export default Header; 67 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 64 | 16 65 | 17 66 | 18 67 | 19 68 | 20 69 | 21 70 | 22 71 | 23 72 | 24 73 | 25 74 | 26 75 | 27 76 | 28 77 | 29 78 | 30 79 | 31 80 | 32 | 81 | 82 | 83 | 84 | 1x 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 1x 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 1x 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | | import styled from 'styled-components'; 112 | import React from 'react'; 113 | import PropTypes from 'prop-types'; 114 | 115 | const Img = styled.img` 116 | width: 22px; 117 | height: 22px; 118 | position : absolute; 119 | cursor: pointer; 120 | bottom: 3px; 121 | margin: auto; 122 | right: 10px; 123 | `; 124 | 125 | const Icon = props => { 126 | return ( 127 | <Img 128 | {...props} 129 | className={props.className} 130 | src={props.icon} 131 | /> 132 | ); 133 | }; 134 | Icon.propTypes = { 135 | className: PropTypes.oneOfType([ 136 | PropTypes.string, 137 | PropTypes.object 138 | ]), 139 | icon: PropTypes.string.isRequired 140 | }; 141 | export default Icon; 142 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 64 | 16 65 | 17 66 | 18 67 | 19 68 | 20 69 | 21 70 | 22 71 | 23 72 | 24 73 | 25 74 | 26 75 | 27 76 | 28 77 | 29 78 | 30 79 | 31 80 | 32 81 | 33 82 | 34 83 | 35 | 84 | 85 | 86 | 87 | 1x 88 | 89 | 90 | 91 | 92 | 1x 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 1x 101 | 1x 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 1x 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | | import styled from 'styled-components';
118 | import React from 'react';
119 | import PropTypes from 'prop-types';
120 |
121 | const DInput = styled.input`
122 | width:100%;
123 | padding: 5px;
124 | color: black;
125 | background: white;
126 | border: ${props => !props.showBorder ? 'none' : '1px solid'};
127 | border-radius: 3px;
128 | box-sizing : border-box;
129 | &:focus {
130 | outline: none;
131 | }
132 | `;
133 |
134 | const Input = props => {
135 | return (
136 | <DInput
137 | {...props}
138 | className={props.className}
139 | />
140 | );
141 | };
142 |
143 | Input.propTypes = {
144 | className: PropTypes.oneOfType([
145 | PropTypes.string,
146 | PropTypes.object
147 | ])
148 | };
149 |
150 | export default Input;
151 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 64 | 16 65 | 17 66 | 18 67 | 19 68 | 20 69 | 21 70 | 22 71 | 23 72 | 24 73 | 25 | 74 | 75 | 76 | 1x 77 | 78 | 79 | 80 | 1x 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 1x 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | | import styled from 'styled-components'; 98 | import React from 'react'; 99 | import PropTypes from 'prop-types'; 100 | const DLabel = styled.label` 101 | font-size: 15px; 102 | color: #000; 103 | `; 104 | const Label = props => { 105 | return ( 106 | <DLabel 107 | {...props} 108 | className={props.className} 109 | /> 110 | ); 111 | }; 112 | 113 | Label.propTypes = { 114 | className: PropTypes.oneOfType([ 115 | PropTypes.string, 116 | PropTypes.object 117 | ]) 118 | }; 119 | 120 | export default Label; 121 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 64 | 16 65 | 17 66 | 18 67 | 19 68 | 20 69 | 21 70 | 22 71 | 23 72 | 24 73 | 25 74 | 26 75 | 27 76 | 28 77 | 29 78 | 30 79 | 31 80 | 32 81 | 33 82 | 34 83 | 35 84 | 36 85 | 37 86 | 38 87 | 39 88 | 40 89 | 41 | 90 | 1x 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | | import styled from 'styled-components';
130 | const SingleArrow = styled.span`
131 | width: 22px;
132 | height: 22px;
133 | border-radius: 11.3px;
134 | background-color: ${props => props.secondaryColor};
135 | display: inline-block;
136 | position : absolute;
137 | top: 0;
138 | cursor: pointer;
139 | bottom: 0;
140 | margin: auto;
141 | color: #b8c2cb;
142 | font-weight: bold;
143 | opacity: 0.4;
144 | border-radius: 50%;
145 | border: ${props => '2px solid ' + props.primaryTextColor};
146 | ${props => props.left ? 'left' : 'right'} : 40px;
147 | &:after {
148 | content: '';
149 | display: inline-block;
150 | margin-top: 1px;
151 | margin-left: ${props => props.left ? '8px' : '6px'} ;
152 | width: 5px;
153 | height: 5px;
154 | border-top: ${props => '2px solid ' + props.primaryTextColor};
155 | border-right: ${props => '2px solid ' + props.primaryTextColor};
156 | -moz-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
157 | -webkit-transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
158 | transform: ${props => props.left ? 'rotate(-135deg)' : 'rotate(45deg)'} ;
159 | position: absolute;
160 | top: 0;
161 | right: 0;
162 | left: 0;
163 | bottom: 0;
164 | margin: auto;
165 | }
166 | `;
167 |
168 | export default SingleArrow;
169 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 | 64 | 1x 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | | import styled from 'styled-components'; 78 | const Span = styled.span` 79 | font-size: 14px; 80 | text-align: center; 81 | color: #222222; 82 | width:40px; 83 | height:40px; 84 | margin:15px; 85 | display:inline-block; 86 | line-height: 40px; 87 | cursor : pointer; 88 | overflow : auto; 89 | `; 90 | export default Span; 91 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 64 | 16 65 | 17 | 66 | 1x 67 | 68 | 69 | 70 | 1x 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | | import styled, { keyframes } from 'styled-components';
82 | const fadeinout = keyframes`
83 | 0% { opacity: 0; }
84 | 50% { opacity: 1; }
85 | `;
86 | const Wrapper = styled.div`
87 | width: 100%;
88 | height: 250px;
89 | max-width: 280px;
90 | background: ${props => props.secondaryColor};
91 | text-align: center;
92 | box-sizing: border-box;
93 | margin: 0 auto;
94 | animation: ${fadeinout} .5s linear 1 forwards;
95 | `;
96 | export default Wrapper;
97 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || File | 53 |54 | | Statements | 55 |56 | | Branches | 57 |58 | | Functions | 59 |60 | | Lines | 61 |62 | |
|---|---|---|---|---|---|---|---|---|---|
| components | 66 |44.37% | 68 |63/142 | 69 |41.55% | 70 |155/373 | 71 |32% | 72 |8/25 | 73 |45% | 74 |63/140 | 75 ||
| elements | 79 |30.53% | 81 |58/190 | 82 |0.34% | 83 |1/298 | 84 |2.9% | 85 |2/69 | 86 |31.52% | 87 |58/184 | 88 |