.news-landing { display: flex; flex-direction: column; gap: 1rem; }
.news-landing h3 { margin: 0; }
- news-search-container {
display: grid;
grid-template-columns: 1fr; gap: 1rem; max-width: 700px; margin-bottom: 2rem;
}
.news-landing-divider { border-bottom: 1px solid black;} /* Landing top boxes */ .news-landing-top, .news-landing-bot { display: grid; grid-template-columns: 2.3fr 1fr; gap: 2rem; align-items: center; }
/* SLIDER */
- news-slider {
position: relative; overflow: hidden; align-self: self-start; }
- news-slider-container {
display: flex; width: 100%; height: 100%; transition: transform 0.5s ease-in-out; }
.news-item, .news-cat-item { position: relative; flex: 0 0 100%; overflow: hidden; width: 100%; height: 100%; } .news-item a, .news-cat-item a { width: 100%; height: 100%; } .news-item img, .news-featured img, .news-latest-item img, .news-cat-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.news-title, .news-cat-info { position: absolute; bottom: 0; left: 0; right: 0; background: rgb(0, 0, 0); color: white; padding: 8px; text-align: center; }
- prev, #next {
z-index: 1; position: absolute; top: 50%; transform: translateY(-50%); font-size: 18px; padding: 10px; background-color: #ddd; border: none; cursor: pointer; }
- prev { left: 0; }
- next { right: 0; }
/* END OF SLIDER */
/* FEATURED */ .news-featured-container { display: flex; flex-direction: column; gap: 0.5rem;
height: 100%;
}
.news-featured-items { display: flex; flex-direction: column; justify-content: space-between; height: 100%; } .news-featured { position: relative; /*width: 300px;*/ /*max-width: 100%;*/ }
.news-featured a { display: block; width: 100%; }
/* END OF FEATURED */
/* LATEST LIST */ .news-latest-container { display: flex; flex-direction: column; gap: 1rem; align-self: start; }
.news-latest-categories { display: flex; gap: 0.5rem; justify-content: space-between; } .active-cat { font-weight: bold; } .news-latest { display: flex; flex-direction: column; gap: 1rem; overflow-x: scroll;
max-height: 1050px;
}
.news-latest-item { display: grid; grid-template-columns: minmax(300px, 1fr) 1fr; gap: 0.5rem; position: relative; }
.news-latest-item a { display: block; width: 100%; }
.news-latest-item-text { display: flex; flex-direction: column; justify-content: space-between; gap: 0.5rem; }
.news-latest-item-title { font-size: 1.1rem;
font-weight: bold;
}
.link-overlay a { display: inline; }
/* END OF LATEST LIST */
/* HOT */ .news-hot { align-self: start; display: flex; flex-direction: column; gap: 1rem; }
.news-hot-items { display: flex; flex-direction: column; gap: 1rem; } /* END OF HOT */
/* CATEGORY SPECIFIC TOP 2 NEWS */
- news-cat-top {
display: grid;
grid-template-columns: 1fr 1fr; gap: 2rem;
} .news-cat-info { position: absolute; bottom: 0; left: 0; right: 0; background: rgb(0, 0, 0); color: white; padding: 8px; text-align: center; text-align: left; } .news-cat-title { font-size: 1.2rem; }
.news-cat-date { font-size: 0.8rem; } .news-cat-item:nth-child(2) .news-cat-info { text-align: right; }
/* END OF CATEGORY SPECIFIC TOP 2 */
/* NEWS DRAMA */ .news-drama-title { font-size: 1.2rem;
font-weight: bold;
} /* END OF NEWS DRAMA */ /* Media queries */ @media only screen and (max-width: 700px) { .news-landing-top, .news-landing-bot { grid-template-columns: 1fr; } .news-latest { max-height: none; } .news-latest-item { grid-template-columns: 1fr; }
#news-cat-top { grid-template-columns: 1fr; } .news-cat-info { text-align: center; }
.news-cat-item:nth-child(2) .news-cat-info { text-align: center; } }