Skip to content

Commit 0d0536f

Browse files
committed
Fix vertical alignment of close button
1 parent 8dc9217 commit 0d0536f

File tree

3 files changed

+15
-14
lines changed

3 files changed

+15
-14
lines changed

packages/react-error-overlay/src/components/additional.js

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
/* @flow */
22
import { applyStyles } from '../utils/dom/css';
3-
import { groupStyle, groupElemLeft, groupElemRight } from '../styles';
3+
import {
4+
additionalChildStyle,
5+
groupStyle,
6+
groupElemLeft,
7+
groupElemRight,
8+
} from '../styles';
49
import { consumeEvent } from '../utils/dom/consumeEvent';
510
import { enableTabClick } from '../utils/dom/enableTabClick';
611

@@ -20,7 +25,9 @@ function updateAdditional(
2025
return;
2126
}
2227

23-
const span = document.createElement('span');
28+
const div = document.createElement('div');
29+
applyStyles(div, additionalChildStyle);
30+
2431
const group = document.createElement('span');
2532
applyStyles(group, groupStyle);
2633

@@ -44,12 +51,12 @@ function updateAdditional(
4451

4552
group.appendChild(left);
4653
group.appendChild(right);
47-
span.appendChild(group);
54+
div.appendChild(group);
4855

4956
const text = `${currentError} of ${totalErrors} errors on the page`;
50-
span.appendChild(document.createTextNode(text));
57+
div.appendChild(document.createTextNode(text));
5158

52-
additionalReference.appendChild(span);
59+
additionalReference.appendChild(div);
5360
}
5461

5562
export type { SwitchCallback };

packages/react-error-overlay/src/components/overlay.js

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,6 @@
11
/* @flow */
22
import { applyStyles } from '../utils/dom/css';
3-
import {
4-
containerStyle,
5-
overlayStyle,
6-
headerStyle,
7-
additionalStyle,
8-
} from '../styles';
3+
import { containerStyle, overlayStyle, headerStyle } from '../styles';
94
import { createClose } from './close';
105
import { createFrames } from './frames';
116
import { createFooter } from './footer';
@@ -42,7 +37,6 @@ function createOverlay(
4237

4338
// Create "Errors X of Y" in case of multiple errors
4439
const additional = document.createElement('div');
45-
applyStyles(additional, additionalStyle);
4640
updateAdditional(
4741
document,
4842
additional,

packages/react-error-overlay/src/styles.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ const closeButtonStyle = {
6464
top: 0,
6565
};
6666

67-
const additionalStyle = {
67+
const additionalChildStyle = {
6868
'margin-bottom': '0.5rem',
6969
};
7070

@@ -197,7 +197,7 @@ export {
197197
hintsStyle,
198198
hintStyle,
199199
closeButtonStyle,
200-
additionalStyle,
200+
additionalChildStyle,
201201
headerStyle,
202202
functionNameStyle,
203203
linkStyle,

0 commit comments

Comments
 (0)