|
|
| (ഒരേ ചെയ്ത ഇടയ്ക്കുള്ള 159 നാൾപ്പതിപ്പുകൾ പ്രദർശിപ്പിക്കുന്നില്ല) |
| വരി 1: |
വരി 1: |
| /* ================================================================ | | /* ========================================================================== |
| AbhiprayaVedi - Ver4.1 — Timeless Skin, Gap Fix | | 1. LOAD MALAYALAM GOOGLE FONTS |
| ================================================================ */ | | ========================================================================== */ |
| | @import url('https://smc.org.in/fonts/manjari.css'); |
|
| |
|
| /* ---------------------------------------------------------------- | | /* GLOBAL FONTS FORCE (Combined to eliminate duplications) */ |
| TIMELESS SKIN: Reduce gap between tab bar and article content
| | :lang(ml), :lang(ml) *, |
| Timeless adds padding inside #mw-content-text and also the
| | body:lang(ml), .mw-body:lang(ml), .mw-body-content:lang(ml), #content:lang(ml), |
| .article-container itself has top padding — both must be zeroed.
| | .mw-parser-output:lang(ml), .article-content:lang(ml), .article-content *, |
| ---------------------------------------------------------------- */
| | .intro-box:lang(ml), p:lang(ml), span:lang(ml), div:lang(ml), |
| | | h1:lang(ml), h2:lang(ml), h3:lang(ml), h4:lang(ml), |
| #firstHeading { | | #firstHeading, .mw-first-heading, .firstHeading { |
| margin-bottom: 4px !important; | | font-family: 'Manjari', 'Meera', 'Rachana', 'Noto Sans Malayalam', 'Nirmala UI', sans-serif !important; |
| padding-bottom: 2px !important;
| |
| } | | } |
|
| |
|
| /* Timeless-specific: this is the direct parent of .mw-parser-output */
| | .article-content, |
| #mw-content-text {
| | .article-byline, |
| padding-top: 0 !important; | | .author-profile-bio, |
| margin-top: 0 !important;
| | .author-card, |
| | .author-card-name, |
| | .author-card-bio, |
| | .article-title, |
| | .related-heading, |
| | .author-heading, |
| | .article-meta-row, |
| | .article-author { |
| | font-family: 'Manjari', |
| | 'Meera', |
| | 'Rachana', |
| | 'Noto Sans Malayalam', |
| | sans-serif !important; |
| } | | } |
|
| |
|
| .mw-body-content {
| |
| margin-top: 0 !important;
| |
| padding-top: 0 !important;
| |
| }
| |
|
| |
|
| .mw-parser-output {
| | /* GLOBAL MINOR TWEAKS */ |
| margin-top: 0 !important; | | body { |
| padding-top: 0 !important;
| | line-height: 1.7; |
| } | | } |
| | | .article-content * { |
| /* Timeless wraps everything in .page-content — zero that too */
| | line-height: 1.85 !important; |
| .page-content {
| |
| padding-top: 0 !important; | |
| margin-top: 0 !important;
| |
| }
| |
| | |
| /* ================================================================
| |
| BASE FONT SIZE
| |
| ================================================================ */
| |
| | |
| body {
| |
| font-size: 17px;
| |
| } | | } |
|
| |
|
| /* Timeless skin content area selector (replaces #content) */ | | /* ========================================================================== |
| .mw-body { | | 2. HEADINGS & TITLES |
| font-size: 1.05em; | | ========================================================================== */ |
| | #firstHeading, .mw-first-heading, .firstHeading { |
| | font-size: 2.35em !important; |
| | font-weight: 700 !important; |
| | margin-bottom: 0.4em !important; |
| | color: #222; |
| | border-bottom: solid 4px #36c; |
| } | | } |
| | | :lang(en) #firstHeading, :lang(en) .mw-first-heading { |
| /* ================================================================
| | font-size: 2.45em !important; |
| ARTICLE CONTAINER
| |
| ================================================================ */
| |
| | |
| .article-container {
| |
| max-width: 1200px;
| |
| margin: 0 auto;
| |
| padding: 0 20px 20px 20px; /* FIX: top padding 0 — removes gap under title */
| |
| font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
| |
| font-size: 1.05em; | |
| } | | } |
|
| |
|
| /* Suppress empty <p> tags the wikitext parser inserts before/after divs */ | | /* HIDE NAMESPACE SUBTITLE FOR PUBLISHED ARTICLES */ |
| .mw-parser-output > p:empty, | | .mw-displaytitle-subtitle { |
| .article-container > p:empty {
| |
| display: none !important; | | display: none !important; |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| } | | } |
|
| |
|
| /* Malayalam Font Support */ | | /* ========================================================================== |
| .article-container[data-language="Malayalam"] {
| | 3. LAYOUT & SIDEBARS (FULL WIDTH) |
| font-family: 'Manjari', 'Meera', 'Rachana', 'AnjaliOldLipi', 'Noto Sans Malayalam', sans-serif;
| | ========================================================================== */ |
| line-height: 1.75;
| | #mw-site-navigation, #mw-related-navigation { |
| }
| | display: none !important; |
| | |
| /* ================================================================
| |
| HEADER - Timeless: force compact, override any skin defaults
| |
| ================================================================ */
| |
| | |
| .article-header { | |
| background: #f8f9fa;
| |
| border-bottom: 2px solid #495057;
| |
| padding: 6px 16px !important; /* !important to override Timeless defaults */
| |
| margin-top: 0 !important;
| |
| margin-bottom: 10px !important;
| |
| border-radius: 6px;
| |
| }
| |
| .article-container .author-info p {
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| display: contents !important;
| |
| }
| |
| .author-info {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
| justify-content: space-between !important;
| |
| gap: 15px;
| |
| flex-wrap: wrap;
| |
| font-size: 1.1em;
| |
| }
| |
| | |
| .author-name {
| |
| font-weight: 700;
| |
| font-size: 1.3em;
| |
| color: #212529;
| |
| flex: 0 0 auto;
| |
| }
| |
| | |
| .date-info {
| |
| color: #6c757d;
| |
| font-size: 1.05em;
| |
| flex: 1 1 auto;
| |
| text-align: center;
| |
| }
| |
| | |
| .category-badge {
| |
| background: #667eea;
| |
| color: white;
| |
| padding: 5px 12px;
| |
| border-radius: 20px;
| |
| font-size: 0.88em;
| |
| font-weight: 600;
| |
| flex: 0 0 auto;
| |
| }
| |
| | |
| /* ================================================================
| |
| INTRODUCTION
| |
| ================================================================ */
| |
| .article-container .introduction-section p {
| |
| margin: 0 !important; | |
| padding: 0 !important;
| |
| } | | } |
| .introduction-section {
| | #mw-content-container { |
| background: linear-gradient(135deg, #fff9e6 0%, #fff3cd 100%);
| |
| border-left: 5px solid #f59e0b;
| |
| padding: 10px 10px !important; /* !important to override Timeless */
| |
| margin-top: 0 !important;
| |
| margin-bottom: 10px !important;
| |
| border-radius: 6px;
| |
| font-size: 1.12em;
| |
| line-height: 1.45;
| |
| color: #78350f;
| |
| font-weight: 550;
| |
| }
| |
| | |
| /* ================================================================
| |
| CONTENT LAYOUT
| |
| ================================================================ */
| |
| | |
| .content-wrapper {
| |
| display: flex;
| |
| gap: 30px;
| |
| margin-bottom: 30px;
| |
| }
| |
| | |
| .main-content {
| |
| flex: 1 1 70%;
| |
| min-width: 0;
| |
| }
| |
| | |
| .right-sidebar {
| |
| flex: 0 0 300px;
| |
| }
| |
| | |
| @media (max-width: 968px) {
| |
| .content-wrapper {
| |
| flex-direction: column;
| |
| }
| |
| .right-sidebar {
| |
| flex: 1 1 auto;
| |
| max-width: 100%;
| |
| }
| |
| }
| |
| | |
| /* ================================================================
| |
| ARTICLE TEXT
| |
| ================================================================ */
| |
| | |
| .article-text {
| |
| font-size: 1.15em;
| |
| line-height: 1.85;
| |
| color: #212529;
| |
| text-align: left;
| |
| }
| |
| | |
| .article-text p {
| |
| margin-bottom: 1.2em;
| |
| }
| |
| | |
| .article-text h2 {
| |
| font-size: 1.6em;
| |
| margin-top: 1.5em;
| |
| margin-bottom: 0.8em;
| |
| color: #212529;
| |
| border-bottom: 2px solid #dee2e6;
| |
| padding-bottom: 0.3em;
| |
| }
| |
| | |
| .article-text h3 {
| |
| font-size: 1.3em;
| |
| margin-top: 1.3em;
| |
| margin-bottom: 0.7em;
| |
| color: #495057;
| |
| }
| |
| | |
| /* ================================================================
| |
| IMAGES
| |
| ================================================================ */
| |
| | |
| /* ================================================================
| |
| MODERN MEDIAWIKI FILE/IMAGE RENDERING (figure-based, 1.38+)
| |
| Timeless uses figure[typeof~="mw:File/Thumb"] not .thumb
| |
| ================================================================ */
| |
| | |
| /* Left-aligned image — remove left margin so it sits flush */
| |
| .article-container figure[typeof~="mw:File/Thumb"] {
| |
| margin-left: 0 !important; | | margin-left: 0 !important; |
| margin-right: 20px !important; | | margin-right: 0 !important; |
| margin-bottom: 6px !important; | | padding-left: 1rem !important; |
| | padding-right: 1rem !important; |
| | max-width: 100% !important; |
| } | | } |
| | | #content { |
| /* Kill the skin's margin on the image element itself */
| | max-width: 100% !important; |
| .article-container figure[typeof~="mw:File/Thumb"] > :not(figcaption).mw-file-element {
| |
| margin: 0 !important; | |
| } | | } |
|
| |
|
| /* Reduce padding below caption */ | | /* ========================================================================== |
| .article-container figure[typeof~="mw:File/Thumb"] figcaption { | | 4. FIXED: HIDE PAGE TABS FOR ANONYMOUS USERS ONLY |
| padding: 4px 4px !important;
| | ========================================================================== */ |
| margin-top: 2px !important;
| | .anon-visitor #mw-page-header-links, |
| line-height: 1.4 !important;
| | .anon-visitor #siteSub { |
| font-size: 0.92em !important; | | display: none !important; |
| } | | } |
| | | .anon-visitor #mw-site-navigation, |
| /* Also keep old .thumb rules for backward compatibility */
| | .anon-visitor #mw-related-navigation { |
| .article-container .thumb { | | display: none !important; |
| margin-left: 0 !important; | |
| margin-bottom: 4px !important;
| |
| } | | } |
| | | /* ========================================================================== |
| .image-left {
| | 5. LOGO INTEGRATION FOR DISPLAY NAME PLACE |
| float: left;
| | ========================================================================== */ |
| margin: 0 20px 8px 0;
| | .mw-wiki-title { |
| max-width: 420px;
| | font-family: 'Manjari', sans-serif !important; |
| }
| |
| | |
| .image-left .thumb {
| |
| background: #f8f9fa;
| |
| border: 1px solid #dee2e6;
| |
| }
| |
| | |
| .content-image {
| |
| margin: 15px 0 8px 0;
| |
| clear: both;
| |
| }
| |
| | |
| .thumb {
| |
| margin-bottom: 6px !important;
| |
| }
| |
| | |
| .thumbinner {
| |
| padding-bottom: 4px !important;
| |
| }
| |
| | |
| .thumbcaption {
| |
| font-size: 0.95em !important;
| |
| line-height: 1.45 !important;
| |
| padding: 5px 6px !important;
| |
| }
| |
| | |
| /* ================================================================ | |
| AUTHOR INFOBOX
| |
| ================================================================ */
| |
| | |
| .author-infobox { | |
| background: #f8f9fa;
| |
| border: 1px solid #ced4da;
| |
| border-radius: 8px;
| |
| margin-bottom: 10px;
| |
| overflow: hidden;
| |
| }
| |
| | |
| .author-photo {
| |
| text-align: center;
| |
| padding: 10px;
| |
| background: white;
| |
| border-bottom: 1px solid #dee2e6;
| |
| }
| |
| | |
| .author-photo img {
| |
| max-width: 100%;
| |
| height: auto;
| |
| border-radius: 6px;
| |
| }
| |
| | |
| .author-name-box {
| |
| text-align: center;
| |
| padding: 10px 15px;
| |
| font-size: 1.2em;
| |
| font-weight: 500;
| |
| color: #212529;
| |
| background: #e9ecef;
| |
| border-bottom: 1px solid #dee2e6;
| |
| }
| |
| | |
| .author-name-box a {
| |
| color: #0056b3;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .author-name-box a:hover {
| |
| text-decoration: underline;
| |
| }
| |
| | |
| .author-bio {
| |
| padding: 12px 15px;
| |
| font-size: 1em;
| |
| line-height: 1.65;
| |
| color: #495057;
| |
| }
| |
| | |
| /* ================================================================
| |
| HIGHLIGHTS
| |
| ================================================================ */
| |
| | |
| .highlight-box { | |
| background: #d4edda;
| |
| border: 1px solid #c3e6cb;
| |
| border-left: 4px solid #28a745;
| |
| border-radius: 6px;
| |
| margin-bottom: 8px;
| |
| overflow: hidden;
| |
| }
| |
| | |
| .highlight-title {
| |
| background: #28a745;
| |
| color: white;
| |
| padding: 7px 14px;
| |
| font-size: 1.3em; | |
| text-align: center;
| |
| }
| |
| | |
| .highlight-text {
| |
| padding: 12px 12px;
| |
| font-size: 1em;
| |
| line-height: 1.65;
| |
| color: #155724;
| |
| }
| |
| | |
| /* ================================================================
| |
| KEY POINTS
| |
| ================================================================ */
| |
| | |
| .keypoints-float {
| |
| background: #fff3cd;
| |
| border: 1px solid #ffc107;
| |
| border-radius: 6px;
| |
| overflow: hidden;
| |
| margin-bottom: 20px;
| |
| }
| |
| | |
| .keypoints-header {
| |
| background: #ffc107;
| |
| color: #212529;
| |
| padding: 7px 14px;
| |
| font-size: 1.3em;
| |
| text-align: center;
| |
| }
| |
| | |
| .keypoints-list {
| |
| list-style: none;
| |
| padding: 0;
| |
| margin: 0;
| |
| }
| |
| | |
| .keypoints-list li {
| |
| padding: 11px 14px 11px 30px;
| |
| border-bottom: 1px solid #ffeaa7;
| |
| position: relative;
| |
| font-size: 1em;
| |
| line-height: 1.6;
| |
| color: #856404;
| |
| }
| |
| | |
| .keypoints-list li:nth-child(1) {
| |
| margin-bottom: 4px;
| |
| }
| |
| | |
| .keypoints-list li:last-child {
| |
| border-bottom: none;
| |
| }
| |
| | |
| .keypoints-list li:before {
| |
| content: "▸";
| |
| position: absolute;
| |
| left: 12px;
| |
| color: #f59e0b;
| |
| font-weight: bold; | | font-weight: bold; |
| font-size: 1.1em; | | font-size: 22px; |
| | color: #002B49 !important; /* Deep Navy */ |
| } | | } |
| | @media (max-width: 768px) { |
|
| |
|
| /* ================================================================
| | #mw-content-container { |
| SOURCE ATTRIBUTION
| | padding-left: 8px !important; |
| ================================================================ */
| | padding-right: 8px !important; |
| | |
| .source-attribution {
| |
| background: #e7f3ff;
| |
| border: 1px solid #bee5eb;
| |
| border-left: 4px solid #17a2b8;
| |
| padding: 12px 16px;
| |
| margin: 20px 0;
| |
| border-radius: 6px;
| |
| font-size: 1em;
| |
| line-height: 1.65;
| |
| color: #0c5460; | |
| }
| |
| | |
| .source-attribution a {
| |
| color: #0056b3;
| |
| text-decoration: underline;
| |
| }
| |
| | |
| /* ================================================================
| |
| MOBILE RESPONSIVE
| |
| ================================================================ */
| |
| | |
| @media (max-width: 768px) {
| |
| .author-info {
| |
| flex-direction: column; | |
| align-items: flex-start; | |
| gap: 10px;
| |
| } | | } |
| .date-info {
| | |
| text-align: left; | | #p-logo-text { |
| | min-width: auto !important; |
| | width: 240px !important; |
| | max-width: 240px !important; |
| } | | } |
| .category-badge {
| |
| align-self: flex-start;
| |
| }
| |
| }
| |
|
| |
| /* ================================================================
| |
| PRINT
| |
| ================================================================ */
| |
|
| |
|
| @media print {
| |
| .article-container {
| |
| max-width: 100%;
| |
| font-size: 12pt;
| |
| }
| |
| .content-wrapper {
| |
| display: block;
| |
| }
| |
| .right-sidebar {
| |
| float: right;
| |
| width: 250px;
| |
| margin-left: 20px;
| |
| }
| |
| } | | } |
|
| |
|
| /* ================================================================
| | @media (max-width: 768px) { |
| ACCESSIBILITY
| |
| ================================================================ */
| |
| | |
| a:focus,
| |
| button:focus {
| |
| outline: 2px solid #667eea;
| |
| outline-offset: 2px;
| |
| }
| |
|
| |
|
| @media (prefers-contrast: high) {
| | #p-banner { |
| .article-container { | | width: 240px !important; |
| border: 2px solid currentColor; | | height: 38px !important; |
| }
| |
| .article-header {
| |
| border-bottom: 3px solid currentColor; | |
| } | | } |
| }
| |
|
| |
| /* ================================================================
| |
| ABHIPRAYAVEDI HOMEPAGE STYLES
| |
| Append these to MediaWiki:Common.css after existing rules.
| |
| All classes prefixed with "av-" to avoid conflicts with
| |
| Timeless skin and MediaWiki default classes.
| |
| ================================================================ */
| |
|
| |
| /* ----------------------------------------------------------------
| |
| FIX: Timeless h1/h2 top margins on main page are too large.
| |
| Scoped to .av-homepage to avoid affecting article pages.
| |
| ---------------------------------------------------------------- */
| |
|
| |
| .av-homepage {
| |
| max-width: 1200px;
| |
| margin: 0 auto;
| |
| padding: 0 16px 30px 16px;
| |
| font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
| |
| 'Manjari', 'Noto Sans Malayalam', sans-serif;
| |
| }
| |
|
| |
| /* Suppress empty <p> tags parser generates between divs */
| |
| .av-homepage > p:empty {
| |
| display: none !important;
| |
| margin: 0 !important;
| |
| }
| |
|
| |
| /* ----------------------------------------------------------------
| |
| SECTION HEADERS — bilingual, consistent font sizing
| |
| Using spans instead of h= elements avoids Timeless margin issues.
| |
| ---------------------------------------------------------------- */
| |
|
| |
| .av-section-header {
| |
| margin: 24px 0 12px 0;
| |
| padding-bottom: 6px;
| |
| border-bottom: 3px solid #495057;
| |
| line-height: 1.3;
| |
| }
| |
|
| |
| .av-section-title-en {
| |
| font-size: 1.25em;
| |
| font-weight: 700;
| |
| color: #212529;
| |
| font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
| |
| }
| |
|
| |
| .av-section-title-ml {
| |
| /* Malayalam script renders optically larger at same em size —
| |
| reduce slightly to visually match the English label */
| |
| font-size: 1.2em;
| |
| font-weight: 700;
| |
| color: #495057;
| |
| font-family: 'Manjari', 'Meera', 'Noto Sans Malayalam', sans-serif;
| |
| }
| |
|
| |
| .av-section-divider {
| |
| color: #adb5bd;
| |
| font-size: 1.1em;
| |
| margin: 0 4px;
| |
| }
| |
|
| |
| /* ----------------------------------------------------------------
| |
| FEATURED ARTICLE
| |
| ---------------------------------------------------------------- */
| |
| .av-featured {
| |
| display: flex !important;
| |
| gap: 20px;
| |
| align-items: flex-start;
| |
| background: #f8f9fa;
| |
| border-left: 5px solid #667eea;
| |
| border-radius: 8px;
| |
| padding: 16px;
| |
| margin-bottom: 8px;
| |
| }
| |
|
| |
| .av-featured-image {
| |
| flex: 0 0 260px;
| |
| max-width: 260px;
| |
| }
| |
|
| |
| .av-featured-image img {
| |
| width: 260px !important;
| |
| height: auto;
| |
| border-radius: 6px;
| |
| display: block;
| |
| }
| |
|
| |
| /* Kill <p> wrapper MediaWiki inserts around [[File:]] */
| |
| .av-featured-image p {
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| line-height: 0 !important;
| |
| font-size: 0 !important;
| |
| }
| |
|
| |
| .av-featured-body {
| |
| flex: 1 1 auto;
| |
| min-width: 0;
| |
| }
| |
|
| |
| .av-featured-title {
| |
| font-size: 1.45em;
| |
| font-weight: 700;
| |
| line-height: 1.4;
| |
| margin-bottom: 10px;
| |
| font-family: 'Manjari', 'Meera', 'Noto Sans Malayalam',
| |
| -apple-system, sans-serif;
| |
| }
| |
|
| |
| .av-featured-title a {
| |
| color: #212529;
| |
| text-decoration: none;
| |
| }
| |
|
| |
| .av-featured-title a:hover {
| |
| color: #667eea;
| |
| text-decoration: underline;
| |
| }
| |
|
| |
| .av-featured-intro {
| |
| font-size: 1.05em;
| |
| line-height: 1.75;
| |
| color: #495057;
| |
| margin-bottom: 12px;
| |
| font-family: 'Manjari', 'Meera', 'Noto Sans Malayalam', -apple-system, sans-serif;
| |
| max-height: 200px;
| |
| overflow: hidden;
| |
| }
| |
|
| |
| .av-featured-meta {
| |
| display: flex;
| |
| gap: 10px;
| |
| align-items: center;
| |
| font-size: 0.92em;
| |
| }
| |
|
| |
| /* ----------------------------------------------------------------
| |
| TOP STORIES — 3-column card row
| |
| ---------------------------------------------------------------- */
| |
|
| |
| .av-cards-row {
| |
| display: flex;
| |
| gap: 20px;
| |
| margin-bottom: 8px;
| |
| }
| |
|
| |
| /* Fix story card height uniformity */
| |
| .av-story-card {
| |
| align-items: stretch;
| |
| }
| |
|
| |
| .av-story-card .av-card-image img {
| |
| width: 100%;
| |
| height: 180px;
| |
| object-fit: cover;
| |
| display: block;
| |
| }
| |
|
| |
| .av-card-noimage {
| |
| width: 100%;
| |
| height: 120px;
| |
| background: #e9ecef;
| |
| }
| |
|
| |
| .av-card-body {
| |
| padding: 12px 14px;
| |
| display: flex;
| |
| flex-direction: column;
| |
| gap: 6px;
| |
| flex: 1 1 auto;
| |
| }
| |
|
| |
| .av-card-title {
| |
| font-size: 1.05em;
| |
| font-weight: 700;
| |
| line-height: 1.4;
| |
| font-family: 'Manjari', 'Meera', 'Noto Sans Malayalam',
| |
| -apple-system, sans-serif;
| |
| }
| |
|
| |
| .av-card-title a {
| |
| color: #212529;
| |
| text-decoration: none;
| |
| }
| |
|
| |
| .av-card-title a:hover {
| |
| color: #667eea;
| |
| }
| |
|
| |
| .av-card-intro {
| |
| font-size: 0.95em;
| |
| color: #6c757d;
| |
| line-height: 1.6;
| |
| font-family: 'Manjari', 'Meera', 'Noto Sans Malayalam',
| |
| -apple-system, sans-serif;
| |
| }
| |
|
| |
| .av-card-meta {
| |
| font-size: 0.85em;
| |
| color: #868e96;
| |
| margin-top: auto;
| |
| padding-top: 6px;
| |
| border-top: 1px solid #f1f3f5;
| |
| }
| |
|
| |
| /* ----------------------------------------------------------------
| |
| LATEST ARTICLES — auto grid (SMW or manual)
| |
| ---------------------------------------------------------------- */
| |
|
| |
| .av-latest-grid {
| |
| display: grid;
| |
| grid-template-columns: repeat(4, 1fr);
| |
| gap: 16px;
| |
| margin-bottom: 8px;
| |
| }
| |
|
| |
| .av-latest-card {
| |
| background: white;
| |
| border: 1px solid #dee2e6;
| |
| border-radius: 8px;
| |
| overflow: hidden;
| |
| display: flex;
| |
| flex-direction: column;
| |
| }
| |
|
| |
| /* ----------------------------------------------------------------
| |
| META BADGES shared across featured/cards/latest
| |
| ---------------------------------------------------------------- */
| |
|
| |
| .av-meta-author {
| |
| font-weight: 600;
| |
| color: #495057;
| |
| }
| |
|
| |
| .av-meta-date {
| |
| color: #868e96;
| |
| }
| |
|
| |
| .av-meta-category {
| |
| background: #667eea;
| |
| color: white;
| |
| padding: 2px 10px;
| |
| border-radius: 12px;
| |
| font-size: 0.82em;
| |
| font-weight: 600;
| |
| }
| |
|
| |
| /* ----------------------------------------------------------------
| |
| BROWSE BY LANGUAGE
| |
| ---------------------------------------------------------------- */
| |
|
| |
| .av-browse-row {
| |
| display: flex;
| |
| gap: 20px;
| |
| margin-bottom: 8px;
| |
| }
| |
|
| |
| .av-browse-box {
| |
| flex: 1 1 0;
| |
| padding: 16px 20px;
| |
| border-radius: 8px;
| |
| }
| |
|
| |
| .av-browse-ml {
| |
| background: #e8f4fd;
| |
| border-left: 4px solid #4a9edd;
| |
| }
| |
|
| |
| .av-browse-en {
| |
| background: #fff8e6;
| |
| border-left: 4px solid #f59e0b;
| |
| }
| |
|
| |
| .av-browse-heading {
| |
| font-size: 1.15em;
| |
| font-weight: 700;
| |
| margin-bottom: 10px;
| |
| color: #212529;
| |
| font-family: 'Manjari', 'Meera', 'Noto Sans Malayalam',
| |
| -apple-system, sans-serif;
| |
| }
| |
|
| |
|
| .av-browse-list {
| | #simpleSearch { |
| list-style: none;
| | margin-left: 30px !important; |
| padding: 0;
| |
| margin: 0; | |
| }
| |
| | |
| .av-browse-list li {
| |
| padding: 5px 0;
| |
| border-bottom: 1px solid rgba(0,0,0,0.07);
| |
| font-size: 0.98em;
| |
| }
| |
| | |
| .av-browse-list li:last-child {
| |
| border-bottom: none;
| |
| }
| |
| | |
| .av-browse-list a {
| |
| color: #0056b3;
| |
| text-decoration: none;
| |
| }
| |
| | |
| .av-browse-list a:hover {
| |
| text-decoration: underline;
| |
| }
| |
| | |
| /* ----------------------------------------------------------------
| |
| RESPONSIVE — tablet and mobile
| |
| ---------------------------------------------------------------- */
| |
| | |
| @media (max-width: 900px) {
| |
| .av-latest-grid {
| |
| grid-template-columns: repeat(2, 1fr); | |
| } | | } |
| } | | } |
| | @media screen and (max-width: 850px) { |
|
| |
|
| @media (max-width: 700px) {
| | #p-logo-text { |
| .av-featured {
| | position: static !important; |
| flex-direction: column; | | left: auto !important; |
| | top: auto !important; |
| } | | } |
| .av-featured-image img {
| |
| max-width: 100%;
| |
| }
| |
| .av-cards-row {
| |
| flex-direction: column;
| |
| }
| |
| .av-browse-row {
| |
| flex-direction: column;
| |
| }
| |
| .av-latest-grid {
| |
| grid-template-columns: repeat(2, 1fr);
| |
| }
| |
| }
| |
|
| |
|
| @media (max-width: 480px) {
| |
| .av-latest-grid {
| |
| grid-template-columns: 1fr;
| |
| }
| |
| } | | } |