✨ Add: Twitter Category

StopWarKr · May 2, 2022 · 3235a33 · 3235a33
1 parent 9735255
commit 3235a33
Show file tree

Hide file tree

Showing 5 changed files with 35 additions and 0 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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);