From 3235a33af91a2c47b0ae8a0f45c9a0277a1f8e0b Mon Sep 17 00:00:00 2001
From: bananajeong <73640737+Najeong-Kim@users.noreply.github.com>
Date: Tue, 3 May 2022 00:05:33 +0900
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Add:=20Twitter=20Category?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 css/style.css           |  8 ++++++++
 html/main_category.html |  3 +++
 index.html              |  3 +++
 js/common/constants.js  |  1 +
 js/modules/category.js  | 20 ++++++++++++++++++++
 5 files changed, 35 insertions(+)

diff --git a/css/style.css b/css/style.css
index 1e91f2555..0ff45bd6f 100644
--- a/css/style.css
+++ b/css/style.css
@@ -389,6 +389,14 @@ img {
     16px;
   color: #fff;
 }
+
+.twitter-description {
+  overflow: hidden;
+  margin: 15px 0;
+  font-size: 15px;
+  line-height: 1.6;
+  text-overflow: ellipsis;
+}
 /* main card : end --------------------------------*/
 
 /* aside : start --------------------------------*/
diff --git a/html/main_category.html b/html/main_category.html
index f3e0bdb6b..adb649ba6 100644
--- a/html/main_category.html
+++ b/html/main_category.html
@@ -87,6 +87,9 @@ <h2>뉴스정보</h2>
 				<li class="category-bg">
 					<button class="category-tit category-btn">카테고리</button>
 				</li>
+        <li class="category-bg">
+          <button class="category-tit twitter-btn">트위터</button>
+        </li>
 			</ul>
 			<!-- //카테고리 -->
 
diff --git a/index.html b/index.html
index a6668a92b..53e02b85f 100644
--- a/index.html
+++ b/index.html
@@ -157,6 +157,9 @@ <h2>뉴스정보</h2>
           <li class="category-bg">
             <button class="category-tit sponsor-btn">후원</button>
           </li>
+          <li class="category-bg">
+            <button class="category-tit twitter-btn">트위터</button>
+          </li>
         </ul>
         <!-- //카테고리 -->
 
diff --git a/js/common/constants.js b/js/common/constants.js
index ce6d051e6..19a9224be 100644
--- a/js/common/constants.js
+++ b/js/common/constants.js
@@ -10,6 +10,7 @@ const AllCategory = {
   'damage-btn': 'kr_DamageNewsData.json',
   'combat-btn': 'kr_BattleNewsData.json',
   'sponsor-btn': 'kr_SponsorNewsData.json',
+  'twitter-btn': 'Twitter.json',
 };
 
 export { IMG_URL, BASE_URL, AllCategory };
diff --git a/js/modules/category.js b/js/modules/category.js
index 2743ccae8..b5235c9c2 100644
--- a/js/modules/category.js
+++ b/js/modules/category.js
@@ -29,6 +29,26 @@ const renderCard = (news, inputValue) => {
   article.appendChild(link);
   link.appendChild(imgBox);
   imgBox.appendChild(img);
+
+  if (news.catagory === '트위터') {
+    img.setAttribute(
+      'src',
+      'https://play-lh.googleusercontent.com/8sc6LSo3dRf54GaLdQR8UZfzd_fgHgWMJlNxGLP1HWPEU7YY4UxkyHc8-qCNwtyiqO55=s360-rw',
+    );
+    img.setAttribute('alt', news.catagory);
+
+    const twitterDescription = document.createElement('p');
+    twitterDescription.classList.add('twitter-description');
+    twitterDescription.textContent = news.description_ko;
+
+    link.appendChild(contentsBox);
+    contentsBox.appendChild(time).textContent = news.date;
+    contentsBox.appendChild(source).textContent = ' 출처 : 트위터';
+    contentsBox.appendChild(twitterDescription);
+
+    return newsCard;
+  }
+
   if (news.image_path) {
     if (news.image_path.slice(0, 5) == 'https') {
       img.setAttribute('src', news.image_path);