diff options
-rw-r--r-- | src/features/nightlyBuilds/Component.js | 14 | ||||
-rw-r--r-- | src/features/publishDebugInfo/Component.js | 140 | ||||
-rw-r--r-- | src/styles/features.scss | 6 |
3 files changed, 75 insertions, 85 deletions
diff --git a/src/features/nightlyBuilds/Component.js b/src/features/nightlyBuilds/Component.js index 0966480d0..fc7663211 100644 --- a/src/features/nightlyBuilds/Component.js +++ b/src/features/nightlyBuilds/Component.js | |||
@@ -29,14 +29,21 @@ const messages = defineMessages({ | |||
29 | }, | 29 | }, |
30 | }); | 30 | }); |
31 | 31 | ||
32 | const styles = { | 32 | const styles = theme => ({ |
33 | modal: { | ||
34 | width: '80%', | ||
35 | maxWidth: 600, | ||
36 | background: theme.styleTypes.primary.contrast, | ||
37 | color: theme.styleTypes.primary.accent, | ||
38 | paddingTop: 30, | ||
39 | }, | ||
33 | info: { | 40 | info: { |
34 | paddingTop: 20, | ||
35 | paddingBottom: 20, | 41 | paddingBottom: 20, |
36 | }, | 42 | }, |
37 | headline: { | 43 | headline: { |
38 | fontSize: 20, | 44 | fontSize: 20, |
39 | marginBottom: 20, | 45 | marginBottom: 20, |
46 | marginTop: -27, | ||
40 | }, | 47 | }, |
41 | buttonContainer: { | 48 | buttonContainer: { |
42 | display: 'flex', | 49 | display: 'flex', |
@@ -51,7 +58,7 @@ const styles = { | |||
51 | background: '#c45a5a !important', | 58 | background: '#c45a5a !important', |
52 | color: '#ffffff !important', | 59 | color: '#ffffff !important', |
53 | }, | 60 | }, |
54 | }; | 61 | }); |
55 | 62 | ||
56 | class NightlyBuildsModal extends Component { | 63 | class NightlyBuildsModal extends Component { |
57 | close() { | 64 | close() { |
@@ -88,6 +95,7 @@ class NightlyBuildsModal extends Component { | |||
88 | return ( | 95 | return ( |
89 | <Modal | 96 | <Modal |
90 | isOpen={isModalVisible} | 97 | isOpen={isModalVisible} |
98 | className={`${classes.modal} nightly-builds`} | ||
91 | shouldCloseOnOverlayClick | 99 | shouldCloseOnOverlayClick |
92 | close={this.close.bind(this)} | 100 | close={this.close.bind(this)} |
93 | > | 101 | > |
diff --git a/src/features/publishDebugInfo/Component.js b/src/features/publishDebugInfo/Component.js index 5ffe535e0..8bdb50cb4 100644 --- a/src/features/publishDebugInfo/Component.js +++ b/src/features/publishDebugInfo/Component.js | |||
@@ -8,7 +8,7 @@ import { state as ModalState } from './store'; | |||
8 | import { H1 } from '../../components/ui/headline'; | 8 | import { H1 } from '../../components/ui/headline'; |
9 | import { sendAuthRequest } from '../../api/utils/auth'; | 9 | import { sendAuthRequest } from '../../api/utils/auth'; |
10 | import Button from '../../components/ui/Button'; | 10 | import Button from '../../components/ui/Button'; |
11 | import Input from '../../components/ui/Input'; | 11 | import { Input } from '../../components/ui/input/index'; |
12 | import Modal from '../../components/ui/Modal'; | 12 | import Modal from '../../components/ui/Modal'; |
13 | import { DEBUG_API } from '../../config'; | 13 | import { DEBUG_API } from '../../config'; |
14 | import AppStore from '../../stores/AppStore'; | 14 | import AppStore from '../../stores/AppStore'; |
@@ -50,11 +50,19 @@ const messages = defineMessages({ | |||
50 | }); | 50 | }); |
51 | 51 | ||
52 | const styles = theme => ({ | 52 | const styles = theme => ({ |
53 | container: { | 53 | modal: { |
54 | minWidth: '70vw', | 54 | width: '80%', |
55 | maxWidth: 600, | ||
56 | background: theme.styleTypes.primary.contrast, | ||
57 | color: theme.styleTypes.primary.accent, | ||
58 | paddingTop: 30, | ||
59 | }, | ||
60 | headline: { | ||
61 | fontSize: 20, | ||
62 | marginBottom: 20, | ||
63 | marginTop: -27, | ||
55 | }, | 64 | }, |
56 | info: { | 65 | info: { |
57 | paddingTop: 20, | ||
58 | paddingBottom: 20, | 66 | paddingBottom: 20, |
59 | }, | 67 | }, |
60 | link: { | 68 | link: { |
@@ -67,22 +75,6 @@ const styles = theme => ({ | |||
67 | marginTop: 10, | 75 | marginTop: 10, |
68 | cursor: 'pointer', | 76 | cursor: 'pointer', |
69 | }, | 77 | }, |
70 | url: { | ||
71 | marginTop: 20, | ||
72 | width: '100%', | ||
73 | |||
74 | '& div': { | ||
75 | fontFamily: | ||
76 | 'SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace', | ||
77 | }, | ||
78 | |||
79 | '& input': { | ||
80 | width: '100%', | ||
81 | padding: 15, | ||
82 | borderRadius: 6, | ||
83 | border: `solid 1px ${theme.styleTypes.primary.accent}`, | ||
84 | }, | ||
85 | }, | ||
86 | }); | 78 | }); |
87 | 79 | ||
88 | class PublishDebugLogModal extends Component { | 80 | class PublishDebugLogModal extends Component { |
@@ -156,66 +148,58 @@ class PublishDebugLogModal extends Component { | |||
156 | isOpen={isModalVisible} | 148 | isOpen={isModalVisible} |
157 | shouldCloseOnOverlayClick | 149 | shouldCloseOnOverlayClick |
158 | className={`${classes.modal} publish-debug`} | 150 | className={`${classes.modal} publish-debug`} |
159 | classes={{close: 'close'}} | ||
160 | close={() => this.close()} | 151 | close={() => this.close()} |
161 | > | 152 | > |
162 | <div className={classes.container}> | 153 | <H1 className={classes.headline}>{intl.formatMessage(messages.title)}</H1> |
163 | <H1>{intl.formatMessage(messages.title)}</H1> | 154 | {log && ( |
164 | {log && ( | 155 | <> |
165 | <> | 156 | <p className={classes.info}> |
166 | <p className={classes.info}> | 157 | {intl.formatMessage(messages.published)} |
167 | {intl.formatMessage(messages.published)} | 158 | </p> |
168 | </p> | 159 | <Input |
169 | <Input | 160 | showLabel={false} |
170 | className={classes.url} | 161 | value={`${DEBUG_API}/${log}`} |
171 | showLabel={false} | 162 | readonly |
172 | field={{ | 163 | /> |
173 | type: 'url', | 164 | </> |
174 | value: `${DEBUG_API}/${log}`, | 165 | )} |
175 | disabled: true, | 166 | |
176 | }} | 167 | {error && ( |
177 | readonly | 168 | <p className={classes.info}>{intl.formatMessage(messages.error)}</p> |
178 | /> | 169 | )} |
179 | </> | 170 | |
180 | )} | 171 | {!log && !error && ( |
181 | 172 | <> | |
182 | {error && ( | 173 | <p className={classes.info}> |
183 | <p className={classes.info}>{intl.formatMessage(messages.error)}</p> | 174 | {intl.formatMessage(messages.info)} |
184 | )} | 175 | </p> |
185 | 176 | ||
186 | {!log && !error && ( | 177 | <a |
187 | <> | 178 | href={`${DEBUG_API}/privacy.html`} |
188 | <p className={classes.info}> | 179 | target="_blank" |
189 | {intl.formatMessage(messages.info)} | 180 | className={classes.link} |
190 | </p> | 181 | rel="noreferrer" |
191 | 182 | > | |
192 | <a | 183 | {intl.formatMessage(messages.privacy)} |
193 | href={`${DEBUG_API}/privacy.html`} | 184 | </a> |
194 | target="_blank" | 185 | <a |
195 | className={classes.link} | 186 | href={`${DEBUG_API}/terms.html`} |
196 | rel="noreferrer" | 187 | target="_blank" |
197 | > | 188 | className={classes.link} |
198 | {intl.formatMessage(messages.privacy)} | 189 | rel="noreferrer" |
199 | </a> | 190 | > |
200 | <a | 191 | {intl.formatMessage(messages.terms)} |
201 | href={`${DEBUG_API}/terms.html`} | 192 | </a> |
202 | target="_blank" | 193 | |
203 | className={classes.link} | 194 | <Button |
204 | rel="noreferrer" | 195 | type="button" |
205 | > | 196 | label={intl.formatMessage(messages.publish)} |
206 | {intl.formatMessage(messages.terms)} | 197 | className={classes.button} |
207 | </a> | 198 | onClick={() => this.publishDebugInfo()} |
208 | 199 | disabled={isSendingLog} | |
209 | <Button | 200 | /> |
210 | type="button" | 201 | </> |
211 | label={intl.formatMessage(messages.publish)} | 202 | )} |
212 | className={classes.button} | ||
213 | onClick={() => this.publishDebugInfo()} | ||
214 | disabled={isSendingLog} | ||
215 | /> | ||
216 | </> | ||
217 | )} | ||
218 | </div> | ||
219 | </Modal> | 203 | </Modal> |
220 | ); | 204 | ); |
221 | } | 205 | } |
diff --git a/src/styles/features.scss b/src/styles/features.scss index 8b2ce3253..eacc2a79c 100644 --- a/src/styles/features.scss +++ b/src/styles/features.scss | |||
@@ -12,8 +12,6 @@ | |||
12 | } | 12 | } |
13 | } | 13 | } |
14 | 14 | ||
15 | .theme__dark .publish-debug { | 15 | .theme__dark .publish-debug, .theme__dark .nightly-builds { |
16 | .close { | 16 | background: $dark-theme-gray-darkest; |
17 | color: $dark-theme-gray-lightest; | ||
18 | } | ||
19 | } | 17 | } |