Skip to content

Commit 6ffcec2

Browse files
authored
Merge pull request #42 from line/qr-margin-top
Make the spacing between the qrCode and URL boxes wider
2 parents 49e2b23 + c7fc9a1 commit 6ffcec2

File tree

2 files changed

+9
-13
lines changed

2 files changed

+9
-13
lines changed

src/App.module.css

+5-11
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,17 @@ body {
88
margin: 20px auto;
99
}
1010

11-
.liffIdBox {
11+
.appInfo {
1212
margin: 40px 0;
13-
width: 400px;
1413
display: flex;
1514
flex-direction: column;
1615
gap: 16px;
1716
}
1817

18+
.liffIdBox {
19+
max-width: 400px;
20+
}
21+
1922
.qrCode {
2023
max-width: 128px;
2124
height: auto;
@@ -32,12 +35,3 @@ body {
3235
padding: 0 15px;
3336
}
3437
}
35-
36-
37-
@media only screen and (max-width: 480px) {
38-
.liffIdBox {
39-
width: auto;
40-
display: block;
41-
}
42-
}
43-

src/App.tsx

+4-2
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,10 @@ function App() {
2929
This “LINE MINI App Playground” is available only in Japan.
3030
</div>
3131
) : null}
32-
<div className={styles.liffIdBox}>
33-
<Input readonly value={`URL: ${appUrl}`} />
32+
<div className={styles.appInfo}>
33+
<div className={styles.liffIdBox}>
34+
<Input readonly value={`URL: ${appUrl}`} />
35+
</div>
3436
<img src={QR_IMG_MAP[filter]} className={styles.qrCode} />
3537
</div>
3638
<h1>Client APIs</h1>

0 commit comments

Comments
 (0)