Showing
2 changed files
with
80 additions
and
0 deletions
public/2.jpg
0 → 100644
267 KB
public/main.css
0 → 100644
1 | +* { box-sizing: border-box; } | ||
2 | +html, body { | ||
3 | + padding: 0; | ||
4 | + margin: 0; | ||
5 | + height: 100%; | ||
6 | + background-image: url("2.jpg"); | ||
7 | + background-repeat: no-repeat; | ||
8 | + background-position: center bottom; | ||
9 | +} | ||
10 | +.btn { | ||
11 | + display: inline-block; | ||
12 | + padding: 0 5px; | ||
13 | + text-decoration: none; | ||
14 | + cursor: pointer; | ||
15 | + border-radius: 4px; | ||
16 | + background: white; | ||
17 | + border: 3px solid #ffe9a6; | ||
18 | + color: crimson; | ||
19 | + height: 37px; | ||
20 | + width: 80px; | ||
21 | + line-height: 37px; | ||
22 | + vertical-align: top; | ||
23 | + font-size: 20px; | ||
24 | + text-align: center; | ||
25 | +} | ||
26 | +html, h1{font-family: 'Song Myung';} | ||
27 | +html, h2{font-family: 'Yeon Sung';} | ||
28 | +input, textarea { | ||
29 | + border-radius: 4px; | ||
30 | + height: 37px; | ||
31 | + padding: 10px; | ||
32 | + border: 1px solid silver; | ||
33 | +} | ||
34 | +.container { width: 100%; height: 100%; } | ||
35 | +@media screen and (min-width: 800px) { | ||
36 | + .container { width: 800px; margin: auto; padding-top: 30px} | ||
37 | +} | ||
38 | +.input-group { margin-bottom: 15px; } | ||
39 | +.input-group label { width: 25%; display: inline-block; } | ||
40 | +.input-group input { width: 70%; } | ||
41 | +#join { float: right; } | ||
42 | +.profile-wrap { | ||
43 | + width: 100%; | ||
44 | + display: inline-block; | ||
45 | + vertical-align: top; | ||
46 | + margin: 10px 0; | ||
47 | +} | ||
48 | +@media screen and (min-width: 800px) { | ||
49 | + .profile-wrap { width: 290px; margin-bottom: 0;} | ||
50 | +} | ||
51 | +.profile { | ||
52 | + text-align: left; | ||
53 | + padding: 20px; | ||
54 | + margin-right: 10px; | ||
55 | + border-radius: 4px; | ||
56 | + border: 4px solid black; | ||
57 | + background: #ffe9a6; | ||
58 | + color: white; | ||
59 | +} | ||
60 | +.user-name, .user-money { | ||
61 | + font-size: 18px; | ||
62 | + margin-bottom: 10px; | ||
63 | +} | ||
64 | +.timeline { | ||
65 | + margin-top: 10px; | ||
66 | + width: 100%; | ||
67 | + display: inline-block; | ||
68 | + border-radius: 4px; | ||
69 | + vertical-align: top; | ||
70 | +} | ||
71 | +@media screen and (min-width: 800px) { .timeline { width: 500px; } } | ||
72 | +#good-list, #good-list th, #good-list td { | ||
73 | + border: 1px solid black; | ||
74 | + border-collapse: collapse; | ||
75 | +} | ||
76 | +#good-list img { max-height: 45px; vertical-align: top; } | ||
77 | +#good-img { width: 280px; } | ||
78 | +.error-message { color: red; font-weight: bold; } | ||
79 | +#join-form, #good-form { padding: 10px; text-align: center; } | ||
80 | +footer { text-align: center; } |
-
Please register or login to post a comment