Skip to content

refactor: css 수정 #74

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Sep 23, 2024
Merged

refactor: css 수정 #74

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3ffe623
feat: ? 버튼 누를시 사용 가이드로 이동
gmltn9233 Sep 23, 2024
e5d7313
feat: 메인화면 수정
gmltn9233 Sep 23, 2024
8921955
refactor: sejongauth->gonghak98
gmltn9233 Sep 23, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 5 additions & 3 deletions src/main/resources/templates/gonghak/statusForm.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,11 @@
<img src="/static/images/questionmark.svg"
style="height: 40px; width: 40px; padding:10px">
</button>
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<a href="https://elastic-march-a0d.notion.site/gonghak98-8b1448883b524b7aa4af14f19f60e162" target="_blank">
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
</a>
</div>
</div>
<div class="window-body" style="text-align: center">
Expand Down
36 changes: 33 additions & 3 deletions src/main/resources/templates/layout/footer.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,22 +1,52 @@
<footer class="py-2 mt-auto" style="background: gray; display: flex; justify-content: center;">
<div class="row" style="width: 100%;">
<div class="col-4" style="display: flex; align-items: center; justify-content: center;">
<div class="col-12 col-md-4" style="display: flex; align-items: center; justify-content: center;">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-envelope" viewBox="0 0 16 16" style="margin-right: 10px; vertical-align: middle;">
<path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1zm13 2.383-4.708 2.825L15 11.105zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741M1 11.105l4.708-2.897L1 5.383z"/>
</svg>
<p style="margin-bottom: 0;">contact: gonghak98@gmail.com</p>
</div>
<div class="col-4" style="display: flex; align-items: center; justify-content: center;">
<div class="col-12 col-md-4" style="display: flex; align-items: center; justify-content: center;">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-github" viewBox="0 0 16 16" style="margin-right: 10px; vertical-align: middle;">
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8"/>
</svg>
<a style="color:black" href="https://github.com/Sejong-Java-Study/gonghak98">gonghak98@github.com</a>
</div>
<div class="col-4" style="display: flex; align-items: center; justify-content: center;">
<div class="col-12 col-md-4" style="display: flex; align-items: center; justify-content: center;">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-c-circle" viewBox="0 0 16 16" style="margin-right: 10px; vertical-align: middle;">
<path d="M1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8m15 0A8 8 0 1 1 0 8a8 8 0 0 1 16 0M8.146 4.992c-1.212 0-1.927.92-1.927 2.502v1.06c0 1.571.703 2.462 1.927 2.462.979 0 1.641-.586 1.729-1.418h1.295v.093c-.1 1.448-1.354 2.467-3.03 2.467-2.091 0-3.269-1.336-3.269-3.603V7.482c0-2.261 1.201-3.638 3.27-3.638 1.681 0 2.935 1.054 3.029 2.572v.088H9.875c-.088-.879-.768-1.512-1.729-1.512"/>
</svg>
<p style="margin-bottom: 0;">copyright2024: 조태현,이희수,홍지섭</p>
</div>
</div>
</footer>

<!-- 미디어 쿼리 추가 -->
<style>
@media (max-width: 768px) {
footer .row {
flex-direction: column;
text-align: center;
}
footer .col-12 {
margin-bottom: 10px;
}
footer svg {
width: 20px;
height: 20px;
}
footer p, footer a {
font-size: 14px;
}
}

@media (min-width: 769px) {
footer svg {
width: 16px;
height: 16px;
}
footer p, footer a {
font-size: 16px;
}
}
</style>
3 changes: 0 additions & 3 deletions src/main/resources/templates/layout/navbar.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,9 +22,6 @@
<li>
<a class="nav-link" sec:authorize="isAuthenticated()" th:href="@{/user/logout}">로그아웃</a>
</li>
<li class="nav-item">
<a class="nav-link" sec:authorize="isAnonymous()" th:href="@{/user/signup}">회원가입</a>
</li>
</ul>
</div>
</div>
Expand Down
52 changes: 42 additions & 10 deletions src/main/resources/templates/main.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,20 +1,52 @@
<html layout:decorate="~{layout/layout}">
<div layout:fragment="content" class="container my-3 text-center">
<div style="margin-top: 100px;margin-bottom: 200px">
<img src ="/static/images/image3.png" style ="width: 120px; height: 120px ">
<p style="font-family: IBM Plex Mono; font-weight: 500; color:white; font-size : 100px">Sejong Auth</p>
<div style="margin-top: 10vh; margin-bottom: 20vh">
<img src="/static/images/image3.png" style="width: 15vw; height: auto; max-width: 120px; max-height: 120px">
<p style="font-family: IBM Plex Mono; font-weight: 500; color:white; font-size: calc(4vw + 40px);">Sejong Auth</p>
</div>
<div>
<p style="font-family: IBM Plex Mono; color:white; font-weight: 400; font-size: 30px">* 세종대학교 공학인증 요건 검사 사이트. </p>
<p style="font-family: IBM Plex Mono; color:white; font-weight: 400; font-size: calc(1.5vw + 10px);">* 세종대학교 공학인증 요건 검사 사이트.</p>
</div>
<div style="margin-bottom: 100px">
<p style="font-family: IBM Plex Mono; color:white; font-weight: 400; font-size: 30px">* Engineering Certification Inspection Service of Sejong University.</p>
<div style="margin-bottom: 10vh">
<p style="font-family: IBM Plex Mono; color:white; font-weight: 400; font-size: calc(1.5vw + 10px);">* Engineering Certification Inspection Service of Sejong University.</p>
</div>
<div style="margin-bottom:50px">
<p style="font-family: IBM Plex Mono; color:white; font-weight: 400; font-size: 30px">Press start to continue _</p>
<div style="margin-bottom:5vh">
<p style="font-family: IBM Plex Mono; color:white; font-weight: 400; font-size: calc(1.5vw + 10px);">Press start to continue _</p>
</div>
<div style="margin-bottom: 50px">
<button class ="btn-lg" style="font-family: IBM Plex Mono; font-weight: 400; font-size: 30px; height: 60px; width: 180px" onclick="location.href='/user/login'">Start</button>
<div style="margin-bottom: 5vh">
<button class="btn-lg" style="font-family: IBM Plex Mono; font-weight: 400; font-size: calc(1.5vw + 10px); height: 60px; width: 180px" onclick="location.href='/user/login'">Start</button>
</div>
</div>

<style>
/* 반응형을 위한 미디어 쿼리 추가 */
@media (max-width: 768px) {
div {
margin-top: 5vh;
margin-bottom: 5vh;
}
img {
width: 40vw;
height: auto;
}
p {
font-size: calc(2.5vw + 20px);
}
button {
width: 100%;
height: 50px;
font-size: calc(2vw + 10px);
}
}

@media (max-width: 576px) {
p {
font-size: calc(3vw + 20px);
}
img {
width: 50vw;
height: auto;
}
}
</style>
</html>
8 changes: 5 additions & 3 deletions src/main/resources/templates/user/changePassword.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,11 @@
<button style="margin-right: 20px">
<img src="/static/images/questionmark.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<a href="https://elastic-march-a0d.notion.site/gonghak98-8b1448883b524b7aa4af14f19f60e162" target="_blank">
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
</a>
</div>
</div>
<div class="window-body" style="text-align: center">
Expand Down
8 changes: 5 additions & 3 deletions src/main/resources/templates/user/information.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,11 @@
<button style="margin-right: 20px">
<img src="/static/images/questionmark.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<a href="https://elastic-march-a0d.notion.site/gonghak98-8b1448883b524b7aa4af14f19f60e162" target="_blank">
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
</a>
</div>
</div>
<div class="window-body" style="text-align: center">
Expand Down
12 changes: 7 additions & 5 deletions src/main/resources/templates/user/login.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,15 +4,17 @@
<div class="window" style="width: 100%;margin-top: 10%">
<div class="title-bar">
<div class="title-bar-text " style="font-size: 30px">
Welcome to Sejong Auth
Welcome to gonghak98
</div>
<div class="title-bar-controls" style="margin-right: 10px">
<button style="margin-right: 20px">
<img src="/static/images/questionmark.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<a href="https://elastic-march-a0d.notion.site/gonghak98-8b1448883b524b7aa4af14f19f60e162" target="_blank">
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
</a>
</div>
</div>
<div class="window-body">
Expand All @@ -28,7 +30,7 @@
</div>
<div class="col-7">
<p style="font-size: 40px">
Sejong Auth에 로그인하려면 암호를 입력하십시오.
gonghak98에 로그인하려면 암호를 입력하십시오.
</p>
</div>
<div class="col-2"
Expand Down
9 changes: 6 additions & 3 deletions src/main/resources/templates/user/signup.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,12 @@
<button style="margin-right: 20px">
<img src="/static/images/questionmark.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<a href="https://elastic-march-a0d.notion.site/gonghak98-8b1448883b524b7aa4af14f19f60e162" target="_blank">
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
</a>

</div>
</div>
<div class="window-body row">
Expand Down
8 changes: 5 additions & 3 deletions src/main/resources/templates/user/withdrawal.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,11 @@
<button style="margin-right: 20px">
<img src="/static/images/questionmark.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
<a href="https://elastic-march-a0d.notion.site/gonghak98-8b1448883b524b7aa4af14f19f60e162" target="_blank">
<button>
<img src="/static/images/x.svg" style="height: 40px; width: 40px; padding:10px">
</button>
</a>
</div>
</div>
<div class="window-body" style="text-align: center">
Expand Down