Template:PeopleArticle.css

From TwogPedia
Revision as of 02:56, 25 April 2025 by Admin (talk | contribs) (Created page with ".people__grid { display: grid; grid-template-columns: 70% 30%; gap: 20px; padding: 10px 0; } .container-person-twogpedia { border-radius: 8px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .related__news__container h3, .news__grid > div > p { margin-top: 0; color: white; } .related__news { display: flex; flex-direction: column; gap: 2rem; height: 100%; } .related__news__container { display: flex; flex-direction: column; gap: 0.75rem;...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

.people__grid {

 display: grid;
 grid-template-columns: 70% 30%;
 gap: 20px;
 padding: 10px 0;

}

.container-person-twogpedia {

 border-radius: 8px;
 box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

}

.related__news__container h3, .news__grid > div > p { margin-top: 0; color: white; }

.related__news { display: flex;

   flex-direction: column;
   gap: 2rem;
   height: 100%;

}

.related__news__container { display: flex;

   flex-direction: column;
   gap: 0.75rem;
   height: 100%;

}

.news-meta-container, .news-meta-content-twogpedia {

   padding: 10px 0;
   border-bottom: 2px solid #77737A;

}

.related__article { position: relative; }

.related__article img { max-width: 100%; height: auto; }

@media (max-width: 768px) {

 .people__grid {
   grid-template-columns: 100%;
   width: 100%;
 }
 .container-related-news-twogpedia {
   margin-top: 20px;
 }
 
 .content-container-person-twogpedia p {
 	font-size: 12px;
 	color: #C1C1CD;
 }
 
 .container-related-news-twogpedia {
 	display: none;
 }
 

}

@media (min-width: 768px) { .container-related-news-twogpedia { padding-left: 20px; padding-right: 14px; border-left: 1px solid #77737A; }

.content-container-person-twogpedia p { color: #C1C1CD; }

.people__grid { margin: 50px 34px; }

.news__grid { display: grid; grid-template-columns: 2.3fr 1fr; margin: 0 30px; gap: 2rem; }

.news__grid > div:last-child { border-left: 1px solid #77737A; padding-left: 20px; }

.news-content { display: none; } }