/* * SKY-ONE HOME NEWS V1 * * One stable stylesheet for home-page news. * No DOM rebuilding JavaScript. * Desktop keeps existing V71 layout from modern.css. */ /* --------------------------------------------------------- COMMON --------------------------------------------------------- */ .so-home-news-thumb-link { display: block; width: 100%; height: 100%; text-decoration: none; } .so-home-news-more { display: none; } /* --------------------------------------------------------- DESKTOP TITLE modern.css V71 was tied to > h3. The semantic heading is now H2, so the stable class owns it. --------------------------------------------------------- */ @media (min-width: 1101px) { .box:has(> .request-box) > .news-index > .so-home-news-title { position: relative !important; grid-column: 1 / -1 !important; margin: 0 0 9px !important; padding: 20px 0 1px !important; border: 0 !important; color: #181b20 !important; font-size: 27px !important; line-height: 1.08 !important; font-weight: 700 !important; letter-spacing: -.032em !important; text-transform: none !important; } .box:has(> .request-box) > .news-index > .so-home-news-title::before { content: "SKY-ONE · НОВОСТИ" !important; position: absolute !important; top: 0 !important; left: 0 !important; width: auto !important; height: auto !important; background: none !important; color: #ef7200 !important; font-size: 8px !important; line-height: 1 !important; font-weight: 800 !important; letter-spacing: .15em !important; text-transform: uppercase !important; } .box:has(> .request-box) > .news-index > .so-home-news-title::after { content: "" !important; position: absolute !important; top: 3px !important; left: 103px !important; width: 32px !important; height: 1px !important; background: rgba(239,114,0,.48) !important; } } /* --------------------------------------------------------- MOBILE --------------------------------------------------------- */ @media (max-width: 767px) { .news-index > .so-home-news-title { margin: 0 0 16px !important; padding: 0 !important; color: #202127 !important; font-size: 28px !important; line-height: 1.08 !important; font-weight: 700 !important; letter-spacing: -.025em !important; } /* * Server-rendered card. * Same visual concept as the former JS-generated card. */ .news-index > .one-news { position: relative !important; float: none !important; display: grid !important; grid-template-columns: 100px minmax(0, 1fr) !important; grid-template-rows: auto auto auto auto !important; column-gap: 11px !important; row-gap: 0 !important; width: 100% !important; min-width: 0 !important; min-height: 0 !important; margin: 0 0 14px !important; padding: 13px 13px 14px !important; box-sizing: border-box !important; overflow: hidden !important; border: 1px solid #e4e4e8 !important; border-radius: 18px !important; background: #ffffff !important; box-shadow: none !important; text-align: left !important; } .news-index > .one-news:last-of-type { margin-bottom: 0 !important; } /* IMAGE */ .news-index > .one-news > .img { position: static !important; display: block !important; grid-column: 1 !important; grid-row: 1 / 5 !important; float: none !important; width: 100px !important; height: 82px !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; border: 0 !important; border-radius: 12px !important; background: #f3f3f6 !important; } .news-index > .one-news > .img .so-home-news-thumb-link { display: block !important; width: 100px !important; height: 82px !important; } .news-index > .one-news > .img img { display: block !important; width: 100px !important; height: 82px !important; max-width: none !important; margin: 0 !important; padding: 0 !important; object-fit: cover !important; border: 0 !important; border-radius: 12px !important; } /* DATE */ .news-index > .one-news > .date { position: static !important; grid-column: 2 !important; grid-row: 1 !important; width: auto !important; margin: 0 0 6px !important; padding: 0 !important; color: #9b9ca7 !important; font-size: 12px !important; line-height: 1.15 !important; font-weight: 700 !important; letter-spacing: .015em !important; text-align: left !important; text-transform: none !important; } /* TITLE */ .news-index > .one-news > .title { grid-column: 2 !important; grid-row: 2 !important; width: auto !important; margin: 0 !important; padding: 0 !important; } .news-index > .one-news > .title > a { display: block !important; margin: 0 0 6px !important; padding: 0 !important; color: #171923 !important; font-size: 18px !important; line-height: 1.12 !important; font-weight: 700 !important; letter-spacing: -.015em !important; text-decoration: none !important; overflow-wrap: anywhere !important; } .news-index > .one-news > .title > a:focus, .news-index > .one-news > .title > a:active { color: #ff7a00 !important; } /* EXCERPT */ .news-index > .one-news > .text { position: static !important; grid-column: 2 !important; grid-row: 3 !important; display: -webkit-box !important; width: auto !important; height: auto !important; max-height: none !important; margin: 0 0 8px !important; padding: 0 !important; overflow: hidden !important; color: #686b73 !important; font-size: 14px !important; line-height: 1.38 !important; font-weight: 400 !important; text-align: left !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical !important; } .news-index > .one-news > .text .news-grad { display: none !important; } /* MORE */ .news-index > .one-news > .so-home-news-more { grid-column: 2 !important; grid-row: 4 !important; display: inline-block !important; width: max-content !important; margin: 0 !important; padding: 0 !important; color: #ff7a00 !important; font-size: 13px !important; line-height: 1.2 !important; font-weight: 700 !important; text-decoration: none !important; } .news-index > .one-news > .so-home-news-more:focus, .news-index > .one-news > .so-home-news-more:active { text-decoration: underline !important; } .news-index > .one-news > br { display: none !important; } /* ----------------------------------------------------- ALL NEWS BUTTON ----------------------------------------------------- */ .news-index > .news-arh { display: flex !important; justify-content: center !important; width: 100% !important; margin: 18px 0 8px !important; padding: 0 14px !important; box-sizing: border-box !important; background: none !important; } .news-index > .news-arh::before, .news-index > .news-arh::after, .news-index > .news-arh > a::before, .news-index > .news-arh > a::after { content: none !important; display: none !important; background: none !important; background-image: none !important; } .news-index > .news-arh > a { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-width: 0 !important; min-height: 48px !important; margin: 0 !important; padding: 0 18px !important; box-sizing: border-box !important; border: 1px solid #dedfe3 !important; border-radius: 13px !important; background: #ffffff !important; background-image: none !important; color: #24262d !important; font-size: 13px !important; line-height: 1 !important; font-weight: 700 !important; letter-spacing: .025em !important; text-decoration: none !important; box-shadow: 0 5px 18px rgba(0,0,0,.035) !important; } .news-index > .news-arh > a:focus, .news-index > .news-arh > a:active { border-color: #ff7600 !important; color: #ff7600 !important; } }