این یک شیوهنامه CSS است که خانواده فونت «Guardian Headline Full» را تعریف میکند. شامل چندین قانون font-face است که هر کدام وزن و سبک متفاوتی از فونت را مشخص میکنند، همراه با URLهای فایلهای فونت در قالبهای مختلف (WOFF2، WOFF و TTF). وزنها از روشن (300) تا نیمهپررنگ (600) متغیر است و هر دو سبک معمولی و ایتالیک گنجانده شدهاند. فایلهای فونت بر روی سرور داراییهای گاردین میزبانی میشوند.
این متن به نظر میرسد کد CSS باشد، نه زبان طبیعی. قوانین سبک و چیدمان را برای یک صفحه وب تعریف میکند. از آنجا که کد فنی است، بازنویسی آن به انگلیسی روان کاربرد ندارد. اگر منظورتان متن دیگری بود، لطفاً آن را ارائه دهید و خوشحال میشوم کمک کنم.
left: -11px.
ستون اصلی محتوا برای مقالات تعاملی هیچ حاشیه یا padding دور عناصر جاسازیشده ندارد، با 12 پیکسل padding در بالا و پایین. وقتی یک پاراگراف با یک عنصر جاسازیشده دنبال میشود، padding حذف و با 12 پیکسل حاشیه جایگزین میشود. عناصر درونخطی حداکثر عرض 620 پیکسل دارند.
در صفحهنمایشهای عریضتر از 61.25em، تصاویر درونخطی نیز به 620 پیکسل محدود میشوند.
برای بخشهای رسانهای با ویدیوهای حلقهای، زیرنویس بالای سایر عناصر قرار میگیرد و دکمه حلقه در پایین راست با فاصله اضافی تراز میشود. دکمههای بیصدا و صدا در سمت راست با کمی padding چپ قرار میگیرند. دکمه زیرنویس بالای همه چیز قرار دارد و در صفحهنمایشهای بزرگتر نزدیک پایین قرار میگیرد.
برای سینماگرافها (نوعی ویدیوی حلقهای)، محدودیت ارتفاع در صفحهنمایشهای عریضتر از 46.25em حذف میشود.
در بخش بدنه، ویدیوهای خودمیزبان به صورت بلوک با حداکثر عرض 620 پیکسل و حاشیه 12 پیکسل نمایش داده میشوند. ویدیو و شکل حلقهای آن تمام عرض را میگیرند و ارتفاع ویدیو به طور خودکار تنظیم میشود.
وقتی ویدیو در حالت همهجانبه (immersive) قرار میگیرد، برای پر کردن فضای موجود گسترش مییابد و محدودیت عرض و حاشیهها حذف میشوند. در صفحهنمایشهای بسیار عریض (بیش از 71.25em)، ظرف ویدیو 1140 پیکسل عرض دارد و 180 پیکسل به چپ منتقل میشود و زیرنویس تورفتگی دارد. در صفحهنمایشهای حتی عریضتر (بیش از 81.25em)، 1300 پیکسل عرض و 260 پیکسل به چپ منتقل میشود.
طراحی از رنگهای خاصی استفاده میکند: خاکستری برای تاریخها، خاکستری روشن برای حاشیهها، خاکستری روشنتر برای زیرنویسها و پسزمینه تیره نیمهشفاف برای متن زیرنویس. رنگ اصلی ویژگی قرمز تیره است که میتواند توسط رنگ سفارشی ستون (pillar) جایگزین شود.
زیرعنوانها، نقلقولهای برجسته و نقلقولهای بلوکی از رنگ ثانویه ستون استفاده میکنند که در حالت تاریک قابل تنظیم است.
عناصر جاسازیشده هیچ padding ندارند. وقتی یک عنصر جاسازیشده بلافاصله بعد از عنصر دیگر یا خط افقی میآید، پاراگراف بعدی هیچ حاشیه بالای اضافی نمیگیرد و فاصلهگذاری یکنواخت تضمین میشود. این در بخشهای مختلف محتوا و چیدمانهای تعاملی اعمال میشود.
این یک لیست انتخابگر CSS است که پاراگرافهای خاصی را در چیدمان یک صفحه وب هدف قرار میدهد. padding بالای 14 پیکسل را برای پاراگرافهایی که بلافاصله بعد از عناصر خاصی مانند «element-atom»، «sign-in-gate» یا خطوط افقی (به جز آخرین مورد) میآیند اعمال میکند. انتخابگرها بخشهای مختلف صفحه مانند محتوای اصلی، بدنه نظر و بدنه ویژگی را پوشش میدهند.
بخش دوم CSS از شبهعنصر `:first-letter` برای استایل دادن به حرف اول همان پاراگرافها استفاده میکند، احتمالاً برای افکت حرف اول بزرگ (drop cap). این استایل را در ظروف مختلف مانند ستون اصلی، بدنه مقاله و بخشهای محتوای تعاملی اعمال میکند.
در اینجا متن بازنویسیشده به انگلیسی روان و طبیعی آمده است:
---
قوانین CSS یک سبک حرف اول بزرگ را برای اولین پاراگراف بعد از عناصر خاص، مانند خطوط افقی یا ظروف تبلیغاتی، در بخشهای محتوایی خاص اعمال میکنند. حرف اول بزرگ از فونت Guardian Headline استفاده میکند، پررنگ، بزرگ (111px) است، به چپ شناور میشود و با حروف بزرگ نوشته میشود. حاشیه در سمت راست دارد، به صورت عمودی در بالا تراز میشود و از متغیر رنگ سفارشی استفاده میکند.
برای محتوای تعاملی و بخشهای دیگر، پاراگرافهای بعد از خطوط افقی هیچ padding بالایی ندارند.
نقلقولهای برجسته در این بخشهای محتوایی به حداکثر عرض 620 پیکسل محدود میشوند.
زیرنویسهای تصویر برای عناصر نمایشی به صورت ایستا قرار میگیرند و تمام عرض، تا 620 پیکسل را میگیرند. در صفحهنمایشهای عریضتر (بیش از 71.25em)، به صورت مطلق با حداکثر عرض 140 پیکسل قرار میگیرند و در صفحهنمایشهای حتی عریضتر (بیش از 81.25em)، حداکثر عرض به 220 پیکسل افزایش مییابد.
عناصر همهجانبه تمام عرض viewport را پوشش میدهند و عرض نوار اسکرول را در نظر میگیرند. در صفحهنمایشهای کوچکتر، حداکثر عرض 978 پیکسل دارند و زیرنویسها padding افقی دارند. در صفحهنمایشهای متوسط، حداکثر عرض 738 پیکسل است. در صفحهنمایشهای بسیار کوچک، عنصر با حاشیههای منفی به چپ منتقل میشود و زیرنویسها padding اضافی میگیرند.
برای شکلهای نمایشی در محتوای بدنه، حاشیههای چپ منفی در صفحهنمایشهای بزرگتر برای تراز صحیح اعمال میشوند.
ظرف مبلمان (furniture wrapper) به صورت نسبی قرار میگیرد و در صفحهنمایشهای عریضتر از 61.25em، استایل اضافی اعمال میشود (اگرچه قانون ناقص است).
.furniture-wrapper {
display: grid;
grid-column-gap: 20px;
grid-row-gap: 0px;
grid-template-columns: [title-start headline-start meta-start standfirst-start] repeat(5, 1fr) [title-end headline-end meta-end standfirst-end portrait-start] repeat(5, 1fr) [portrait-end];
grid-template-rows: [title-start portrait-start] 0.25fr [title-end headline-start] 1fr [headline-end standfirst-start] 0.75fr [standfirst-end meta-start] auto [meta-end portrait-end];
}
.furniture-wrapper #headline > div:first-child,
.furniture-wrapper [data-gu-name="headline"] > div:first-child,
.furniture-wrapper .headline > div:first-child {
border-top: 1px solid var(--headerBorder);
}
.furniture-wrapper #meta,
.furniture-wrapper [data-gu-name="meta"] {
position: relative;
padding-top: 2px;
margin-right: 0;
}
.furniture-wrapper .standfirst .content__standfirst,
.furniture-wrapper #standfirst .content__standfirst,
.furniture-wrapper [data-gu-name="standfirst"] .content__standfirst {
margin-bottom: 4px;
}
.furniture-wrapper .standfirst ul li,
.furniture-wrapper #standfirst ul li,
.furniture-wrapper [data-gu-name="standfirst"] ul li {
font-size: 20px;
}
.furniture-wrapper .standfirst li a,
.furniture-wrapper .standfirst a,
.furniture-wrapper #standfirst li a,
.furniture-wrapper #standfirst a,
.furniture-wrapper [data-gu-name="standfirst"] li a,
.furniture-wrapper [data-gu-name="standfirst"] a {
border-bottom: none;
background-image: none !important;
text-decoration: underline;
text-underline-offset: 6px;
text-decoration-color: var(--headerBorder, #dcdcdc);
text-decoration-thickness: 1px;
}
.furniture-wrapper .standfirst li a:hover,
.furniture-wrapper .standfirst a:hover,
.furniture-wrapper #standfirst li a:hover,
.furniture-wrapper #standfirst a:hover,
.furniture-wrapper [data-gu-name="standfirst"] li a:hover,
.furniture-wrapper [data-gu-name="standfirst"] a:hover {
text-decoration-color: var(--new-pillar-colour);
}
.furniture-wrapper .standfirst p:first-of-type,
.furniture-wrapper #standfirst p:first-of-type,
.furniture-wrapper [data-gu-name="standfirst"] p:first-of-type {
border-top: 1px solid var(--headerBorder);
padding-bottom: 0;
}
@media (min-width: 61.25em) and (min-width: 71.25em) {
.furniture-wrapper .standfirst p:first-of-type,
.furniture-wrapper #standfirst p:first-of-type,
.furniture-wrapper [data-gu-name="standfirst"] p:first-of-type {
border-top: unset;
}
}
@media (min-width: 61.25em) {
.furniture-wrapper figure {
margin: 0 0 0 -10px;
}
.furniture-wrapper figure[data-spacefinder-role="inline"].element {
max-width: 630px;
}
}
@media (min-width: 71.25em) {
.furniture-wrapper {
grid-template-columns: [title-start headline-start meta-start] repeat(2, 1fr) [meta-end standfirst-start] repeat(5, 1fr) [title-end headline-end standfirst-end portrait-start] repeat(7, 1fr) [portrait-end];
grid-template-rows: [title-start portrait-start] 80px [title-end headline-start] auto [headline-end standfirst-start meta-start] auto [standfirst-end meta-end portrait-end];
}
.furniture-wrapper #meta:before,
.furniture-wrapper [data-gu-name="meta"]:before {
content: "";
width: 540px;
position: absolute;
top: 0;
background-color: var(--headerBorder);
height: 1px;
}
.furniture-wrapper .standfirst p,
.furniture-wrapper #standfirst p,
.furniture-wrapper [data-gu-name="standfirst"] p {
border-top: unset;
}
.furniture-wrapper .standfirst:before,
.furniture-wrapper #standfirst:before,
.furniture-wrapper [data-gu-name="standfirst"]:before {
content: "";
width: 1px;
background-color: var(--headerBorder);
height: 100%;
position: absolute;
top: 0;
left: 0.5px;
}
}
@media (min-width: 81.25em) {
.furniture-wrapper {
grid-template-columns: [title-start headline-start meta-start] repeat(3, 1fr) [meta-end standfirst-start] repeat(5, 1fr) [title-end headline-end standfirst-end portrait-start] repeat(8, 1fr) [portrait-end];
grid-template-rows: [title-start portrait-start] 0.25fr [title-end headline-start] 1fr [headline-end standfirst-start meta-start] 0.75fr [standfirst-end meta-end portrait-end];
}
.furniture-wrapper #meta:before,
.furniture-wrapper [data-gu-name="meta"]:before {
width: 620px;
}
.furniture-wrapper .standfirst:before,
.furniture-wrapper #standfirst:before,
.furniture-wrapper [data-gu-name="standfirst"]:before {
left: -0.5px;
}
}
.furniture-wrapper .article-header .content__labels > div,
.furniture-wrapper [data-gu-name="title"].content__labels > div {
padding-top: 2px;
}
.furniture-wrapper #headline h1,
.furniture-wrapper [data-gu-name="headline"] h1,
.furniture-wrapper .headline h1 {
font-weight: 600;
max-width: 620px;
font-size: 32px;
}
@media (min-width: 71.25em) {
.furniture-wrapper #headline h1,
.furniture-wrapper [data-gu-name="headline"] h1,
.furniture-wrapper .headline h1 {
max-width: 540px;
font-size: 50px;
}
}
@media (min-width: 46.25em) {
.furniture-wrapper .keyline-4,
.furniture-wrapper [data-gu-name="lines"] {
margin-right: 0;
}
}
@media (min-width: 61.25em) {
.furniture-wrapper .keyline-4,
.furniture-wrapper [data-gu-name="lines"] {
display: none;
}
}
.furniture-wrapper .keyline-4 svg,
.furniture-wrapper [data-gu-name="lines"] svg {
stroke: var(--headerBorder);
}
@media (min-width: 46.25em) {
.furniture-wrapper #meta,
.furniture-wrapper [data-gu-name="meta"] {
margin-right: 0;
}
}
.furniture-wrapper #meta .meta__social,
.furniture-wrapper #meta .meta__social ul li a span,
.furniture-wrapper #meta .meta__comment,
.furniture-wrapper [data-gu-name="meta"] .meta__social,
.furniture-wrapper [data-gu-name="meta"] .meta__social ul li a span,
.furniture-wrapper [data-gu-name="meta"] .meta__comment {
border-color: var(--headerBorder);
}
.furniture-wrapper #meta .content__meta-container_dcr > div > gu-island,
.furniture-wrapper [data-gu-name="meta"] .content__meta-container_dcr > div > gu-island {
display: none;
}
.furniture-wrapper .standfirst,
.furniture-wrapper #standfirst,
.furniture-wrapper [data-gu-name="standfirst"] {
margin-left: -10px;
padding-left: 10px;
position: relative;
}
@media (min-width: 46.25em) {
.furniture-wrapper .standfirst,
.furniture-wrapper #standfirst,
.furniture-wrapper [data-gu-name="standfirst"] {
padding-top: 2px;
}
}
.furniture-wrapper .standfirst p,
.furniture-wrapper #standfirst p,
.furniture-wrapper [data-gu-name="standfirst"] p {
font-weight: 400;
font-size: 20px;
padding-bottom: 14px;
}
.furniture-wrapper #main-media,
.furniture-wrapper [data-gu-name="media"] {
position: relative;
margin-top: 0;
margin-bottom: 2px;
grid-area: portrait;
}
.furniture-wrapper #main-media div div,
.furniture-wrapper [data-gu-name="media"] div div {
width: 100%;
margin-inline: 0;
}
@media (min-width: 61.25em) {
.furniture-wrapper #main-media,
.furniture-wrapper [data-gu-name="media"] {
margin-bottom: 0;
}
}
@media (max-width: 46.24em) {
.furniture-wrapper #main-media,
.furniture-wrapper [data-gu-name="media"] {
width: calc(100vw - var(--scrollbar-width, 0px));
margin-left: -10px;
}
}
@media (max-width: 46.24em) and (min-width: 30em) {
.furniture-wrapper #main-media,
.furniture-wrapper [data-gu-name="media"] {
margin-left: -20px;
}
}
.furniture-wrapper figcaption {
position: absolute;
bottom: 0;
padding: 4px 10px 12px;
background-color: var(--captionBackground);
color: var(--captionText);
max-width: unset;
margin-bottom: 0;
min-height: 46px;
}
.furniture-wrapper figcaption span {
color: var(--headerBorder);
}
.furniture-wrapper figcaption span svg {
fill: var(--headerBorder);
}
.furniture-wrapper figcaption span:nth-of-type(1) {
display: none;
}
.furniture-wrapper figcaption span:nth-of-type(2) {
display: inline;
max-width: 90%;
}
@media (min-width: 30em) {
.furniture-wrapper figcaption {
padding: 4px 20px 12px;
}
}
.furniture-wrapper figcaption.hidden {
opacity: 0;
}
.furniture-wrapper #caption-button {
display: block;
position: absolute;
bottom: 10px;
right: 8px;
z-index: 30;
background-color: var(--captionBackground);
border: none;
border-radius: 50%;
padding: 6px 5px 5px;
}
.furniture-wrapper #caption-button svg {
transform: scale(0.85);
}
@media (min-width: 30em) {
.furniture-wrapper #caption-button {
right: 10px;
}
}
@media (min-width: 71.25em) {
.content__main-column--interactive:before {
top: -12px !important;
height: calc(100% + 24px) !important;
}
}
.content__main-column--interactive h2 {
max-width: 620px;
}
:root {
--new-pillar-colour: var(--darkmode-pillar, var(--darkModeFeature)) !important;
--headerBorderColor: #606060;
--darkModeFeature: #ff5943;
}
nav + section {
display: none;
}
nav + aside {
display: none;
}
aside + section {
display: none;
}
.furniture-wrapper {
background-color: var(--darkBackground);
margin: 0 -10px;
padding: 0 10px 4px;
}
@media (min-width: 30em) {
.furniture-wrapper {
margin: 0 -20px;
padding: 0 20px 8px;
}
}
@media (min-width: 61.25em) {
.furniture-wrapper {
padding: 0 20px;
}
}
@media (min-width: 81.25em) {
.furniture-wrapper:before {
content: "";
width: calc((100vw - 1298px) / 2);
height: 100%;
}
}
height:100%;position:absolute;left:calc((100vw - 1298px)/-2);background-color:var(--darkBackground);border-right:1px solid var(--headerBorderColor)}.furniture-wrapper:after{content:"";width:calc((100vw - 1298px)/2);height:100%;position:absolute;right:calc((100vw - 1298px)/-2);background-color:var(--darkBackground)}.furniture-wrapper .article-header,.furniture-wrapper [data-gu-name=title] a,.furniture-wrapper [data-gu-name=title] span{color:var(--new-pillar-colour, --darkModeFeature)}@media (min-width: 61.25em){.furniture-wrapper #headline>div:first-child,.furniture-wrapper [data-gu-name=headline]>div:first-child,.furniture-wrapper .headline>div:first-child{border-top:1px solid var(--headerBorderColor)}}.furniture-wrapper #headline h1,.furniture-wrapper [data-gu-name=headline] h1,.furniture-wrapper .headline h1{font-weight:700;color:#dcdcdc}.furniture-wrapper #headline figure,.furniture-wrapper [data-gu-name=headline] figure,.furniture-wrapper .headline figure{margin-top:0;margin-bottom:2px}@media (min-width: 71.25em){.furniture-wrapper #meta:before,.furniture-wrapper [data-gu-name=meta]:before{background-color:var(--headerBorderColor)}}.furniture-wrapper #meta details,.furniture-wrapper #meta summary,.furniture-wrapper #meta summary span,.furniture-wrapper [data-gu-name=meta] details,.furniture-wrapper [data-gu-name=meta] summary,.furniture-wrapper [data-gu-name=meta] summary span{color:#dcdcdc}.furniture-wrapper #meta .meta__social a,.furniture-wrapper #meta .meta__social button,.furniture-wrapper [data-gu-name=meta] .meta__social a,.furniture-wrapper [data-gu-name=meta] .meta__social button{border-color:var(--headerBorderColor);color:var(--new-pillar-colour, --darkModeFeature)}.furniture-wrapper #meta .meta__social a svg,.furniture-wrapper #meta .meta__social button svg,.furniture-wrapper [data-gu-name=meta] .meta__social a svg,.furniture-wrapper [data-gu-name=meta] .meta__social button svg{fill:var(--new-pillar-colour, --darkModeFeature)}.furniture-wrapper #meta .meta__social a:hover,.furniture-wrapper #meta .meta__social button:hover,.furniture-wrapper [data-gu-name=meta] .meta__social a:hover,.furniture-wrapper [data-gu-name=meta] .meta__social button:hover{color:var(--darkBackground);background-color:var(--new-pillar-colour, --darkModeFeature)}.furniture-wrapper #meta .meta__social a:hover svg,.furniture-wrapper #meta .meta__social button:hover svg,.furniture-wrapper [data-gu-name=meta] .meta__social a:hover svg,.furniture-wrapper [data-gu-name=meta] .meta__social button:hover svg{fill:var(--darkBackground)}.furniture-wrapper #meta div,.furniture-wrapper [data-gu-name=meta] div{color:#dcdcdc}.furniture-wrapper #meta a,.furniture-wrapper [data-gu-name=meta] a{color:var(--new-pillar-colour, --darkModeFeature)}.furniture-wrapper #meta a:hover,.furniture-wrapper [data-gu-name=meta] a:hover{color:var(--new-pillar-colour, --darkModeFeature);text-decoration-color:var(--new-pillar-colour, --darkModeFeature)}.furniture-wrapper .standfirst a,.furniture-wrapper .standfirst li a,.furniture-wrapper #standfirst a,.furniture-wrapper #standfirst li a,.furniture-wrapper [data-gu-name=standfirst] a,.furniture-wrapper [data-gu-name=standfirst] li a{border-bottom:none;color:var(--new-pillar-colour, --darkModeFeature);background-image:none!important;text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--headerBorder, #dcdcdc);text-decoration-thickness:1px}.furniture-wrapper .standfirst a:hover,.furniture-wrapper .standfirst li a:hover,.furniture-wrapper #standfirst a:hover,.furniture-wrapper #standfirst li a:hover,.furniture-wrapper [data-gu-name=standfirst] a:hover,.furniture-wrapper [data-gu-name=standfirst] li a:hover{border-bottom:none;text-decoration-color:var(--new-pillar-colour, --darkModeFeature)}.furniture-wrapper .standfirst p,.furniture-wrapper #standfirst p,.furniture-wrapper [data-gu-name=standfirst] p{color:#dcdcdc}@media (min-width: 61.25em){.furniture-wrapper .standfirst p:first-of-type,.furniture-wrapper #standfirst p:first-of-type,.furniture-wrapper [data-gu-name=standfirst] p:first-of-type{bo
من نمیتوانم این متن را بازنویسی کنم زیرا به نظر میرسد کد CSS است، نه نثر زبان طبیعی. آیا میتوانید متنی به زبان انگلیسی بنویسید که بخواهید آن را بازنویسی کنم؟
در اینجا متن بازنویسیشده به انگلیسی روان و طبیعی آمده است:
این مجموعهای از قوانین font-face برای خانواده فونت «Guardian Headline Full» است. هر قانون سبک یا وزن متفاوتی از فونت را تعریف میکند و از فایلهای میزبانیشده در وبسایت گاردین استفاده میکند. قالبها شامل WOFF2، WOFF و TTF برای سازگاری در مرورگرهای مختلف هستند. وزنها از معمولی (400) تا سیاه (900) متغیر است و هر دو سبک معمولی و ایتالیک در دسترس هستند.
این متن به نظر میرسد کد CSS باشد، نه زبان طبیعی. قوانین سبک و چیدمان را برای یک وبسایت، احتمالاً گاردین، تعریف میکند. از آنجا که کد فنی است، بازنویسی آن به «انگلیسی روان و طبیعی» کاربرد ندارد—قرار است توسط مرورگرها خوانده شود، نه مردم. اگر بخواهید، میتوانم توضیح دهم که این کد چه کاری انجام میدهد.
برای دستگاههای iOS و اندروید، برچسبهای داخل ظرف مبلمان ظرف مقاله با متن پررنگ، با استفاده از خانواده فونت Guardian headline، و با رنگ ستون (pillar) رنگآمیزی شدهاند و متن با حروف بزرگ نوشته میشود.
در هر دو iOS و اندروید، عنوان اصلی در ظرف مبلمان 32 پیکسل، پررنگ، با 12 پیکسل padding پایین تنظیم شده و به رنگ تیره (تقریباً سیاه) است.
برای تصاویر در ظرف مبلمان در هر دو پلتفرم، آنها به صورت نسبی قرار میگیرند، با حاشیه 14 پیکسل در بالا و حاشیه چپ کمی منفی، و به عرض کامل صفحهنمایش کشیده میشوند (با در نظر گرفتن هر نوار اسکرول). خود تصاویر، همراه با لینکها و ظروف داخلی آنها، پسزمینه شفاف دارند و ارتفاع طبیعی خود را حفظ میکنند.
متن مقدماتی (standfirst) در ظرف مبلمان در هر دو پلتفرم کمی padding در بالا و پایین و حاشیه راست کمی منفی دارد تا با لبه صفحهنمایش تراز شود.
.ment-article-container .furniture-wrapper .standfirst__inner p {
font-family: Guardian Headline, Guardian Egyptian Web, Guardian Headline Full, Georgia, serif;
}
body.ios #feature-article-container .furniture-wrapper .standfirst__inner li a,
body.ios #feature-article-container .furniture-wrapper .standfirst__inner a,
body.ios #standard-article-container .furniture-wrapper .standfirst__inner li a,
body.ios #standard-article-container .furniture-wrapper .standfirst__inner a,
body.ios #comment-article-container .furniture-wrapper .standfirst__inner li a,
body.ios #comment-article-container .furniture-wrapper .standfirst__inner a,
body.android #feature-article-container .furniture-wrapper .standfirst__inner li a,
body.android #feature-article-container .furniture-wrapper .standfirst__inner a,
body.android #standard-article-container .furniture-wrapper .standfirst__inner li a,
body.android #standard-article-container .furniture-wrapper .standfirst__inner a,
body.android #comment-article-container .furniture-wrapper .standfirst__inner li a,
body.android #comment-article-container .furniture-wrapper .standfirst__inner a {
color: var(--new-pillar-colour) !important;
background-image: none !important;
text-decoration: underline;
text-underline-offset: 6px;
text-decoration-color: var(--headerBorder, #dcdcdc);
border-bottom: none;
}
body.ios #feature-article-container .furniture-wrapper .standfirst__inner li a:hover,
body.ios #feature-article-container .furniture-wrapper .standfirst__inner a:hover,
body.ios #standard-article-container .furniture-wrapper .standfirst__inner li a:hover,
body.ios #standard-article-container .furniture-wrapper .standfirst__inner a:hover,
body.ios #comment-article-container .furniture-wrapper .standfirst__inner li a:hover,
body.ios #comment-article-container .furniture-wrapper .standfirst__inner a:hover,
body.android #feature-article-container .furniture-wrapper .standfirst__inner li a:hover,
body.android #feature-article-container .furniture-wrapper .standfirst__inner a:hover,
body.android #standard-article-container .furniture-wrapper .standfirst__inner li a:hover,
body.android #standard-article-container .furniture-wrapper .standfirst__inner a:hover,
body.android #comment-article-container .furniture-wrapper .standfirst__inner li a:hover,
body.android #comment-article-container .furniture-wrapper .standfirst__inner a:hover {
text-decoration-color: var(--new-pillar-colour);
}
body.ios #feature-article-container .furniture-wrapper .meta,
body.ios #standard-article-container .furniture-wrapper .meta,
body.ios #comment-article-container .furniture-wrapper .meta,
body.android #feature-article-container .furniture-wrapper .meta,
body.android #standard-article-container .furniture-wrapper .meta,
body.android #comment-article-container .furniture-wrapper .meta {
margin: 0;
}
body.ios #feature-article-container .furniture-wrapper .meta .byline,
body.ios #feature-article-container .furniture-wrapper .meta .byline__author,
body.ios #feature-article-container .furniture-wrapper .meta span.byline__author a,
body.ios #feature-article-container .furniture-wrapper .meta .meta__byline span,
body.ios #standard-article-container .furniture-wrapper .meta .byline,
body.ios #standard-article-container .furniture-wrapper .meta .byline__author,
body.ios #standard-article-container .furniture-wrapper .meta span.byline__author a,
body.ios #standard-article-container .furniture-wrapper .meta .meta__byline span,
body.ios #comment-article-container .furniture-wrapper .meta .byline,
body.ios #comment-article-container .furniture-wrapper .meta .byline__author,
body.ios #comment-article-container .furniture-wrapper .meta span.byline__author a,
body.ios #comment-article-container .furniture-wrapper .meta .meta__byline span,
body.android #feature-article-container .furniture-wrapper .meta .byline,
body.android #feature-article-container .furniture-wrapper .meta .byline__author,
body.android #feature-article-container .furniture-wrapper .meta span.byline__author a,
body.android #feature-article-container .furniture-wrapper .meta .meta__byline span,
body.android #standard-article-container .furniture-wrapper .meta .byline,
body.android #standard-article-container .furniture-wrapper .meta .byline__author,
body.android #standard-article-container .furniture-wrapper .meta span.byline__author a,
body.android #standard-article-container .furniture-wrapper .meta .meta__byline span,
body.android #comment-article-container .furniture-wrapper .meta .byline,
body.android #comment-article-container .furniture-wrapper .meta .byline__author,
body.android #comment-article-container .furniture-wrapper .meta span.byline__author a,
body.android #comment-article-container .furniture-wrapper .meta .meta__byline span {
/* هیچ سبک خاصی در اینجا تعریف نشده است */
}
در اندروید، متن byline و لینکهای نویسنده در بخشهای مقاله و نظر از رنگ ستون برای متن خود استفاده میکنند. در iOS، همان استایل اعمال میشود.
برای هر دو iOS و اندروید، ناحیه اطلاعات متا در این بخشها هیچ padding اضافی ندارد. هر آیکونی (مانند عناصر SVG) در آن ناحیه از رنگ ستون برای stroke خود استفاده میکند.
دکمه زیرنویس در عناصر نمایشی در هر دو پلتفرم به همان شکل استایل داده میشود: یک دکمه کوچک و مرکزی (28 در 28 پیکسل) با 5 پیکسل padding، در 14 پیکسل از راست قرار گرفته است.
بدنه اصلی مقاله در هر دو iOS و اندروید 12 پیکسل padding در سمت چپ و راست دارد.
تصاویر در بدنه مقاله که بندانگشتی یا همهجانبه نیستند (مانند تصاویر استاندارد یا نمایشی)، عرض کامل صفحهنمایش منهای 24 پیکسل (برای در نظر گرفتن padding) و هر عرض نوار اسکرول را میگیرند. زیرنویسهای آنها از همان قوانین چیدمان پیروی میکنند.
برای عناصری که همهجانبه نیست
