djb-eapim/eapim-portal
1
0
Fork 0
Code Issues Pull Requests Actions 10 Packages Projects Releases Wiki Activity

IP 입력 필드 스타일 개선: 정렬 및 버튼 크기 수정

Browse Source 
- `.ip-input-row` 정렬 기준 추가 및 버튼 폭 고정
- `.btn-add-ip` 및 제거 버튼 스타일/반응형 조정
This commit is contained in:
Rinjae
2026-06-30 10:54:00 +09:00
parent 0c3b63a5b1
commit 97b9d2161a
3 changed files with 18 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/static/css/main.css
+16 -10
View File
@@ -11441,6 +11441,7 @@ button.djb-comment-submit:disabled {
.ip-input-row { .ip-input-row {
display: flex; display: flex;
align-items: center;
gap: 21px; gap: 21px;
} }
.ip-input-row .ip-input { .ip-input-row .ip-input {
@@ -11468,7 +11469,7 @@ button.djb-comment-submit:disabled {
} }
.btn-add-ip { .btn-add-ip {
width: auto; width: 100px;
height: 40px; height: 40px;
padding: 0 16px; padding: 0 16px;
background-color: #3ba4ed; background-color: #3ba4ed;
@@ -11480,20 +11481,23 @@ button.djb-comment-submit:disabled {
cursor: pointer; cursor: pointer;
transition: background-color 0.2s ease; transition: background-color 0.2s ease;
flex-shrink: 0; flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
} }
.btn-add-ip:hover { .btn-add-ip:hover {
background-color: #2b94dd; background-color: #2b94dd;
} }
@media (max-width: 1024px) { @media (max-width: 1024px) {
.btn-add-ip { .btn-add-ip {
width: auto; width: 100%;
font-size: 14px; font-size: 14px;
height: 38px; height: 38px;
} }
} }
@media (max-width: 768px) { @media (max-width: 768px) {
.btn-add-ip { .btn-add-ip {
width: auto; width: 89px;
height: 36px; height: 36px;
font-size: 13px; font-size: 13px;
border-radius: 8px; border-radius: 8px;
@@ -11514,6 +11518,7 @@ button.djb-comment-submit:disabled {
} }
.register-form-container .ip-list .ip-item { .register-form-container .ip-list .ip-item {
display: flex; display: flex;
align-items: center;
gap: 21px; gap: 21px;
padding: 0; padding: 0;
border-bottom: none; border-bottom: none;
@@ -11555,26 +11560,27 @@ button.djb-comment-submit:disabled {
} }
} }
.register-form-container .ip-list .ip-item .btn-remove-ip { .register-form-container .ip-list .ip-item .btn-remove-ip {
width: 158px !important; width: 100px !important;
height: 60px !important; height: 40px !important;
background-color: #e5e7eb !important; background-color: #e5e7eb !important;
color: #5f666c !important; color: #5f666c !important;
border: none !important; border: none !important;
border-radius: 12px !important; border-radius: 8px !important;
font-size: 20px !important; font-size: 14px !important;
font-weight: 700; font-weight: 600;
cursor: pointer; cursor: pointer;
transition: background-color 0.2s ease; transition: background-color 0.2s ease;
flex-shrink: 0; flex-shrink: 0;
display: flex !important; display: flex !important;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
align-self: center;
} }
@media (max-width: 1024px) { @media (max-width: 1024px) {
.register-form-container .ip-list .ip-item .btn-remove-ip { .register-form-container .ip-list .ip-item .btn-remove-ip {
width: 100% !important; width: 100% !important;
font-size: 16px !important; font-size: 14px !important;
height: 50px !important; height: 38px !important;
} }
} }
@media (max-width: 768px) { @media (max-width: 768px) {
src/main/resources/static/css/main.css.map
+1 -1
View File
File diff suppressed because one or more lines are too long
src/main/resources/templates/views/apps/main/index.html
+1 -1
View File
@@ -150,7 +150,7 @@
<!-- Services 데이터를 반복하여 API 카드 표시 (최대 4개) --> <!-- Services 데이터를 반복하여 API 카드 표시 (최대 4개) -->
<div class="api-card" th:each="service, iterStat : ${services}" <div class="api-card" th:each="service, iterStat : ${services}"
th:if="${iterStat.index < 4}" th:if="${iterStat.index < 4}"
th:onclick="${service.id != null} ? |location.href='@{/apis(groupId=${service.id})}'| : |location.href='@{/apis}'|"> th:onclick="${service.id != null} ? |location.href='@{/apis(groupIds=${service.id})}'| : |location.href='@{/apis}'|">
<h3 class="card-title" th:text="${service.groupName}">API 서비스</h3> <h3 class="card-title" th:text="${service.groupName}">API 서비스</h3>
<p class="card-description"> <p class="card-description">
<span th:if="${service.groupDesc != null and !#strings.isEmpty(service.groupDesc)}" <span th:if="${service.groupDesc != null and !#strings.isEmpty(service.groupDesc)}"