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

컴포넌트 디자인 변경 반영

Browse Source
This commit is contained in:
현성필
2025-11-17 13:24:09 +09:00
parent ac59d4109c
commit f35470814d
25 changed files with 337 additions and 500 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/static/css/main.css
+256 -346
View File
File diff suppressed because it is too large Load Diff
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/static/sass/abstracts/_variables.scss
+2 -2
View File
@@ -5,8 +5,8 @@
// Color Palette - Vibrant and Modern
// Primary colors
$primary-blue: #4B9BFF; // Bright blue (main brand color)
$secondary-blue: #2E7FF7; // Deep blue
$primary-blue: #0049b4; // 광주은행 블루
$secondary-blue: #c3dfea; // Deep blue
$accent-cyan: #00D4FF; // Sky blue accent
$accent-yellow: #FFD93D; // Yellow accent
$accent-orange: #FF6B6B; // Orange accent
src/main/resources/static/sass/components/_buttons.scss
+4 -5
View File
@@ -31,7 +31,7 @@
// Button variants
&-primary {
background: $gradient-primary;
background: $primary-blue;
color: $white;
box-shadow: $shadow-md;
@@ -46,9 +46,8 @@
}
&-secondary {
background: $white;
color: $primary-blue;
border: 2px solid $primary-blue;
background: $secondary-blue;
color: #6e7780;
&:hover {
background: $light-bg;
@@ -475,4 +474,4 @@
i {
font-size: 14px;
}
}
}
src/main/resources/static/sass/components/_tables.scss
+25 -25
View File
@@ -332,30 +332,30 @@
}
}
button {
padding: $spacing-sm $spacing-lg;
background: $gradient-primary;
color: $white;
border: none;
border-radius: $border-radius-md;
font-size: $font-size-sm;
font-weight: $font-weight-medium;
cursor: pointer;
transition: $transition-base;
white-space: nowrap;
&:hover {
transform: translateY(-2px);
box-shadow: $shadow-md;
}
&:active {
transform: translateY(0);
}
i {
margin-right: $spacing-xs;
}
}
//button {
// padding: $spacing-sm $spacing-lg;
// background: $gradient-primary;
// color: $white;
// border: none;
// border-radius: $border-radius-md;
// font-size: $font-size-sm;
// font-weight: $font-weight-medium;
// cursor: pointer;
// transition: $transition-base;
// white-space: nowrap;
//
// &:hover {
// transform: translateY(-2px);
// box-shadow: $shadow-md;
// }
//
// &:active {
// transform: translateY(0);
// }
//
// i {
// margin-right: $spacing-xs;
// }
//}
}
}
src/main/resources/static/sass/pages/_org-register.scss
+3 -3
View File
@@ -102,14 +102,14 @@
align-items: center;
justify-content: space-between;
padding: $spacing-lg $spacing-xl;
background: linear-gradient(135deg, $primary-blue 0%, $secondary-blue 100%);
background: #EDF9FE;
border-radius: $border-radius-md;
margin-bottom: $spacing-xl;
h3 {
font-size: $font-size-lg;
font-weight: $font-weight-semibold;
color: $white;
font-weight: $font-weight-regular;
color: #515961;
margin: 0;
}
src/main/resources/static/sass/pages/_user-management.scss
-72
View File
@@ -50,36 +50,6 @@
gap: $spacing-md;
}
.btn-create-user,
.btn-create-user-large {
display: inline-flex;
align-items: center;
gap: $spacing-sm;
padding: 12px $spacing-xl;
background: $gradient-primary;
color: $white;
font-size: $font-size-base;
font-weight: $font-weight-semibold;
border: none;
border-radius: $border-radius-lg;
cursor: pointer;
transition: $transition-base;
box-shadow: $shadow-md;
&:hover {
transform: translateY(-2px);
box-shadow: $shadow-lg;
}
&:active {
transform: translateY(0);
}
.btn-icon {
font-size: $font-size-lg;
}
}
.btn-create-user-large {
padding: $spacing-md $spacing-2xl;
font-size: $font-size-md;
@@ -344,16 +314,6 @@
}
}
&.btn-secondary {
background-color: $text-gray;
color: $white;
&:hover {
background-color: darken($text-gray, 10%);
box-shadow: $shadow-sm;
}
}
&.btn-danger {
background-color: $accent-orange;
color: $white;
@@ -622,35 +582,3 @@
flex-direction: column;
}
}
.btn-secondary {
display: inline-flex;
align-items: center;
gap: $spacing-sm;
padding: 12px $spacing-xl;
background-color: $white;
color: $text-dark;
font-size: $font-size-base;
font-weight: $font-weight-medium;
border: 2px solid $border-gray;
border-radius: $border-radius-lg;
text-decoration: none;
cursor: pointer;
transition: $transition-base;
&:hover {
background-color: $gray-bg;
border-color: $primary-blue;
color: $primary-blue;
transform: translateY(-2px);
box-shadow: $shadow-sm;
}
&:active {
transform: translateY(0);
}
i {
font-size: $font-size-base;
}
}
src/main/resources/templates/views/apps/commission/commissionManage.html
+1 -1
View File
@@ -53,7 +53,7 @@
</span>
<span class="btnBox" style="margin-left: auto;">
<button type="button" class="btn btn-primary" onclick="loadData()">
<span class="glyphicon glyphicon-search"></span>&nbsp;<span>조회</span>
<span class="fa fa-search"></span><span>조회</span>
</button>
<button type="button" id="printBtn" class="btn btn-secondary" style="margin-left: 5px; display:none;" onclick="printCommission()">
<span>청구서 출력</span>
src/main/resources/templates/views/apps/community/mainFaqList.html
+1 -1
View File
@@ -30,7 +30,7 @@
<input type="text"
th:field="*{searchWrd}"
placeholder="질문 또는 답변 내용으로 검색">
<button type="button" onclick="fn_search_article()">
<button type="button" class="btn btn-primary" onclick="fn_search_article()">
<i class="fas fa-search"></i>
<span>검색</span>
</button>
src/main/resources/templates/views/apps/community/mainInquiryList.html
+2 -2
View File
@@ -30,7 +30,7 @@
name="searchWrd"
th:value="${search.searchWrd}"
placeholder="제목 또는 내용으로 검색">
<button type="button" onclick="fn_search_inquiry()">
<button type="button" class="btn btn-primary" onclick="fn_search_inquiry()">
<i class="fas fa-search"></i>
<span>검색</span>
</button>
@@ -92,7 +92,7 @@
<!-- New Inquiry Button -->
<div class="inquiry-actions">
<a th:href="@{/inquiry/new}" class="action-btn-new">
<a th:href="@{/inquiry/new}" class="btn btn-primary">
<i class="fas fa-pen"></i>
<span>질문하기</span>
</a>
src/main/resources/templates/views/apps/community/mainNoticeList.html
+1 -1
View File
@@ -28,7 +28,7 @@
name="searchSubjectOrDetail"
th:value="${search.searchSubjectOrDetail}"
placeholder="제목 또는 내용으로 검색">
<button type="button" onclick="fn_search_notice()">
<button type="button" class="btn btn-primary" onclick="fn_search_notice()">
<i class="fas fa-search"></i>
<span>검색</span>
</button>
src/main/resources/templates/views/apps/mypage/apiKeyList.html
+6 -6
View File
@@ -16,10 +16,10 @@
<div class="apikey-actions">
<button sec:authorize="hasRole('ROLE_API_KEY_REQUEST')"
type="button"
class="btn-create-app"
class="btn btn-primary"
id="requestApiKey">
<span class="btn-icon">➕</span>
앱 생성
<i class="fas fa-plus"></i>
<span>첫 앱 생성하기</span>
</button>
</div>
</div>
@@ -129,10 +129,10 @@
<p>새로운 앱을 생성하여 API를 사용해보세요.</p>
<button sec:authorize="hasRole('ROLE_API_KEY_REQUEST')"
type="button"
class="btn-create-app-large"
class="btn btn-primary"
id="requestApiKeyEmpty">
<span class="btn-icon">➕</span>
첫 앱 생성하기
<i class="fas fa-plus"></i>
<span>첫 앱 생성하기</span>
</button>
</div>
src/main/resources/templates/views/apps/mypage/components/commonUserInfo.html
+3 -3
View File
@@ -49,7 +49,7 @@
maxlength="4"
disabled="disabled">
</div>
<button type="button" class="org-btn org-btn-secondary change_mobile_phone" id="changePhoneBtn">변경</button>
<button type="button" class="btn btn-secondary change_mobile_phone" id="changePhoneBtn">변경</button>
</div>
</div>
<div class="org-form-group" id="newPhoneNumberContainer" style="display: none;">
@@ -75,7 +75,7 @@
maxlength="4" pattern="\d*" inputmode="numeric" placeholder="뒷자리"/>
<input type="hidden" value="" name="mobileNumber" id="mobileNumber">
</div>
<button type="button" class="org-btn org-btn-primary btn_auth">
<button type="button" class="btn btn-primary btn_auth">
인증번호 받기
</button>
</div>
@@ -91,7 +91,7 @@
placeholder="SMS 인증번호 6자리">
<span class="org-timer" id="certify_time">03:00</span>
</div>
<button type="button" class="org-btn org-btn-primary btn_verify_auth">
<button type="button" class="btn btn-primary btn_verify_auth">
인증번호 확인
</button>
</div>
src/main/resources/templates/views/apps/mypage/orgTransfer.html
+2 -2
View File
@@ -58,8 +58,8 @@
<!-- Action Buttons -->
<div class="org-action-buttons">
<button type="button" class="org-btn org-btn-secondary" id="cancelButton" th:onclick="|location.href='@{/mypage}'|">취소</button>
<button type="button" class="org-btn org-btn-primary" id="submitButton">법인회원 전환</button>
<button type="button" class="btn btn-secondary" id="cancelButton" th:onclick="|location.href='@{/mypage}'|">취소</button>
<button type="button" class="btn btn-primary" id="submitButton">법인회원 전환</button>
</div>
</form>
</div>
src/main/resources/templates/views/apps/mypage/passwordChange.html
+2 -2
View File
@@ -51,8 +51,8 @@
</div>
<div class="org-action-buttons">
<button type="button" class="org-btn org-btn-secondary" onclick="history.back()">취소</button>
<button type="submit" class="org-btn org-btn-primary">변경</button>
<button type="button" class="btn btn-secondary" onclick="history.back()">취소</button>
<button type="submit" class="btn btn-primary">변경</button>
</div>
</form>
</div>
src/main/resources/templates/views/apps/mypage/passwordChangeEntry.html
+2 -2
View File
@@ -31,8 +31,8 @@
</div>
<div class="org-action-buttons">
<button type="button" class="org-btn org-btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="submit" class="org-btn org-btn-primary">확인</button>
<button type="button" class="btn btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="submit" class="btn btn-primary">확인</button>
</div>
</form>
</div>
src/main/resources/templates/views/apps/mypage/updateCorporateManager.html
+3 -3
View File
@@ -214,8 +214,8 @@
<!-- Action Buttons -->
<div class="org-action-buttons">
<button type="button" class="org-btn org-btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="org-btn org-btn-primary">수정 적용</button>
<button type="button" class="btn btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="btn btn-primary">수정 적용</button>
</div>
</form>
@@ -573,7 +573,7 @@
});
// 수정 버튼 이벤트
const submitButton = document.querySelector('.org-btn-primary:not(.btn_add2)');
const submitButton = document.querySelector('.btn-primary:not(.btn_add2)');
if (submitButton) {
submitButton.addEventListener('click', function(e) {
e.preventDefault();
src/main/resources/templates/views/apps/mypage/updateCorporateUser.html
+3 -3
View File
@@ -30,8 +30,8 @@
<!-- Action Buttons -->
<div class="org-action-buttons">
<button type="button" class="org-btn org-btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="org-btn org-btn-primary submit-btn">수정 적용</button>
<button type="button" class="btn btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="btn btn-primary submit-btn">수정 적용</button>
</div>
</form>
@@ -64,7 +64,7 @@
const form = document.getElementById('updateForm');
// 수정 버튼 이벤트
const submitButton = document.querySelector('.org-btn-primary.submit-btn');
const submitButton = document.querySelector('.btn-primary.submit-btn');
if (submitButton) {
submitButton.addEventListener('click', function (e) {
e.preventDefault();
src/main/resources/templates/views/apps/mypage/updatePersonalUser.html
+4 -4
View File
@@ -22,15 +22,15 @@
<!-- Corporate Transfer Button -->
<div class="org-info-notice" style="margin-top: 32px;">
<button type="button" class="org-btn org-btn-secondary btn_business" style="width: 100%;">
<button type="button" class="btn btn-secondary btn_business" style="width: 100%;">
법인회원 전환
</button>
</div>
<!-- Action Buttons -->
<div class="org-action-buttons">
<button type="button" class="org-btn org-btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="org-btn org-btn-primary submit-btn">수정</button>
<button type="button" class="btn btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="btn btn-primary submit-btn">수정</button>
</div>
</form>
@@ -65,7 +65,7 @@
const form = document.getElementById('updateForm');
// 수정 버튼 이벤트
const submitButton = document.querySelector('.org-btn-primary.submit-btn');
const submitButton = document.querySelector('.btn-primary.submit-btn');
if (submitButton) {
submitButton.addEventListener('click', function (e) {
e.preventDefault();
src/main/resources/templates/views/apps/register/components/commonUserInfoForm.html
+1 -1
View File
@@ -27,7 +27,7 @@
<input type="hidden" id="loginId" name="loginId" th:value="${loginId}">
<input type="hidden" name="registrationType" th:value="${registrationType}"/>
<input type="hidden" id="registrationScenario" name="registrationScenario" value="new"/>
<button type="button" class="org-btn org-btn-check btn_check_email"
<button type="button" class="btn org-btn-check btn_check_email"
th:classappend="${isInvited ? 'hidden' : ''}">
중복체크
</button>
src/main/resources/templates/views/apps/register/components/newUserInfoForm.html
+2 -2
View File
@@ -40,7 +40,7 @@
th:placeholder="#{portal.Register.phone2}">
</div>
<input type="hidden" th:field="*{mobileNumber}" id="mobileNumber">
<button type="button" class="org-btn org-btn-check btn_auth">
<button type="button" class="btn org-btn-check btn_auth">
인증번호 받기
</button>
<div id="mobile-validation" class="org-validation-message"></div>
@@ -59,7 +59,7 @@
inputmode="numeric" class="org-form-input" th:placeholder="#{ncrdRegister.validate.authNumber}" required>
<span class="org-timer" id="certify_time">03:00</span>
</div>
<button type="button" class="org-btn org-btn-check btn_verify_auth">
<button type="button" class="btn org-btn-check btn_verify_auth">
인증번호 확인
</button>
<div id="authNumber-validation" class="org-validation-message"></div>
src/main/resources/templates/views/apps/register/components/orgUserInfoForm.html
+1 -1
View File
@@ -16,7 +16,7 @@
<input type="text" id="domain" class="org-form-input"
placeholder="도메인">
</div>
<button type="button" class="org-btn org-btn-check btn_check_email">
<button type="button" class="btn org-btn-check btn_check_email">
중복체크
</button>
</div>
src/main/resources/templates/views/apps/register/orgUserRegister.html
+2 -2
View File
@@ -55,8 +55,8 @@
<!-- Action Buttons -->
<div class="org-action-buttons">
<button type="button" class="org-btn org-btn-secondary" id="cancelButton">취소</button>
<button type="button" class="org-btn org-btn-primary btn_register">가입신청</button>
<button type="button" class="btn btn-secondary" id="cancelButton">취소</button>
<button type="button" class="btn btn-primary btn_register">가입신청</button>
</div>
</form>
src/main/resources/templates/views/apps/register/userRegister.html
+2 -2
View File
@@ -60,8 +60,8 @@
<!-- Action Buttons -->
<div class="org-action-buttons">
<button type="button" class="org-btn org-btn-secondary" id="cancelButton">취소</button>
<button type="button" class="org-btn org-btn-primary btn_register">가입신청</button>
<button type="button" class="btn btn-secondary" id="cancelButton">취소</button>
<button type="button" class="btn btn-primary btn_register">가입신청</button>
</div>
</form>
src/main/resources/templates/views/apps/users/userList.html
+8 -8
View File
@@ -13,9 +13,9 @@
<h2>이용자 목록</h2>
</div>
<div class="user-management-actions">
<button type="button" class="btn-create-user" id="addUserBtn">
<span class="btn-icon">➕</span>
이용자 추가
<button type="button" class="btn btn-primary" id="addUserBtn">
<i class="fas fa-plus"></i>
<span>이용자 추가</span>
</button>
</div>
</div>
@@ -84,7 +84,7 @@
th:data-user-name="${user.maskedUserName}">
활성화
</button>
<button type="button" class="btn-action btn-sm btn-danger cancel_invitation"
<button type="button" class="btn btn-sm btn-secondary cancel_invitation"
th:if="${user.userStatus.toString() == 'PENDING'}"
th:data-user-id="${user.id}"
th:data-user-email="${user.maskedEmailAddr}">
@@ -120,7 +120,7 @@
</div>
<div class="col-actions">
<div class="user-action-buttons">
<button type="button" class="btn-action btn-sm btn-danger cancel_invitation"
<button type="button" class="btn btn-sm btn-secondary cancel_invitation"
th:data-user-id="${user.id}"
th:data-user-email="${user.maskedEmailAddr}">
초대취소
@@ -136,9 +136,9 @@
<div class="empty-icon">👥</div>
<h3>등록된 이용자가 없습니다</h3>
<p>새로운 이용자를 추가하여 시작하세요.</p>
<button type="button" class="btn-create-user-large" id="addUserBtnEmpty">
<span class="btn-icon">➕</span>
첫 이용자 추가하기
<button type="button" class="btn btn-primary" id="addUserBtnEmpty">
<i class="fas fa-plus"></i>
<span>첫 이용자 추가하기</span>
</button>
</div>