"ഫലകം:CategoryPage/styles.css" എന്ന താളിന്റെ പതിപ്പുകൾ തമ്മിലുള്ള വ്യത്യാസം
MediaWiki സംരംഭത്തിൽ നിന്ന്
(ചെ.)No edit summary |
(ചെ.)No edit summary |
||
| വരി 1: | വരി 1: | ||
/* ========================================================== | /* ========================================================== | ||
CATEGORY PAGE STYLES | CATEGORY PAGE STYLES | ||
Abhiprayavedi – Phase B4 | Abhiprayavedi – Editorial Landing Page | ||
Phase B4.2 | |||
.category-page-header { | Layout Regions | ||
background: #edf2f7; | 1. Editorial Hero | ||
padding: 30px 20px; | 2. Editorial Highlights | ||
border-radius: 10px; | 3. Editorial Focus | ||
margin-bottom: 30px; | 4. Editorial Context | ||
border-left: 5px solid #3182ce; | 5. Editorial Archive | ||
Note: | |||
This stylesheet defines page layout only. | |||
Reusable component styling belongs to individual templates. | |||
========================================================== */ | |||
/* ========================================================== | |||
1. EDITORIAL HERO | |||
========================================================== */ | |||
.category-page-header{ | |||
background:#edf2f7; | |||
padding:30px 20px; | |||
border-radius:10px; | |||
margin-bottom:30px; | |||
border-left:5px solid #3182ce; | |||
} | } | ||
.category-page-header h1 { | .category-page-header h1{ | ||
font-family: 'Manjari', 'Meera', sans-serif !important; | font-family:'Manjari','Meera',sans-serif !important; | ||
margin: 0 0 8px | margin:0 0 8px; | ||
color: #1a202c; | color:#1a202c; | ||
} | } | ||
.category-page-header p { | .category-page-header p{ | ||
margin: 0; | margin:0; | ||
color: #4a5568; | color:#4a5568; | ||
} | } | ||
/* | /* ========================================================== | ||
2. EDITORIAL HIGHLIGHTS | |||
========================================================== */ | |||
.category-highlights-grid { | .category-highlights-grid{ | ||
display: grid; | display:grid; | ||
grid-template-columns: repeat(3, 1fr); | grid-template-columns:repeat(3,1fr); | ||
gap: 16px; | gap:16px; | ||
padding: 12px; | padding:12px; | ||
background: # | background:#fff; | ||
border-radius: 12px; | border-radius:12px; | ||
margin-bottom: 30px; | margin-bottom:30px; | ||
width: 100%; | width:100%; | ||
box-sizing: border-box; | box-sizing:border-box; | ||
} | } | ||
.category-highlights-grid > div { | /* Preserve ArticleCard layout inside the grid */ | ||
display: flex !important; | |||
.category-highlights-grid > div{ | |||
display:flex !important; | |||
} | } | ||
/* | /* ========================================================== | ||
3. EDITORIAL FOCUS | |||
Reserved for future implementation | |||
========================================================== */ | |||
. | .category-focus{ | ||
} | } | ||
. | /* ========================================================== | ||
4. EDITORIAL CONTEXT | |||
Reserved for future implementation | |||
========================================================== */ | |||
.category-context{ | |||
} | } | ||
.older-articles- | /* ========================================================== | ||
5. EDITORIAL ARCHIVE | |||
padding- | ========================================================== */ | ||
.older-articles-section{ | |||
margin-top:40px; | |||
padding-top:20px; | |||
border-top:2px dashed #e2e8f0; | |||
} | } | ||
.older-articles- | .older-articles-section h3{ | ||
font-family: 'Manjari', sans-serif !important; | font-family:'Manjari',sans-serif !important; | ||
color:#2d3748; | |||
margin-bottom: | margin-bottom:15px; | ||
} | } | ||
.older-articles-list ul{ | |||
list-style-type:square; | |||
padding-left:20px; | |||
} | |||
.older-articles-list li{ | |||
font-family:'Manjari',sans-serif !important; | |||
font-size:1.05em; | |||
margin-bottom:10px; | |||
color:#4a5568; | |||
} | |||
/* ========================================================== | |||
RESPONSIVE | |||
========================================================== */ | |||
@media (max-width:768px){ | @media (max-width:768px){ | ||
.category-highlights-grid{ | |||
grid-template-columns:1fr; | |||
padding:8px; | |||
gap:10px; | |||
} | |||
} | } | ||
17:46, 2 ജൂലൈ 2026-നു നിലവിലുള്ള രൂപം
/* ==========================================================
CATEGORY PAGE STYLES
Abhiprayavedi – Editorial Landing Page
Phase B4.2
Layout Regions
1. Editorial Hero
2. Editorial Highlights
3. Editorial Focus
4. Editorial Context
5. Editorial Archive
Note:
This stylesheet defines page layout only.
Reusable component styling belongs to individual templates.
========================================================== */
/* ==========================================================
1. EDITORIAL HERO
========================================================== */
.category-page-header{
background:#edf2f7;
padding:30px 20px;
border-radius:10px;
margin-bottom:30px;
border-left:5px solid #3182ce;
}
.category-page-header h1{
font-family:'Manjari','Meera',sans-serif !important;
margin:0 0 8px;
color:#1a202c;
}
.category-page-header p{
margin:0;
color:#4a5568;
}
/* ==========================================================
2. EDITORIAL HIGHLIGHTS
========================================================== */
.category-highlights-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
padding:12px;
background:#fff;
border-radius:12px;
margin-bottom:30px;
width:100%;
box-sizing:border-box;
}
/* Preserve ArticleCard layout inside the grid */
.category-highlights-grid > div{
display:flex !important;
}
/* ==========================================================
3. EDITORIAL FOCUS
Reserved for future implementation
========================================================== */
.category-focus{
}
/* ==========================================================
4. EDITORIAL CONTEXT
Reserved for future implementation
========================================================== */
.category-context{
}
/* ==========================================================
5. EDITORIAL ARCHIVE
========================================================== */
.older-articles-section{
margin-top:40px;
padding-top:20px;
border-top:2px dashed #e2e8f0;
}
.older-articles-section h3{
font-family:'Manjari',sans-serif !important;
color:#2d3748;
margin-bottom:15px;
}
.older-articles-list ul{
list-style-type:square;
padding-left:20px;
}
.older-articles-list li{
font-family:'Manjari',sans-serif !important;
font-size:1.05em;
margin-bottom:10px;
color:#4a5568;
}
/* ==========================================================
RESPONSIVE
========================================================== */
@media (max-width:768px){
.category-highlights-grid{
grid-template-columns:1fr;
padding:8px;
gap:10px;
}
}