/* * Theme consistency for single listing (Classified Listing) and single * event (Events Manager) detail pages. * * The tagDiv (Newspaper) article pages render as flat white pages, 1068px * wide, with the title set in Noto Serif JP italic 900 (35px, dropping to * 30px/25px on smaller screens). The two plugin detail page types diverge: * * - Classified Listing singles paint the page #F0F5FA, wrap everything in * their own 1240px .rtcl-container, and render floating white cards with * their own sans-serif headings. * - Events Manager singles (rendered "like posts") fall back to the theme's * legacy span8-content + span4-sidebar layout, but the sidebar is empty, * so content (and the OSM map) sits in a narrow dead-ended column. * * Everything here is scoped to body.single-rtcl_listing / body.single-event * so no other page is touched. No third-party files are edited. */ /* ------------------------------------------------------------------------- * Classified Listing single pages * ---------------------------------------------------------------------- */ /* Flat white page like every article page (was #F0F5FA). */ body.single-rtcl_listing.rtcl-page { background-color: #ffffff; } /* Match the theme's 1068px content width (rtcl uses its own 1240px). */ body.single-rtcl_listing .rtcl-container { max-width: 1068px; } /* Theme-like vertical rhythm (rtcl adds 60px top and bottom). * Note: .rtcl is a class on itself on these pages, so all overrides * below chain it as body.single-rtcl_listing.rtcl (a descendant .rtcl * selector would never match). */ body.single-rtcl_listing.rtcl .rtcl-content-wrapper { padding-top: 10px; padding-bottom: 40px; } /* Flatten the floating "card" chrome so the page reads as one flow. */ body.single-rtcl_listing .rtcl-single-listing-details, body.single-rtcl_listing.rtcl .listing-sidebar .rtcl-listing-user-info { background-color: transparent; border-radius: 0; box-shadow: none; } /* Align content flush with the breadcrumb like article text (the cards * indented everything 25px inside their own padding). */ body.single-rtcl_listing .rtcl-single-listing-details .rtcl-listing-title { padding: 0 0 12px; } body.single-rtcl_listing .rtcl-single-listing-details .rtcl-listing-meta { padding: 12px 0 0; } body.single-rtcl_listing .rtcl-single-listing-details .rtcl-slider-wrapper { margin-left: 0; margin-right: 0; } body.single-rtcl_listing .rtcl-single-listing-details .rtcl-main-content-wrapper { padding: 10px 0 20px; } body.single-rtcl_listing.rtcl .rtcl-single-listing-map { background-color: transparent; padding: 25px 0 0; margin: 0; } body.single-rtcl_listing.rtcl .listing-sidebar .rtcl-listing-side-title { padding: 12px 0; } body.single-rtcl_listing.rtcl .listing-sidebar .rtcl-listing-user-info .rtcl-list-group { padding: 20px 0; } /* Listing title in the theme's article-title style. */ body.single-rtcl_listing .rtcl-single-listing-details .rtcl-listing-title .entry-title { font-family: 'Noto Serif JP', serif; font-style: italic; font-weight: 900; font-size: 35px; line-height: 1.4; color: #000000; } /* Section headings ("Contact", "Location", reviews) in the same voice. */ body.single-rtcl_listing.rtcl .rtcl-section-heading-simple h3, body.single-rtcl_listing.rtcl .listing-sidebar .rtcl-listing-side-title h3 { font-family: 'Noto Serif JP', serif; font-style: italic; font-weight: 900; font-size: 22px; color: #000000; } @media (min-width: 768px) and (max-width: 1018px) { body.single-rtcl_listing .rtcl-single-listing-details .rtcl-listing-title .entry-title { font-size: 30px; } } @media (max-width: 767px) { body.single-rtcl_listing .rtcl-single-listing-details .rtcl-listing-title .entry-title { font-size: 25px; } } /* ------------------------------------------------------------------------- * "Open in Google Maps" link (both page types; see includes/map-links.php) * ---------------------------------------------------------------------- */ .slv-ah-gmaps-wrap { margin: 10px 0 0; } .slv-ah-gmaps-link { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; /* comfortable tap target on phones */ padding: 8px 0; font-family: 'Open Sans', 'Open Sans Regular', sans-serif; font-size: 14px; font-weight: 600; line-height: 1; color: #000000; text-decoration: none; border-bottom: 2px solid #000000; } .slv-ah-gmaps-link:hover, .slv-ah-gmaps-link:focus { color: #4db2ec; border-bottom-color: #4db2ec; } .slv-ah-gmaps-pin { flex: 0 0 auto; } /* On listing pages the link renders right after the Location/map card. */ body.single-rtcl_listing.rtcl .slv-ah-gmaps-wrap { margin: 12px 0 0; } /* On event pages it sits under the venue map section. */ body.single-event .slv-ah-gmaps-wrap { margin: 12px 0 20px; } /* On venue (location) pages it sits directly under the map placeholder. */ body.single-location .slv-ah-gmaps-wrap { margin: 12px 0 20px; } /* ------------------------------------------------------------------------- * Article-style comments (single listing + single event pages) * * The plugin's comments template (templates/comments.php) mirrors the * tagDiv markup, so the theme's global comment styles already apply. The * rules below add what the legacy pages lack: the yellow uppercase * "Login for Comments" button articles show to logged-out visitors * (mirroring the tdm_block_popup button in the article Single Template: * #eeee22 background, black text, 5px radius, inverted on hover), plus * the section heading in the same voice as the rest of these pages. * ---------------------------------------------------------------------- */ body.slv-ah-td-comments .slv-ah-login-for-comments { margin: 10px 0 30px; } body.slv-ah-td-comments .slv-ah-login-for-comments a, body.slv-ah-td-comments .slv-ah-login-for-comments a:visited { display: block; width: 100%; box-sizing: border-box; padding: 14px 30px; background-color: #eeee22; color: #000000; font-family: 'Open Sans', 'Open Sans Regular', sans-serif; font-size: 15px; font-weight: 700; line-height: 1; text-align: center; text-transform: uppercase; text-decoration: none; border-radius: 5px; transition: background-color .15s ease, color .15s ease; } body.slv-ah-td-comments .slv-ah-login-for-comments a:hover, body.slv-ah-td-comments .slv-ah-login-for-comments a:focus { background-color: #000000; color: #eeee22; } /* Comment area headings ("N COMMENTS", "LEAVE A REPLY") in the theme's * block-title style — black label, consistent with article pages. */ body.slv-ah-td-comments .comments .block-title, body.slv-ah-td-comments .comments .comment-reply-title { margin-bottom: 20px; } /* On listing pages the comment area renders inside rtcl's card wrapper; * give it the same flush, flat treatment as the rest of the page. */ body.single-rtcl_listing.rtcl .comments { background-color: transparent; box-shadow: none; border-radius: 0; padding-left: 0; padding-right: 0; } /* ------------------------------------------------------------------------- * Events Manager single pages * ---------------------------------------------------------------------- */ /* The theme's legacy single layout gives events a span8 content column next * to a span4 sidebar that holds no widgets on this site. Reclaim the full * 1068px content width. A pure CSS :has() emptiness guard does not work * here — theme JS injects elements into .td-ss-main-sidebar at runtime — so * PHP adds the slv-ah-event-full-width body class only when the theme's * default sidebar (td-default) really has no widgets. Adding a widget later * brings the sidebar straight back. */ body.single-event.slv-ah-event-full-width .td-pb-span8.td-main-content { width: 100%; float: none; } body.single-event.slv-ah-event-full-width .td-pb-span4.td-main-sidebar { display: none; } /* Event title in the theme's article-title style (the legacy template * renders it in the theme's plain sans style). */ body.single-event .td-post-title .entry-title { font-family: 'Noto Serif JP', serif; font-style: italic; font-weight: 900; font-size: 35px; line-height: 1.4; color: #000000; } @media (min-width: 768px) and (max-width: 1018px) { body.single-event .td-post-title .entry-title { font-size: 30px; } } @media (max-width: 767px) { body.single-event .td-post-title .entry-title { font-size: 25px; } } /* ------------------------------------------------------------------------- * Events Manager single location (venue) pages * ---------------------------------------------------------------------- */ /* Venues render through the same legacy span8-content + span4-sidebar * layout as events, with the title in .td-page-header. Same treatment: * flat white page, full 1068px width when the td-default sidebar holds no * widgets (server-decided body class, see includes/theme-consistency.php), * and the theme's article-title typography. */ body.single-location { background-color: #ffffff; } body.single-location.slv-ah-location-full-width .td-pb-span8.td-main-content { width: 100%; float: none; } body.single-location.slv-ah-location-full-width .td-pb-span4.td-main-sidebar { display: none; } /* Venue title in the theme's article-title style (the legacy template * renders it as a plain sans page title). */ body.single-location .td-page-header .entry-title { font-family: 'Noto Serif JP', serif; font-style: italic; font-weight: 900; font-size: 35px; line-height: 1.4; color: #000000; } @media (min-width: 768px) and (max-width: 1018px) { body.single-location .td-page-header .entry-title { font-size: 30px; } } @media (max-width: 767px) { body.single-location .td-page-header .entry-title { font-size: 25px; } } /* ------------------------------------------------------------------------- * Events Manager archive/list views (events & venue lists) * ---------------------------------------------------------------------- */ /* The event/location post-type archives, event category/tag archives, and * the pages Events Manager designates as its events / locations list pages * all render through the same legacy span8-content + span4-sidebar layout * with a plain sans page title. PHP flags them with slv-ah-em-list (always) * and slv-ah-em-list-full-width (only when the theme's td-default sidebar * holds no widgets — same server-side check as single event/venue pages). */ body.slv-ah-em-list { background-color: #ffffff; } body.slv-ah-em-list-full-width .td-pb-span8.td-main-content { width: 100%; float: none; } body.slv-ah-em-list-full-width .td-pb-span4.td-main-sidebar { display: none; } /* List/archive page title in the theme's article-title style. */ body.slv-ah-em-list .td-page-header .entry-title { font-family: 'Noto Serif JP', serif; font-style: italic; font-weight: 900; font-size: 35px; line-height: 1.4; color: #000000; } @media (min-width: 768px) and (max-width: 1018px) { body.slv-ah-em-list .td-page-header .entry-title { font-size: 30px; } } @media (max-width: 767px) { body.slv-ah-em-list .td-page-header .entry-title { font-size: 25px; } }