혹시 카테고리 별로 바탕색상이 다르게 나오는 방법이 있나요?
본문
<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가
include_once(G5_LIB_PATH.'/thumbnail.lib.php');
// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.$board_skin_url.'/style.css">', 0);
?>
<!-- masonry 관련 설정 by 벌이뉨 2018.05.04 -->
<script src="<?=$board_skin_url?>/jquery.masonry.min.js?1"></script>
<script>
$(function(){
var $container = $('#container_k');
$container.imagesLoaded( function(){
$container.masonry({
itemSelector : '.box_k',
isFitWidth: true,
isAnimated: true,
animationOptions: {
duration: 200,
easing: 'linear',
queue: false
}
});
});
});
</script>
<style>
#container_k {
margin-bottom: 0px;
border-radius: 0px;
clear: both;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
}
.centered_k { margin: 0 auto; }
.box_k {
border : 0.1px solid #eaeaea;
margin: 0.0em;
padding: 0px;
background: #fff;
font-size: 11px;
line-height: 1.4em;
float: left;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
-moz-box-shadow: 0px 0px 0px #ffffff;
-webkit-box-shadow: 0px 0px 0px #ffffff;
box-shadow: 0px 0px 0px #ffffff;
}
.col_k { width: 100px;}
@media screen and (max-width:50px) {
.col_k { width: 10px;}
}
@media screen and (max-width:50px) {
.col_k { width: 165px;}
}
@media screen and (max-width:50px) {
.col_k { width: 137px;}
}
</style>
<!-- masonry 관련 설정 by 벌이뉨 2018.05.04 끝-->
<!-- 게시판 목록 시작 { -->
<div id="bo_gall" style="width:<?php echo $width; ?>">
<?php if ($is_category) { ?>
<nav id="bo_cate">
<h2><?php echo $board['bo_subject'] ?> 카테고리</h2>
<ul id="bo_cate_ul">
<?php echo $category_option ?>
</ul>
</nav>
<?php } ?>
<!-- 게시판 페이지 정보 및 버튼 시작 { -->
<!-- } 게시판 페이지 정보 및 버튼 끝 -->
<form name="fboardlist" id="fboardlist" action="./board_list_update.php" onsubmit="return fboardlist_submit(this);" method="post">
<input type="hidden" name="bo_table" value="<?php echo $bo_table ?>">
<input type="hidden" name="sfl" value="<?php echo $sfl ?>">
<input type="hidden" name="stx" value="<?php echo $stx ?>">
<input type="hidden" name="spt" value="<?php echo $spt ?>">
<input type="hidden" name="sst" value="<?php echo $sst ?>">
<input type="hidden" name="sod" value="<?php echo $sod ?>">
<input type="hidden" name="page" value="<?php echo $page ?>">
<input type="hidden" name="sw" value="">
<?php if ($is_checkbox) { ?>
<div id="gall_allchk">
<label for="chkall" class="sound_only">현재 페이지 게시물 전체</label>
<input type="checkbox" id="chkall" onclick="if (this.checked) all_checked(true); else all_checked(false);">
</div>
<?php } ?>
<div id="container_k" class="centered_k">
<?php for ($i=0; $i<count($list); $i++) {
$classes = array();
$classes[] = 'gall_li';
$classes[] = 'col-gn-'.$bo_gallery_cols;
if( $i && ($i % $bo_gallery_cols == 0) ){
$classes[] = 'box_clear';
}
if( $wr_id && $wr_id == $list[$i]['wr_id'] ){
$classes[] = 'gall_now';
}
?>
<div class="box_k col_k"">
<div class="gall_chk">
<?php if ($is_checkbox) { ?>
<label for="chk_wr_id_<?php echo $i ?>" class="sound_only"><?php echo $list[$i]['subject'] ?></label>
<input type="checkbox" name="chk_wr_id[]" value="<?php echo $list[$i]['wr_id'] ?>" id="chk_wr_id_<?php echo $i ?>">
<?php } ?>
<span class="sound_only">
<?php
if ($wr_id == $list[$i]['wr_id'])
echo "<span class=\"bo_current\">열람중</span>";
else
echo $list[$i]['num'];
?>
</span>
</div>
<div class="gall_con">
<?php
if ($list[$i]['is_notice']) { // 공지사항
$img_content = "<a href='{$list[$i]['href']}'><span class='is_notice'>공지</span></a>";
} else {
$thumb = get_list_thumbnail($board['bo_table'], $list[$i]['wr_id'], $board['bo_gallery_width'], $board['bo_gallery_height'], false, true);
if($thumb['src']) {
$img_content = "<a href='{$list[$i]['href']}'><img src='{$thumb['src']}' alt='{$thumb['alt']}'></a>";
} else {
$img_content = '';
}
}
if($img_content != ""){
?>
<div class="gall_img">
<?=$img_content?>
</div>
<?
}
?>
<div class="gall_text_href">
<?php
// echo $list[$i]['icon_reply']; 갤러리는 reply 를 사용 안 할 것 같습니다. - 지운아빠 2013-03-04
if ($is_category && $list[$i]['ca_name']) {
?>
<a href="<?php echo $list[$i]['ca_name_href'] ?>" class="bo_cate_link"><?php echo $list[$i]['ca_name'] ?></a>
<?php } ?>
<a href="<?php echo $list[$i]['href'] ?>" class="bo_tit">
<?php echo $list[$i]['subject'] ?>
<?php if ($list[$i]['comment_cnt']) { ?><span class="sound_only">댓글</span><span class="cnt_cmt">+ <?php echo $list[$i]['wr_comment']; ?></span><span class="sound_only">개</span><?php } ?>
<?php
// if ($list[$i]['link']['count']) { echo '['.$list[$i]['link']['count']}.']'; }
// if ($list[$i]['file']['count']) { echo '<'.$list[$i]['file']['count'].'>'; }
if (isset($list[$i]['icon_new'])) echo rtrim($list[$i]['icon_new']);
if (isset($list[$i]['icon_hot'])) echo rtrim($list[$i]['icon_hot']);
//if (isset($list[$i]['icon_file'])) echo rtrim($list[$i]['icon_file']);
//if (isset($list[$i]['icon_link'])) echo rtrim($list[$i]['icon_link']);
if (isset($list[$i]['icon_secret'])) echo rtrim($list[$i]['icon_secret']);
?>
</a>
</div>
<div class="gall_name">
</div>
</div>
</div>
<?php } ?>
<?php if (count($list) == 0) { echo "<li class=\"empty_list\">게시물이 없습니다.</li>"; } ?>
</div>
<?php if ($list_href || $is_checkbox || $write_href) { ?>
<div class="bo_fx">
<?php if ($list_href || $write_href) { ?>
<ul class="btn_bo_user">
<?php if ($is_checkbox) { ?>
<li><input type="submit" name="btn_submit" value="선택삭제" onclick="document.pressed=this.value" class="btn btn_b01"></li>
<li><input type="submit" name="btn_submit" value="선택복사" onclick="document.pressed=this.value" class="btn btn_b01"></li>
<li><input type="submit" name="btn_submit" value="선택이동" onclick="document.pressed=this.value" class="btn btn_b01"></li>
<?php } ?>
<?php if ($list_href) { ?><li><a href="<?php echo $list_href ?>" class="btn_b01 btn">목록</a></li><?php } ?>
<?php if ($write_href) { ?><li><a href="<?php echo $write_href ?>" class="btn_b02 btn">쓰기</a></li><?php } ?>
</ul>
<?php } ?>
</div>
<?php } ?>
</form>
<!-- 게시판 검색 시작 { -->
<fieldset id="bo_sch">
<legend>게시물 검색</legend>
<form name="fsearch" method="get">
<input type="hidden" name="bo_table" value="<?php echo $bo_table ?>">
<input type="hidden" name="sca" value="<?php echo $sca ?>">
<input type="hidden" name="sop" value="and">
<label for="sfl" class="sound_only">검색대상</label>
<select name="sfl" id="sfl">
<option value="wr_subject"<?php echo get_selected($sfl, 'wr_subject', true); ?>>제목</option>
<option value="wr_content"<?php echo get_selected($sfl, 'wr_content'); ?>>내용</option>
<option value="wr_subject||wr_content"<?php echo get_selected($sfl, 'wr_subject||wr_content'); ?>>제목+내용</option>
<option value="mb_id,1"<?php echo get_selected($sfl, 'mb_id,1'); ?>>회원아이디</option>
<option value="mb_id,0"<?php echo get_selected($sfl, 'mb_id,0'); ?>>회원아이디(코)</option>
<option value="wr_name,1"<?php echo get_selected($sfl, 'wr_name,1'); ?>>글쓴이</option>
<option value="wr_name,0"<?php echo get_selected($sfl, 'wr_name,0'); ?>>글쓴이(코)</option>
</select>
<label for="stx" class="sound_only">검색어<strong class="sound_only"> 필수</strong></label>
<input type="text" name="stx" value="<?php echo stripslashes($stx) ?>" required id="stx" class="sch_input" size="25" maxlength="20" placeholder="+한눈에 안전보건 검색">
<input type="submit" value="검색" class="sch_btn">
</form>
</fieldset>
<!-- } 게시판 검색 끝 -->
</div>
<?php if($is_checkbox) { ?>
<noscript>
<p>자바스크립트를 사용하지 않는 경우<br>별도의 확인 절차 없이 바로 선택삭제 처리하므로 주의하시기 바랍니다.</p>
</noscript>
<?php } ?>
<!-- 페이지 -->
<?php echo $write_pages; ?>
<?php if ($is_checkbox) { ?>
<script>
function all_checked(sw) {
var f = document.fboardlist;
for (var i=0; i<f.length; i++) {
if (f.elements[i].name == "chk_wr_id[]")
f.elements[i].checked = sw;
}
}
function fboardlist_submit(f) {
var chk_count = 0;
for (var i=0; i<f.length; i++) {
if (f.elements[i].name == "chk_wr_id[]" && f.elements[i].checked)
chk_count++;
}
if (!chk_count) {
alert(document.pressed + "할 게시물을 하나 이상 선택하세요.");
return false;
}
if(document.pressed == "선택복사") {
select_copy("copy");
return;
}
if(document.pressed == "선택이동") {
select_copy("move");
return;
}
if(document.pressed == "선택삭제") {
if (!confirm("선택한 게시물을 정말 삭제하시겠습니까?\n\n한번 삭제한 자료는 복구할 수 없습니다\n\n답변글이 있는 게시글을 선택하신 경우\n답변글도 선택하셔야 게시글이 삭제됩니다."))
return false;
f.removeAttribute("target");
f.action = "./board_list_update.php";
}
return true;
}
// 선택한 게시물 복사 및 이동
function select_copy(sw) {
var f = document.fboardlist;
if (sw == 'copy')
str = "복사";
else
str = "이동";
var sub_win = window.open("", "move", "left=50, top=50, width=500, height=550, scrollbars=1");
f.sw.value = sw;
f.target = "move";
f.action = "./move.php";
f.submit();
}
</script>
<?php } ?>
<!-- } 게시판 목록 끝 -->
답변 3
카테고리가 많지 않고 생성주기가 자주 발생하지 않는다면
리스트가 반복되는 for 최 상단에
if($list[$i]['ca_name'] == '카테고리1'){
$ca_color = '#fff100';
} else if($list[$i]['ca_name'] == '카테고리2'){
$ca_color = '#cc0000';
}
이렇게 카테고리별로 컬러 변수 설정 후 해당 변수를 background 에 넣으시면됩니다.
다음 코드가 도움이 될지 모르겠습니다.
<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가
include_once(G5_LIB_PATH.'/thumbnail.lib.php');
// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.$board_skin_url.'/style.css">', 0);
?>
<style>
:root {
--color-2: green;
--color-3: orange;
}
#bo_cate li:nth-child(2) a {
border: 1px solid var(--color-2);
color: var(--color-2);
}
#bo_cate li:nth-child(2) :is(a:hover,a:active) {
background: var(--color-2);
color: #fff;
}
#bo_cate li:nth-child(2) #bo_cate_on {
background: var(--color-2);
border: 1px solid var(--color-2);
box-shadow: none;
}
#bo_cate li:nth-child(3) a {
border: 1px solid var(--color-3);
color: var(--color-3);
}
#bo_cate li:nth-child(3) :is(a:hover,a:active) {
background: var(--color-3);
color: #fff;
}
#bo_cate li:nth-child(3) #bo_cate_on {
background: var(--color-3);
border: 1px solid var(--color-3);
box-shadow: none;
}
</style>
게시물 바탕색 부분 문의입니다.
.box_k {
border : 0.1px solid #eaeaea;
margin: 0.0em;
padding: 0px;
요부분을 바꾸니 전체 바탕색이 변합니다 background: #fff;
font-size: 11px;
line-height: 1.4em;
카테고리별로 바탕색이 변하게 하는 질문입니다
고맙습니다
다음 코드가 도움이 될지 모르겠습니다.
<style>
.box_k.전체 { background-color: red; }
.box_k.건축 { background-color: green; }
.box_k.기계 { background-color: orange; }
</style>
...
<?php for ($i=0; $i<count($list); $i++) {
<div class="box_k col_k <?php echo $list[$i]['ca_name']; ?>">
...
</div>
<?php } ?>
...
배르만님 감사합니다~~ 아래 처럼해서 잘 적용해 보았습니다~
<style>
.box_k.<?php echo $categories['0'];?> { background-color: #22a853;width:80px;font-size:0.7rem }
.box_k.<?php echo $categories['1'];?> { background-color: #469c65;width:80px;font-size:0.7rem; }
.box_k.<?php echo $categories['2'];?> { background-color: #31ada7;width:80px;font-size:0.7rem; }
.box_k.<?php echo $categories['3'];?> { background-color: #1c89b0;width:80px;font-size:0.7rem; }
.box_k.<?php echo $categories['4'];?> { background-color: #6c8cc4;width:80px;font-size:0.7rem; }
.box_k.<?php echo $categories['5'];?> { background-color: #7a68b0;width:80px;font-size:0.7rem; }
</style>
