로그인 버튼 UI수정

frontend/src/components/GoogleLoginButton.js

@@ -12,6 +12,7 @@ import 'moment/locale/ko';
 import base64 from 'base-64';
 import axios from 'axios';
 
+
 axios.defaults.withCredentials = true;
 
 const GoogleLoginButton = () => {
@@ -27,7 +28,10 @@ const GoogleLoginButton = () => {
   return (
 
     <GoogleOAuthProvider clientId={clientId}>
+      <div className="loginForm">
+      <p>구글 로그인으로 서비스 사용하기</p>
       <GoogleLogin 
+      theme = "filled_blue"
         onSuccess={(res) => {
           let datas = res.credential.split('.')
           const obj = JSON.parse(b64DecodeUnicode(datas[1]));
@@ -45,8 +49,12 @@ const GoogleLoginButton = () => {
           console.log(err);
         }}
       />
+      <h4>문의: jhw0714@ajou.ac.kr</h4>
+      <br></br>
+      </div>     
     </GoogleOAuthProvider>
     
+
   );
 };
 

frontend/src/css/App.css

+@font-face {
+  font-family: 'JalnanGothic';
+  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/JalnanGothic.woff') format('woff');
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Pretendard-Regular';
+  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+  font-weight: 400;
+  font-style: normal;
+}
+
 button {
   background: inherit;
   border: none;
@@ -48,3 +62,28 @@ button:active {
 .App :not(style) {
   margin: 10px;
 }
+
+.loginForm{
+  width: 19vw;
+  height: 30vh;
+  border-radius: 10px;
+  display: flexbox;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+  border: 2px solid grey;
+}
+
+.loginForm p{
+  /* background-color: red; */
+  font-family: 'JalnanGothic';
+  font-size: 14px;
+  margin: 30px;
+
+}
+
+.loginForm h4{
+  padding-top: 7vh;
+  font-family: 'Pretendard-Regular';
+
+}
\ No newline at end of file

frontend/src/css/PostWrite.css

@@ -18,17 +18,17 @@
     margin-right: auto;
 }
 
-#test{
+#keyword{
     font-family: 'Pretendard-Regular';
     font-size: 20px;
-    font-weight: 500;
+    font-weight: 700;
 
 }
 
 #writeTitle{
     font-family: 'JalnanGothic';
     font-weight: 700;
-    font-size: 20px; 
+    font-size: 30px; 
 }
 
 #writeContent{
@@ -40,3 +40,13 @@
     resize: none;
     
 }
+/* #profileLabel{
+    font-family: 'JalnanGothic';
+    font-size: 100px;
+}
+
+
+#profileImg{
+    font-family: 'JalnanGothic';
+    font-size: 100px;
+} */
\ No newline at end of file

frontend/src/pages/PostWrite.js

@@ -135,7 +135,7 @@ function PostWrite() {
         <div>
           <form id='postForm' onSubmit={onSubmit}>
             <div style={{ display: "flex" }}>
-              <input id='test' readOnly={true} type="text" placeholder="장소 키워드" value={location.keyword} />
+              <input id='keyword' readOnly={true} type="text" placeholder="장소 키워드" value={location.keyword} />
               <button type="button" onClick={() => {
                 setLocation({
                   keyword: "",
@@ -163,7 +163,7 @@ function PostWrite() {
               <div style={{ display: "flex" }}>
                 {imglist}
               </div>
-              <label htmlFor="profileImg">이미지 업로드</label>
+              <label id='profileLabel' htmlFor="profileImg">이미지 업로드</label>
               <input  style={{ display: "none" }} id="profileImg" type="file" onChange={onImgChange} multiple />
             </div>
             <button type="submit">포스팅!</button>