Skip to content

[DB] Search, Upload 페이지 UI 리팩토링 및 전역 헤더 스타일 통일 #62

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
usn757 merged 3 commits into from
Jun 7, 2025
Merged

[DB] Search, Upload 페이지 UI 리팩토링 및 전역 헤더 스타일 통일 #62

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
1eab683
[refactor] search 페이지 탭 UI 제거 및 코드 간소화
usn757 Jun 7, 2025
9a4c40e
[refactor] visionUpload 페이지 리팩토링 및 전역 헤더 스타일 통일
usn757 Jun 7, 2025
75de838
Merge remote-tracking branch 'origin/main'
usn757 Jun 7, 2025
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
23 changes: 0 additions & 23 deletions src/main/resources/static/css/bootstrap-overrides.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,29 +160,6 @@
box-shadow: 0 0 0 0.25rem rgba(var(--accent-color-rgb), .25);
}

/* 네비게이션 탭 (Nav Tabs) */
.nav-tabs {
--bs-nav-tabs-border-color: var(--input-border-color);
--bs-nav-tabs-link-hover-border-color: var(--input-border-color) var(--input-border-color) var(--point-color);
--bs-nav-tabs-link-active-color: var(--accent-color);
--bs-nav-tabs-link-active-bg: var(--card-bg-color);
--bs-nav-tabs-link-active-border-color: var(--input-border-color) var(--input-border-color) var(--card-bg-color);
}

.nav-link {
color: var(--secondary-text-color);
font-family: 'HakgyoansimDunggeunmisoTTF-B', sans-serif; /* 탭 링크에도 폰트 적용 */
}

.nav-link:hover, .nav-link:focus {
color: var(--point-color);
}

.nav-tabs .nav-link.active {
color: var(--accent-color); /* 활성 탭 텍스트 색상 명확히 */
font-weight: bold;
}


/* 카드 (Cards) */
.card {
Expand Down
41 changes: 33 additions & 8 deletions src/main/resources/static/css/header.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,25 +31,50 @@ header {
}

header h1 {
color: var(--accent-color);
font-size: 1.8em;
margin: 0;
}

header a {
/* 1. 로고(PETTY) 링크 스타일 */
.logo-container h1 a {
color: var(--accent-color); /* common.css에 정의된 분홍색 변수 */
text-decoration: none;
/* 로고는 호버 효과가 없어야 하므로 padding, background 등을 초기화합니다. */
padding: 0;
border-radius: 0;
}
.logo-container h1 a:hover {
background-color: transparent; /* 호버 시 배경색 변경 없음 */
color: var(--accent-color); /* 호버 시 색상 변경 없음 */
}


/* 2. 우측 계정 메뉴(프로필, 로그아웃) 스타일 */
.account-btn-div a {
color: var(--text-color); /* common.css에 정의된 기본 텍스트 색상(갈색 계열) */
text-decoration: none;
color: var(--secondary-text-color);
font-weight: bold;
font-size: 1em; /* 폰트 크기 통일 */
padding: 8px 12px;
border-radius: var(--border-radius-md);
transition: background-color 0.3s ease, color 0.3s ease;
transition: color 0.3s ease;
}
.account-btn-div a:hover {
color: var(--accent-color); /* 호버 시 분홍색으로 변경 */
background-color: transparent; /* 호버 시 배경색은 없도록 처리 */
}


header a:hover {
background-color: var(--point-color);
color: white;
/* 3. 사용자 이름 텍스트 스타일 */
#userInfo {
color: var(--text-color);
font-weight: bold;
font-size: 1em;
padding: 8px 12px; /* 링크와 여백을 맞추기 위해 추가 */
}



/* Menu Icon (Hamburger) Styles */
.menu-icon {
width: 30px;
Expand Down Expand Up @@ -90,7 +115,7 @@ header a:hover {
font-size: 1.5em;
}

header div[style] { /* 로그인/회원가입 메뉴 숨김 */
header .account-btn-div { /* 로그인/회원가입 메뉴를 감싸는 div를 숨김 */
display: none !important;
}
}
Expand Down
27 changes: 0 additions & 27 deletions src/main/resources/static/css/search.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,31 +19,6 @@
color: var(--secondary-text-color); /* common.css 변수 사용 */
}

/* ==========================================================================
탭 UI (직접 검색)
========================================================================== */
.nav-tabs {
border-bottom-color: var(--input-border-color); /* common.css 변수 */
}
.nav-tabs .nav-link {
font-weight: bold;
border-radius: var(--border-radius-sm) var(--border-radius-sm) 0 0; /* common.css 변수 */
padding: 0.75rem 1.25rem;
background-color: transparent;
/* bootstrap-overrides.css 에서 :root 및 .nav-link 로 색상 관리 */
/* border-color 는 bootstrap-overrides.css 의 --bs-nav-tabs-link-active-border-color 등 변수 설정 따름 */
}
/* .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus handled by bootstrap-overrides.css */
/* .nav-tabs .nav-link.active handled by bootstrap-overrides.css */

.tab-content > .tab-pane {
background-color: var(--card-bg-color); /* common.css 변수 */
border: 1px solid var(--input-border-color); /* common.css 변수 */
border-top: none;
padding: 1.5rem;
border-radius: 0 0 var(--border-radius-md) var(--border-radius-md); /* common.css 변수 */
box-shadow: var(--box-shadow-light); /* common.css 변수 */
}

/* ==========================================================================
직접 검색 필터 (폼 요소 공통 스타일)
Expand Down Expand Up @@ -140,7 +115,6 @@

/* --- 직접 검색 결과 리스트 컨트롤 --- */
#resultControlsDirectSearch {
background-color: var(--bs-light-bg-subtle, var(--background-color)); /* common.css 변수 fallback */
padding: 1rem 1.5rem;
border-radius: var(--border-radius-md); /* common.css 변수 */
margin-bottom: 1.5rem;
Expand All @@ -158,7 +132,6 @@
font-size: 0.95em;
padding: 0.5em 0.75em;
color: var(--text-color); /* primary 버튼 텍스트 색상 */
background-color: var(--accent-color); /* common.css 변수, Bootstrap primary 대신 테마색 사용 */
/* bootstrap-overrides.css의 --bs-primary 가 이미 --accent-color로 설정되어 있다면, badge bg-primary로도 충분 */
}

Expand Down
Loading