localnet/localhost-front
10
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

게시판 리스트 css 수정

Browse Source
This commit is contained in:
dyhj625 2025-03-13 10:59:35 +09:00
parent 2661929cb0
commit 2c1566f49e
1 changed files with 37 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/views/board/BoardList.vue
View File

@ -1,17 +1,14 @@
<template>
<div class="container flex-grow-1 container-p-y">
<div class="card">
<div class="card-header">
<div class="card-header d-flex flex-column">
<!-- 검색창 -->
<div class="container col-6 mt-12 mb-8">
<search-bar @update:data="search" @keyup.enter="searchOnEnter"/>
<div class="input-group mb-3 w-100">
<search-bar @update:data="search" @keyup.enter="searchOnEnter" class="flex-grow-1" />
</div>
</div>
<div class="card-datatable">
<div class="row mx-6 my-6 justify-content-between g-3 align-items-center">
<div class="col-md-6 d-flex flex-column flex-md-row align-items-md-center gap-2 mt-0">
<div class="d-flex align-items-center" style="gap: 15px;">
<!-- 리스트 갯수 선택 -->
<select class="form-select w-25 w-md-100" v-model="selectedSize" @change="handleSizeChange">
<select class="form-select w-auto" v-model="selectedSize" @change="handleSizeChange" style="margin-left: 0;">
<option value="10">10개씩</option>
<option value="20">20개씩</option>
<option value="30">30개씩</option>
@ -19,25 +16,24 @@
</select>
<!-- 셀렉트 박스 -->
<select class="form-select w-25 w-md-100" v-model="selectedOrder" @change="handleSortChange">
<select class="form-select w-auto" v-model="selectedOrder" @change="handleSortChange">
<option value="date">최신날짜</option>
<option value="views">조회수</option>
</select>
<!-- 공지 접기 기능 -->
<div class="form-check mb-0 ms-2">
<div class="form-check mb-0">
<input class="form-check-input" type="checkbox" v-model="showNotices" id="hideNotices" />
<label class="form-check-label" for="hideNotices">공지 숨기기</label>
</div>
</div>
<div class="col-md-6 d-flex flex-column flex-md-row align-items-md-center justify-content-md-end gap-2">
<!-- 새 글쓰기 -->
<router-link to="/board/write" class="ms-2">
<WriteButton class="btn add-new btn-primary"/>
<!-- 새 글쓰기 버튼 -->
<router-link to="/board/write" class="ms-auto">
<WriteButton />
</router-link>
</div>
</div>
<!-- 게시판 -->
<div class="card-datatable m">
<div class="table-responsive">
<table class="datatables-users table border-top dataTable dtr-column">
<thead>
@ -289,12 +285,11 @@ onMounted(() => {
width: 100% !important;
}
}
/* 댓글 개수 스타일 */
.comment-count {
font-size: 0.9rem; /* 글씨 크기 증가 */
font-size: 0.9rem;
font-weight: bold;
color: #ff5733; /* 강조 색상 (붉은 계열) */
border-radius: 4px; /* 둥근 모서리 */
padding: 2px 6px; /* 내부 패딩 */
color: #ff5733;
border-radius: 4px;
padding: 2px 6px;
}
</style>