477610627

Build Type

github

Committed by GitHub

Commit Message

<a href="https://github.com/ufersa/plataforma-sabia/commit/<a class=hub.com/ufersa/plataforma-sabia/commit/<a class="double-link" href="https://git"><a class=hub.com/ufersa/plataforma-sabia/commit/<a class="double-link" href="https://git"><a class=hub.com/ufersa/plataforma-sabia/commit/afc3f4aef0a3363001ca0d9ccdddf1cbce80d831">afc3f4aef<a href="https://github.com/ufersa/plataforma-sabia/commit/afc3f4aef0a3363001ca0d9ccdddf1cbce80d831">&quot;&gt;&amp;lt;a href=&amp;quot;https://github.com/ufersa/plataforma-sabia/commit/&lt;/a&gt;&lt;a class=&quot;double-link&quot; href=&quot;https://github.com/ufersa/plataforma-sabia/commit/&amp;lt;a class=&amp;quot;double-link&amp;quot; href=&amp;quot;https://git&quot;&gt;&amp;lt;a class=&lt;/a&gt;hub.com/ufersa/plataforma-sabia/commit/afc3f4aef0a3363001ca0d9ccdddf1cbce80d831&quot;&gt;afc3f4aef&lt;/a&gt;&lt;a href=&quot;https://github.com/ufersa/plataforma-sabia/commit/afc3f4aef0a3363001ca0d9ccdddf1cbce80d831&quot;&gt;&amp;lt;a href=&amp;quot;https://github.com/ufersa/plataforma-sabia/commit/afc3f4aef0a3363001ca0d9ccdddf1cb&lt;/a&gt;ce80d831&quot;>&quot;&gt;Merge &lt;/a&gt;&lt;a class=&quot;double-link&quot; href=&quot;https://github.com/ufersa/plataforma-sabia/commit/&lt;a class=&quot;double-link&quot; href=&quot;https://github.com/ufersa/plataforma-sabia/commit/<a class="double-link" href="https://github.com/ufersa/plataforma-sabia/commit/74e6507b2c723aa591583d16f29fd7e505ff6123">74e6507b2</a><a href="https://github.com/ufersa/plataforma-sabia/commit/afc3f4aef0a3363001ca0d9ccdddf1cbce80d831">&amp;quot;&amp;gt;74e6507b2&amp;lt;/a&amp;gt;&amp;quot;&amp;gt;74e6507b2&amp;lt;/a&amp;gt;&amp;lt;a href=&amp;quot;https://github.com/ufersa/plataforma-sabia/commit/afc3f4aef0a3363001ca0d9ccdddf1cbce80d&lt;/a&gt;831&quot;&gt; into &lt;/a&gt;&lt;a class=&quot;double-link&quot; href=&quot;https://github.com/ufersa/plataforma-sabia/commit/<a class="double-link" href="https://github.com/ufersa/plataforma-sabia/commit/25106da71">25106da71">25106da71</a>

Pull Request Pull Request #744: Integrate researcher chat with API

Run Details

1505 of 4218 branches covered (35.68%)

Branch coverage included in aggregate %.

62 of 62 new or added lines in 6 files covered. (100.0%)

5829 of 9786 relevant lines covered (59.56%)

18.01 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/packages/web/components/OrderMessages/styles.js

import styled, { css } from 'styled-components';
import { Loader } from '../Loading/styles';

export const Container = styled.form`
        ${({ theme: { colors, metrics, screens } }) => css`
                padding-top: 3rem;
                height: 80vh;
                width: 100%;
                display: flex;

                > div:first-child {
                        display: flex;
                        flex-direction: column;
                        background-color: ${colors.white};
                        border-radius: ${metrics.baseRadius}rem;
                        box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.15);
                        flex-grow: 1;
                }

                @media screen and (max-width: ${screens.medium}px) {
                        flex-direction: column;
                        height: auto;

                        > div:first-child {
                                order: 2;
                        }
                }
        `}
`;

export const ChatHeader = styled.div`
        ${({ theme: { colors } }) => css`
                display: flex;
                justify-content: space-between;
                padding: 0.8rem;
                border-bottom: 1px solid ${colors.lightGray4};
        `}
`;

export const Spinner = styled(Loader).attrs({ height: '100%' })``;

export const MessagesWrapper = styled.div`
        height: 100%;
        overflow-y: scroll;
        padding: 3.2rem;
        padding-top: 1.2rem;
`;

export const MessageBlock = styled.div`
        ${({ theme: { colors } }) => css`
                display: flex;
                flex-direction: column;

                > span {
                        color: ${colors.lightGray2};
                        font-size: 1.2rem;
                        font-weight: 500;
                        line-height: 1.6rem;
                        margin-bottom: 2rem;
                        text-align: center;
                }
        `}
`;

export const MessageContent = styled.div`
        ${({ theme: { colors, metrics } }) => css`
                display: flex;
                flex-direction: column;

                > p {
                        border-radius: ${metrics.baseRadius * 2}rem;
                        border-top-left-radius: 0;
                        background-color: ${colors.lightGray4};
                        font-size: 1.4rem;
                        font-weight: 500;
                        line-height: 2.4rem;
                        color: ${colors.black};
                        padding: 0.8rem;
                        margin: 0 0.8rem 0.8rem;
                }

                > span {
                        color: ${colors.lightGray2};
                        font-weight: 500;
                        font-size: 1.2rem;
                        line-height: 1.6rem;
                        align-self: flex-end;
                        margin-right: 0.8rem;
                }
        `}
`;

export const SingleMessage = styled.div`
        ${({ theme: { colors, metrics }, ownMessage }) => css`
                display: flex;
                align-items: center;
                margin: 1.6rem 0;

                > img {
                        border-radius: 50%;
                        max-width: 3.2rem;
                        align-self: flex-start;
                }

                ${!!ownMessage &&
                        css`
                                align-self: flex-end;

                                > img {
                                        order: 2;
                                }

                                ${MessageContent} {
                                        > p {
                                                color: ${colors.white};
                                                background-color: ${colors.blue};
                                                border-top-left-radius: ${metrics.baseRadius * 2}rem;
                                                border-top-right-radius: 0;
                                        }

                                        > span {
                                                margin-left: 0.8rem;
                                                align-self: flex-start;
                                        }
                                }
                        `}
        `}
`;

export const Button = styled.button`
        ${({ theme: { colors }, variant, margin }) => css`
                border: none;
                outline: none;
                background: none;
                white-space: nowrap;

                display: flex;
                align-items: center;
                align-self: center;
                color: ${colors.secondary};
                padding: 0.4rem 0.8rem;
                max-width: max-content;

                text-transform: uppercase;
                font-weight: bold;
                font-size: 1.4rem;
                line-height: 2.4rem;

                margin: ${margin};

                :hover:not(:disabled) {
                        color: ${colors.white};
                        background: ${colors.secondary};
                }

                :disabled {
                        cursor: not-allowed;
                        opacity: 0.5;
                }

                :focus {
                        box-shadow: 0px 0px 4px 2px ${colors.primary};
                }

                ${variant === 'contained' &&
                        css`
                                background: ${colors.secondary};
                                color: ${colors.white};
                                margin-top: 0.6rem;
                                align-self: flex-start;

                                :hover:not(:disabled) {
                                        opacity: 0.8;
                                }
                        `}
        `}
`;

export const OrderDetails = styled.div`
        ${({ theme: { screens } }) => css`
                padding: 2.4rem 3.2rem 1.4rem;

                @media screen and (max-width: ${screens.medium}px) {
                        padding: 2.4rem 0 1.4rem;
                }
        `}
`;

export const UserDetails = styled.div`
        ${({ theme: { colors } }) => css`
                display: flex;
                align-items: center;

                > img {
                        border-radius: 50%;
                        border: 2px solid ${colors.secondary};
                        max-width: 4.8rem;
                }

                > div {
                        font-size: 1.4rem;
                        font-weight: 500;
                        line-height: 2.4rem;
                        margin-left: 1.6rem;

                        p:first-child {
                                color: ${colors.lightGray2};
                        }

                        p:last-child {
                                color: ${colors.black};
                        }
                }
        `}
`;

export const Technology = styled.div`
        ${({ theme: { metrics, colors } }) => css`
                margin-top: 6.4rem;

                > p:first-child {
                        color: ${colors.lightGray2};
                        margin-bottom: 1.6rem;
                        font-size: 1.4rem;
                        line-height: 2.4rem;
                        font-weight: 500;
                }

                > div {
                        display: flex;
                        flex-wrap: wrap;

                        > img {
                                max-width: 14rem;
                                border-radius: ${metrics.baseRadius}rem;
                                margin-right: 1.6rem;
                                margin-bottom: 1rem;
                        }
                }
        `}
`;

export const TechnologyDetails = styled.div`
        ${({ theme: { colors } }) => css`
                > p:first-child {
                        color: ${colors.black};
                        font-size: 1.6rem;
                        font-weight: 500;
                        line-height: 2.4rem;
                        margin-bottom: 0.8rem;
                }

                > p:nth-of-type(2),
                > p:last-of-type {
                        color: ${colors.lightGray2};
                        font-size: 1.2rem;
                        font-weight: 500;
                        line-height: 1.6rem;
                        margin-bottom: 0.4rem;
                }
        `}
`;

export const Actions = styled.div`
        display: flex;
        padding: 1.6rem;

        > div {
                width: 100%;
                margin-right: 1.6rem;
        }
`;

1	import styled, { css } from 'styled-components';
2	import { Loader } from '../Loading/styles';
3
4	export const Container = styled.form`	×
5	${({ theme: { colors, metrics, screens } }) => css`	×
6	padding-top: 3rem;
7	height: 80vh;
8	width: 100%;
9	display: flex;
10
11	> div:first-child {
12	display: flex;
13	flex-direction: column;
14	background-color: ${colors.white};
15	border-radius: ${metrics.baseRadius}rem;
16	box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.15);
17	flex-grow: 1;
18	}
19
20	@media screen and (max-width: ${screens.medium}px) {
21	flex-direction: column;
22	height: auto;
23
24	> div:first-child {
25	order: 2;
26	}
27	}
28	`}
29	`;
30
31	export const ChatHeader = styled.div`	×
32	${({ theme: { colors } }) => css`	×
33	display: flex;
34	justify-content: space-between;
35	padding: 0.8rem;
36	border-bottom: 1px solid ${colors.lightGray4};
37	`}
38	`;
39
40	export const Spinner = styled(Loader).attrs({ height: '100%' })``;	×
41
42	export const MessagesWrapper = styled.div`	×
43	height: 100%;
44	overflow-y: scroll;
45	padding: 3.2rem;
46	padding-top: 1.2rem;
47	`;
48
49	export const MessageBlock = styled.div`	×
50	${({ theme: { colors } }) => css`	×
51	display: flex;
52	flex-direction: column;
53
54	> span {
55	color: ${colors.lightGray2};
56	font-size: 1.2rem;
57	font-weight: 500;
58	line-height: 1.6rem;
59	margin-bottom: 2rem;
60	text-align: center;
61	}
62	`}
63	`;
64
65	export const MessageContent = styled.div`	×
66	${({ theme: { colors, metrics } }) => css`	×
67	display: flex;
68	flex-direction: column;
69
70	> p {
71	border-radius: ${metrics.baseRadius * 2}rem;
72	border-top-left-radius: 0;
73	background-color: ${colors.lightGray4};
74	font-size: 1.4rem;
75	font-weight: 500;
76	line-height: 2.4rem;
77	color: ${colors.black};
78	padding: 0.8rem;
79	margin: 0 0.8rem 0.8rem;
80	}
81
82	> span {
83	color: ${colors.lightGray2};
84	font-weight: 500;
85	font-size: 1.2rem;
86	line-height: 1.6rem;
87	align-self: flex-end;
88	margin-right: 0.8rem;
89	}
90	`}
91	`;
92
93	export const SingleMessage = styled.div`	×
94	${({ theme: { colors, metrics }, ownMessage }) => css`	×
95	display: flex;
96	align-items: center;
97	margin: 1.6rem 0;
98
99	> img {
100	border-radius: 50%;
101	max-width: 3.2rem;
102	align-self: flex-start;
103	}
104
105	${!!ownMessage &&	×
106	css`
107	align-self: flex-end;
108
109	> img {
110	order: 2;
111	}
112
113	${MessageContent} {
114	> p {
115	color: ${colors.white};
116	background-color: ${colors.blue};
117	border-top-left-radius: ${metrics.baseRadius * 2}rem;
118	border-top-right-radius: 0;
119	}
120
121	> span {
122	margin-left: 0.8rem;
123	align-self: flex-start;
124	}
125	}
126	`}
127	`}
128	`;
129
130	export const Button = styled.button`	×
131	${({ theme: { colors }, variant, margin }) => css`	×
132	border: none;
133	outline: none;
134	background: none;
135	white-space: nowrap;
136
137	display: flex;
138	align-items: center;
139	align-self: center;
140	color: ${colors.secondary};
141	padding: 0.4rem 0.8rem;
142	max-width: max-content;
143
144	text-transform: uppercase;
145	font-weight: bold;
146	font-size: 1.4rem;
147	line-height: 2.4rem;
148
149	margin: ${margin};
150
151	:hover:not(:disabled) {
152	color: ${colors.white};
153	background: ${colors.secondary};
154	}
155
156	:disabled {
157	cursor: not-allowed;
158	opacity: 0.5;
159	}
160
161	:focus {
162	box-shadow: 0px 0px 4px 2px ${colors.primary};
163	}
164
165	${variant === 'contained' &&	×
166	css`
167	background: ${colors.secondary};
168	color: ${colors.white};
169	margin-top: 0.6rem;
170	align-self: flex-start;
171
172	:hover:not(:disabled) {
173	opacity: 0.8;
174	}
175	`}
176	`}
177	`;
178
179	export const OrderDetails = styled.div`	×
180	${({ theme: { screens } }) => css`	×
181	padding: 2.4rem 3.2rem 1.4rem;
182
183	@media screen and (max-width: ${screens.medium}px) {
184	padding: 2.4rem 0 1.4rem;
185	}
186	`}
187	`;
188
189	export const UserDetails = styled.div`	×
190	${({ theme: { colors } }) => css`	×
191	display: flex;
192	align-items: center;
193
194	> img {
195	border-radius: 50%;
196	border: 2px solid ${colors.secondary};
197	max-width: 4.8rem;
198	}
199
200	> div {
201	font-size: 1.4rem;
202	font-weight: 500;
203	line-height: 2.4rem;
204	margin-left: 1.6rem;
205
206	p:first-child {
207	color: ${colors.lightGray2};
208	}
209
210	p:last-child {
211	color: ${colors.black};
212	}
213	}
214	`}
215	`;
216
217	export const Technology = styled.div`	×
218	${({ theme: { metrics, colors } }) => css`	×
219	margin-top: 6.4rem;
220
221	> p:first-child {
222	color: ${colors.lightGray2};
223	margin-bottom: 1.6rem;
224	font-size: 1.4rem;
225	line-height: 2.4rem;
226	font-weight: 500;
227	}
228
229	> div {
230	display: flex;
231	flex-wrap: wrap;
232
233	> img {
234	max-width: 14rem;
235	border-radius: ${metrics.baseRadius}rem;
236	margin-right: 1.6rem;
237	margin-bottom: 1rem;
238	}
239	}
240	`}
241	`;
242
243	export const TechnologyDetails = styled.div`	×
244	${({ theme: { colors } }) => css`	×
245	> p:first-child {
246	color: ${colors.black};
247	font-size: 1.6rem;
248	font-weight: 500;
249	line-height: 2.4rem;
250	margin-bottom: 0.8rem;
251	}
252
253	> p:nth-of-type(2),
254	> p:last-of-type {
255	color: ${colors.lightGray2};
256	font-size: 1.2rem;
257	font-weight: 500;
258	line-height: 1.6rem;
259	margin-bottom: 0.4rem;
260	}
261	`}
262	`;
263
264	export const Actions = styled.div`	×
265	display: flex;
266	padding: 1.6rem;
267
268	> div {
269	width: 100%;
270	margin-right: 1.6rem;
271	}
272	`;

ufersa / plataforma-sabia / 477610627

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous