App.css 2.11 KB
Newer Older
Spark's avatar
layouut    
Spark committed
1
2
3
4
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

body {
  font-family: "Noto Sans KR", sans-serif !important;
Spark's avatar
Spark committed
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
  width: 100%;
  min-height: 100vh;
  margin: 0;
  display: flex;
}

#root {
  width: 100%;
  min-height: 100%;
}

#footer{
  position: relative;
  bottom: 1em;
  padding-top: 2em;
}
21

Spark's avatar
Spark committed
22
23
24
.form-check-input{
  cursor: pointer;
  box-shadow: none !important;
Spark's avatar
Spark committed
25
}
26

Spark's avatar
Spark committed
27
28
.form-check-input:checked {
  background-color: #04AB70 !important;
Spark's avatar
Spark committed
29
30
  border: none;
  }
Spark's avatar
Spark committed
31

Spark's avatar
Spark committed
32
33
34
#btnlink {
  color: white !important;
  text-decoration: none !important;
Spark's avatar
Spark committed
35
36
37
  min-width: 100%;
  margin: auto;
  height: 100%;
Spark's avatar
Spark committed
38
}
39
40
41
42
43
44
45

.btn-primary:active {
  outline: white !important;
  border-color: white !important;
}

.card .card-title {
46
47
48
49
  color: rgb(70, 70, 70);
  font-size: 1.5em;
}

Spark's avatar
Spark committed
50
51
52
53
54
#impactTitle {
  margin: 1em;
  font-size: 1.5em;
}

55
.card .card-subtitle {
Spark's avatar
Spark committed
56
  display: flex;
57
  color: rgb(129, 129, 129);
Spark's avatar
Spark committed
58
  align-items: center;
Spark's avatar
Spark committed
59
  justify-content: center;
Spark's avatar
Spark committed
60
  font-weight: 300;
Spark's avatar
Spark committed
61
62
}

Spark's avatar
Spark committed
63

Spark's avatar
Spark committed
64
65
66
67
68
69
70
71
.form-group .form-control {
  border-radius: 40px;
}
#formbtn {
  width: 100%;
  border-radius: 40px;
  background-color: rgb(110, 189, 142);
  border-color: ivory;
72
  color: white;
Spark's avatar
Spark committed
73
74
75
}

#logpng {
Spark's avatar
Spark committed
76
77
78
  width: 50%;
  height: 6em;
  object-fit: cover;
Spark's avatar
Spark committed
79
80
81
}

#socialLink {
Spark's avatar
Spark committed
82
83
84
85
  display: flex;
  justify-content: center;
  align-items: center;
  height: 50%;
Spark's avatar
Spark committed
86
87
  padding: 0.5em;
  color: gray;
Spark's avatar
Spark committed
88
  font-size: 0.8em;
Spark's avatar
Spark committed
89
  width: fit-content;
Spark's avatar
layouut    
Spark committed
90
91
}

Spark's avatar
Spark committed
92

Spark's avatar
layout    
Spark committed
93
94
@media (max-width: 767.98px) { 
  body {
95
    padding: 30px;
Spark's avatar
layout    
Spark committed
96
97
98
    padding-left: 20px;
    padding-right: 20px;
    margin: auto;
Spark's avatar
layouut    
Spark committed
99

Spark's avatar
tsx    
Spark committed
100
  }
Spark's avatar
layout    
Spark committed
101
102
103
104
  .container-fluid {
    max-width: 480px !important;
  }
  
Spark's avatar
Spark committed
105
  #stickyy {
106
107
108
109
    max-width: 400px;
  }

  #contour {
Spark's avatar
Spark committed
110
    padding-bottom: 1em;
111
    color: rgba(195, 195, 195, 0.753);
Spark's avatar
Spark committed
112
113
  }
  
Spark's avatar
layout    
Spark committed
114
 }
Spark's avatar
tsx    
Spark committed
115

Spark's avatar
layout    
Spark committed
116
117
118
119
120
121
122
@media (min-width: 768px) {
  body {
    padding: 30px;
    padding-left: 50px;
    padding-right: 50px;
    margin: auto;
  }
Spark's avatar
layouut    
Spark committed
123

Spark's avatar
layout    
Spark committed
124
  .container-fluid {
Spark's avatar
Spark committed
125
    max-width: 1000px !important;
Spark's avatar
Spark committed
126
127
    min-height: 90%;
    
Spark's avatar
tsx    
Spark committed
128
  }
Spark's avatar
Spark committed
129

Spark's avatar
layout    
Spark committed
130
131
  .container-fluid .row #stickyy {
    position: sticky !important;
Spark's avatar
Spark committed
132
133
134
    top: 40px;
    width: fit-content;
    height: fit-content;
135
136
137
    max-width: 300px;

  }
Spark's avatar
Spark committed
138

139
140
  #contour {
    display: none;
Spark's avatar
tsx    
Spark committed
141
  }
Spark's avatar
layout    
Spark committed
142
143

 }