You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
337 lines
11 KiB
337 lines
11 KiB
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta content="IE=Edge" http-equiv="X-UA-Compatible" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover" />
|
|
<title>커뮤니티</title>
|
|
<link rel="shortcut icon" href="../../img/favicon.ico">
|
|
<link rel="stylesheet" href="../../css/style.css">
|
|
<script type="text/javascript" src="../../js/jquery-3.3.1.min.js"></script>
|
|
</head>
|
|
|
|
<style media="screen">
|
|
body{
|
|
background: #F4F5F5;
|
|
}
|
|
</style>
|
|
|
|
<body>
|
|
|
|
<!-- wrap -->
|
|
<div class="wrap_community" id="community_all">
|
|
|
|
<!-- header_sub -->
|
|
<header class="header_wrapper">
|
|
<a href="javascript:history.back();" class="side_Lbtn hidden pre_btn">이전으로</a>
|
|
|
|
<div class="search_div">
|
|
<input type="text" name="" placeholder="작성자 또는 검색어를 검색해 보세요.">
|
|
<button type="button" class="search_btn">
|
|
<img src="../../img/ico_search_black.png" alt="">
|
|
</button>
|
|
</div>
|
|
</header>
|
|
<!-- //header_sub -->
|
|
|
|
<!-- 타이틀 박스 -->
|
|
<div class="title_box">
|
|
<h4 class="page_title">커뮤니티</h4>
|
|
<ul class="write_kind">
|
|
<li class="current" data-tab="tab1"><a href="#">전체글</a></li>
|
|
<li data-tab="tab2"><a href="#">내 글</a></li>
|
|
<li data-tab="tab3"><a href="#">좋아요</a></li>
|
|
</ul>
|
|
</div>
|
|
<!-- //타이틀 박스 -->
|
|
|
|
<!-- 커뮤니티 카테고리 -->
|
|
<ul class="category_bar">
|
|
<li class="current">
|
|
<a href="../community/community_all.html">전체</a>
|
|
</li>
|
|
<li>
|
|
<a href="../community/community_free.html">자유글</a>
|
|
</li>
|
|
<li>
|
|
<a href="../community/community_qna.html">Q&A</a>
|
|
</li>
|
|
<li>
|
|
<a href="../community/community_review.html">리뷰</a>
|
|
</li>
|
|
<li>
|
|
<a href="../community/community_vote.html">투표</a>
|
|
</li>
|
|
<li>
|
|
<a href="../community/community_column.html">칼럼</a>
|
|
</li>
|
|
</ul>
|
|
<!-- //커뮤니티 카테고리 -->
|
|
|
|
<!-- 커뮤니티 내용 -->
|
|
<div class="community_con">
|
|
<div class="small_title_div">
|
|
<p class="small_title">오늘의 인기글</p>
|
|
</div>
|
|
|
|
<!-- 오늘의 인기글 목록 -->
|
|
<div class="today_hot">
|
|
|
|
<!-- 태그에 hot 클래스 추가시 노란테두리 생성 -->
|
|
<div class="write_box hot">
|
|
<div class="ca_time">
|
|
<div class="ca_cont">
|
|
<div class="write_ca yellow">자유글</div>
|
|
</div>
|
|
<div class="ch_cont">
|
|
<div class="comment_like"><span class="like"></span>2</div>
|
|
<div class="comment_like"><span class="comment"></span>5</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="content txt_box">
|
|
시판 이유식 추천 부탁드려요
|
|
</div>
|
|
|
|
<div class="commu_div">
|
|
<div class="nickname_div">
|
|
<p>닉네임</p>
|
|
<p>·</p>
|
|
<p>00:00</p>
|
|
<p>·</p>
|
|
<p>조회 000</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 글 + 사진 -->
|
|
<div class="write_box">
|
|
<div class="ca_time">
|
|
<div class="ca_cont">
|
|
<div class="write_ca yellow">자유글</div>
|
|
</div>
|
|
<div class="ch_cont">
|
|
<div class="comment_like"><span class="like"></span>2</div>
|
|
<div class="comment_like"><span class="comment"></span>5</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="content img_txt_cont">
|
|
<div class="txt_box">
|
|
오늘 만든 이유식 자랑 하려구요~
|
|
</div>
|
|
<div class="img_box">
|
|
<img src="../../img/community/community_ex_img.png">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="commu_div">
|
|
<div class="nickname_div">
|
|
<p>닉네임</p>
|
|
<p>·</p>
|
|
<p>00:00</p>
|
|
<p>·</p>
|
|
<p>조회 000</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 투표 -->
|
|
<div class="write_box">
|
|
<div class="ca_time">
|
|
<div class="ca_cont">
|
|
<div class="write_ca yellow">투표</div>
|
|
</div>
|
|
<div class="ch_cont">
|
|
<div class="comment_like"><span class="like"></span>2</div>
|
|
<div class="comment_like"><span class="comment"></span>5</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="content">
|
|
<div class="txt_box">
|
|
오늘 점심 뭐 먹을까요?
|
|
</div>
|
|
<ul class="vote_result">
|
|
<li>
|
|
<p>짬뽕</p>
|
|
<p>50개</p>
|
|
</li>
|
|
<li>
|
|
<p>짜장면</p>
|
|
<p>50개</p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="commu_div">
|
|
<div class="nickname_div">
|
|
<p>닉네임</p>
|
|
<p>·</p>
|
|
<p>00:00</p>
|
|
<p>·</p>
|
|
<p>조회 000</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- -->
|
|
<div class="write_box">
|
|
<div class="ca_time">
|
|
<div class="ca_cont">
|
|
<div class="write_ca yellow">자유글</div>
|
|
<div class="write_ca blue">기록</div>
|
|
</div>
|
|
<div class="ch_cont">
|
|
<div class="comment_like"><span class="like"></span>2</div>
|
|
<div class="comment_like"><span class="comment"></span>5</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="content img_txt_cont">
|
|
<div class="txt_box">
|
|
가온이의 하루
|
|
</div>
|
|
</div>
|
|
|
|
<div class="commu_div">
|
|
<div class="nickname_div">
|
|
<p>닉네임</p>
|
|
<p>·</p>
|
|
<p>00:00</p>
|
|
<p>·</p>
|
|
<p>조회 000</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- -->
|
|
<div class="write_box">
|
|
<div class="ca_time">
|
|
<div class="ca_cont">
|
|
<div class="write_ca yellow">자유글</div>
|
|
<div class="write_ca green">#10개월</div>
|
|
<div class="write_ca green">#이유식</div>
|
|
</div>
|
|
<div class="ch_cont">
|
|
<div class="comment_like"><span class="like"></span>2</div>
|
|
<div class="comment_like"><span class="comment"></span>5</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="content img_txt_cont">
|
|
<div class="txt_box">
|
|
10개월 아기 이유식 재료 뭐 쓸 수 있나요?
|
|
</div>
|
|
</div>
|
|
|
|
<div class="commu_div">
|
|
<div class="nickname_div">
|
|
<p>닉네임</p>
|
|
<p>·</p>
|
|
<p>00:00</p>
|
|
<p>·</p>
|
|
<p>조회 000</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- -->
|
|
<div class="write_box">
|
|
<div class="ca_time">
|
|
<div class="ca_cont">
|
|
<div class="write_ca red">칼럼</div>
|
|
</div>
|
|
<div class="ch_cont">
|
|
<div class="comment_like"><span class="like"></span>2</div>
|
|
<div class="comment_like"><span class="comment"></span>5</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="content img_txt_cont">
|
|
<div class="txt_box">
|
|
초기 이유식 무얼 먹일 수 있을까?
|
|
</div>
|
|
</div>
|
|
|
|
<div class="commu_div">
|
|
<div class="nickname_div">
|
|
<p>닉네임</p>
|
|
<p>·</p>
|
|
<p>00:00</p>
|
|
<p>·</p>
|
|
<p>조회 000</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- //오늘의 인기글 목록 -->
|
|
|
|
<!-- 글쓰기 버튼 -->
|
|
<button type="button" class="fix_write_btn">
|
|
<img src="../../img/community/ico_write_white_24.png" alt="">
|
|
</button>
|
|
|
|
</div>
|
|
<!-- //커뮤니티 내용 -->
|
|
|
|
|
|
</div>
|
|
<!-- //wrap -->
|
|
|
|
<!-- 하단 네비 iyu_nav -->
|
|
<nav class="iyu_nav community_nav">
|
|
<ul>
|
|
<li class="nav_list01">
|
|
<a href="../sn_nutrition/view_sn_nutrition_main.html">
|
|
<div class="icon">영양</div>
|
|
<div class="tit">영양</div>
|
|
</a>
|
|
</li>
|
|
<li class="nav_list02">
|
|
<a href="../sn_growth_body/view_sn_growth_main.html">
|
|
<div class="icon">성장</div>
|
|
<div class="tit">성장</div>
|
|
</a>
|
|
</li>
|
|
<li class="nav_list03">
|
|
<a href="../sn_index/index.html">
|
|
<div class="icon">홈</div>
|
|
<div class="tit">홈</div>
|
|
</a>
|
|
</li>
|
|
<li class="nav_list04">
|
|
<a href="../sn_food_information/view_sn_food_information_main.html">
|
|
<div class="icon">식품정보</div>
|
|
<div class="tit">식품정보</div>
|
|
</a>
|
|
</li>
|
|
<li class="nav_list05">
|
|
<a href="../sn_community/list_sn_community.html">
|
|
<div class="icon">커뮤니티</div>
|
|
<div class="tit nav_color">커뮤니티</div>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<!-- //iyu_nav -->
|
|
|
|
|
|
<script>
|
|
// 타이틀 박스 탭
|
|
$(function() {
|
|
$('.write_kind li').click(function() {
|
|
var activeTab = $(this).attr('data-tab');
|
|
$('.write_kind li').removeClass('current');
|
|
// $('.tabcontent').removeClass('current');
|
|
$(this).addClass('current');
|
|
$('#' + activeTab).addClass('current');
|
|
})
|
|
});
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|