Tento CSS kód definuje rodinu písma "Guardian Headline Full" s různými styly a váhami. Zahrnuje lehkou (300), běžnou (400), střední (500) a polotučnou (600) verzi, každou v normálním i kurzívním stylu. Soubory písem jsou poskytovány ve formátech WOFF2, WOFF a TrueType z webových zdrojů Guardianu.
Tento CSS kód definuje několik rodin písem pro web Guardianu, specifikuje různé váhy a styly s příslušnými formáty souborů (WOFF2, WOFF, TTF). Také zahrnuje media queries pro responzivní design, upravující styly na základě stavu skriptování, uživatelských preferencí pohybu a velikosti obrazovky. Dále nastavuje proměnné barev, vlastnosti rozvržení pro interaktivní prvky a specifické styly pro komponenty jako karta kreditů a filmová propagace, zajišťující konzistentní vzhled napříč zařízeními.
Karta kreditů používá specifická písma a velikosti pro své textové prvky. Odkazy a odstavce v kartě kreditů jsou zobrazeny jako inline-block s patkovým písmem o velikosti 24px, tučnou váhou a výškou řádku 115%, s dolním okrajem 20px a maximální šířkou odpovídající jejich obsahu. Odstavce jsou nastaveny na malá písmena s normálním mezerami mezi znaky.
Nadpis v kartě kreditů je absolutně umístěn ve středu, používá bezpatkové písmo o velikosti 14px, text je velkými písmeny s mezerami mezi znaky 2px. Ostatní odstavce v kartě používají stejné bezpatkové písmo a velikost, některé mají styl velkých písmen a nastavené mezery mezi znaky.
Odkazy v kartě kreditů sdílejí vlastnosti patkového písma, velikosti, váhy, výšky řádku, okrajů a maximální šířky a jsou bílé bez podtržení při najetí myší. Poslední odkaz nemá dolní okraj. Kontejner karty je absolutně pozicován, vycentrován a používá flexbox pro vertikální zarovnání položek.
Iframe v kartě kreditů má šířku 85 % viewportu, poměr stran 16:9, maximální šířku 680px a dolní okraj 12px.
Obal interaktivní galerie má nastavenou minimální a pevnou výšku na výšku viewportu, tmavé pozadí, středové zarovnání a záporné okraje, které se upravují na větších obrazovkách. Při obsahu fixního prvku je zarovnání resetováno.
Samotná interaktivní galerie má šířku založenou na viewportu, maximální šířku měnící se s velikostí obrazovky, středové pozicování, bílý text, flex zobrazení, maximální výšku 60 % viewportu, skrytý přetečení, okraj a zaoblené rohy. Obsahuje přechodový překryt na dně a zakazuje pointer events pro odkazy. Obrázky a popisky jsou optimalizovány pro výkon.
Vnitřní kontejner galerie má relativní pozici a upravuje svou šířku. V fixním režimu pokrývá celý viewport s černým pozadím, fixním pozicováním, povoleným skrolováním a bez okrajů nebo zaoblených rohů. Textové prvky v fixním režimu mají specifické odsazení, maximální šířku a nastavení barev a obrázky jsou škálovány na plnou velikost s upravenými okraji a průhledností. Obrázky v fixním režimu mají maximální šířku 980px a jsou vycentrovány.
Tento CSS kód definuje styly pro interaktivní galerii. Zajišťuje správné zobrazení obrázků a videí s responzivním designem, přizpůsobujícím se různým velikostem obrazovky. Textové prvky jako nadpisy a popisky mají specifická písma, velikosti a barvy pro konzistenci. Galerie zahrnuje interaktivní prvky jako tlačítka pro otevírání a zavírání překryvů, s efekty při najetí myší pro lepší uživatelský zážitek. Videa jsou nastavena, aby plně pokrývala své kontejnery, a popisky jsou stylovány tak, aby byly jasné a čitelné. Rozvržení je optimalizováno pro mobilní i desktopové zobrazení, zachovávající čistou a poutavou prezentaci.
CSS kód definuje styly pro celoobrazovkovou interaktivní hlavičku s videopozadím a textovým překryvem. Pozicuje prvky tak, aby pokrývaly celý viewport, skrývá určité komponenty a upravuje okraje a odsazení pro různé velikosti obrazovky. Text hlavičky je vycentrován dole s poloprůhledným pozadím, používá specifická písma a velikosti, které se mění na větších obrazovkách. Titulek obsahuje štítek "Rozhovor" a je rozdělen na části s upravenými okraji pro vizuální zarovnání.
Pro hlavičku hlavního interaktivního sloupce má druhá část titulku velikost písma 17px, výšku řádku 125%, žádné odsazení, normální váhu písma, maximální šířku 280px a je vycentrována. Na obrazovkách širších než 46,25em se velikost písma zvětší na 20px a maximální šířka na 335px. Jména v této části jsou zobrazena kurzívou.
Sekce standfirst nemá odsazení a její odstavce jsou bílé. Sekce meta nemá maximální šířku a její sociální odkazy a tlačítka při najetí myší zčernají bez podtržení, jejich ikony také změní na černou. Funkce komentářů je skryta a odkazy v byline nemají okraje.
Při vykreslování v aplikaci je výška obalu hlavičky nastavena na celou výšku viewportu. Karta s videem je absolutně pozicována, pokrývá celou oblast s poloprůhledným černým pozadím a flex rozvržením pro distribuci obsahu. Poster video je ztmaveno na 50% jasu. Obsah obalu je vycentrován s popisem, který má horní a dolní okraje a maximální šířku 80% (nebo 400px na širších obrazovkách). Text je v specifickém bezpatkovém písmu, velkými písmeny s mezerami mezi znaky a bílý, s nadpisy v normální váze. Titulek je vycentrován a bílý.
Ovládací prvky videa zahrnují vycentrované tlačítko přehrávání s kruhovým okrajem, bílým textem a ikonou, které se při najetí myší změní na tmavý text. Obal snap videa je relativně pozicován.
Když je obrazovka alespoň 740 pixelů široká, obal videa nebude mít boční okraje. Kontejner videa uvnitř plynule zaniká nebo objevuje během půl sekundy. Pro zobrazení v aplikaci jsou hlavička i obal videa nastaveny na výšku celé obrazovky, přizpůsobující se webovým a iOS pohledům.
Sada teček pro navigaci stránky zůstává fixována na pravé straně, vycentrována vertikálně, uspořádána ve sloupci s malými mezerami mezi nimi. Objevují se plynule a jsou nad ostatním obsahem. Na širších obrazovkách se jejich pozice upravuje, aby zůstaly zarovnány se středem obsahu. Každá tečka je malý, zaoblený obdélník, který mění barvu při najetí myší nebo aktivitě.
Navigační šipky jsou fixovány vpravo dole, ale zobrazují se pouze na větších obrazovkách. Jsou stylovány jako zaoblená tlačítka s rozmazaným tmavým pozadím a mění vzhled při najetí myší. Jejich pozice se také posouvá s šířkou obrazovky, aby zůstaly vycentrovány.
Interaktivní tlačítka pro galerie a ovládací prvky videa zesvětlí barvu při najetí myší a jejich text a ikony ztmavnou.
Kredity:
Rozhovor a kinematografie: David Levene
Multimediální editor: Laurence Topham
Design a vývoj: Harry Fischer a Pip Lev
Obrázkový editor: Matt Fidler
Vedoucí fotografie: Fiona Shields
"Láska+Válka" bude dostupná na Disney+ a National Geographic od 7. listopadu 2025.
Obsah z Iráku 2003-2004:
Reflexe: "Byl jsem tak mladý a tak naivní"
Pokrytí zahrnuje Irák a Afghánistán.
Varování: Některé snímky mohou být pro diváky znepokojující.
Celoobrazovkové snímky:
1. Irácká žena hledá svého manžela v kouři z hořící plynárny v Basře, Irák, květen 2003. Foto: Lynsey Addario.
2. Zranění američtí vojáci převážení autobusem z nemocnice Balad na evakuační let během bitvy o Fallúdžu, 13. listopadu 2004. Foto: Lynsey Addario/Getty Images.
3. Američtí námořníci nesou zraněného vojáka z 173. bojové roty v údolí Korengal, Afghánistán, 23. října 2007. Foto: Lynsey Addario.
4. Noor Nisa, 18, při porodu se svou matkou v provincii Badachšán, Afghánistán, listopad 2009. První manželka jejího manžela zemřela při porodu. Protože se dítě blížilo, rozhodl se ji odvézt do nemocnice, čtyři hodiny vzdálené od jejich vesnice. Když auto, které si půjčil, selhalo, já jsem zasáhla a odvezla je tam, kde Noor porodila holčičku.
Jsou zobrazeni američtí námořníci v ženských kontaktních týmech s zdravotní sestrou HM2 Elenou Woods, 24, čistící svou zbraň po návratu z přední operační základny Camp Delhi v Helmandu, Afghánistán, 29. dubna 2010. Tyto týmy spolupracovaly s námořní pěchotou na spojení s afghánskými ženami.
Desátnice Lisa Gardner kontroluje vitální znaky afghánských žen ve vesnici Lakari během lékařské péče v Helmandu, jižní Afghánistán, 3. května 2010. Kvůli kulturním normám mnoho žen v Helmandu nemůže opustit domov nebo navštívit mužské lékaře, takže Gardner zaznamenala jejich příznaky a předala informace lékaři k základní diagnóze před poskytnutím léků.
Tisíce Syřanů přešlo do Iráku poblíž hranice Sahela v Dahuku, severní Irák, 21. srpna 2013. Úřad OSN pro uprchlíky hlásil, že od znovuotevření hranice před týdnem vstoupilo přes 30 000 lidí, s denními přechody tří až čtyř tisíc. Většina byli kurdští uprchlíci utíkající před násilím, ekonomickými potížemi a nedostatkem základních věcí jako elektřina, voda a jídlo.
V Dárfúru v letech 2004 až 2009 byla vláda obviněna z zabíjení vlastních lidí.
Čadské dívky přečkávají písečnou bouři v Bahaï, Čad, asi sedm kilometrů od súdánské hranice, 18. srpna 2004. Mnoho uprchlíků uteklo ze Súdánu do Čadu, zatímco konflikt v Dárfúru pokračoval.
Lynsey Addario fotografovala rebely Súdánské osvobozenecké armády, kteří ovládali části Dárfúru, 19. srpna 2004.
Vojáci SLA čekají u svého náklaďáku uvízlého v bahně v Dárfúru 21. srpna 2004. Bojkotovali mírová jednání v Nigérii na protest proti útokům na civilisty, tvrdíce 75 úmrtí v šesti vesnicích. Od začátku konfliktu v únoru 2003 zemřelo až 50 000 lidí a přes milion uprchlo ze svých domovů ze strachu před milicemi Džandžavíd.
Vojáci SLA míjejí mrtvé tělo z útoku na civilisty ve Farawyaiah, Dárfúr, 24. srpna 2004. V roklích bylo nalezeno šestnáct těl poté, co muži z pěti vesnic byli údajně zabiti Džandžavíd podporovanými vládními silami.
Vojáci Africké unie objevují vesnici Tama stále doutnající více než týden po útoku arabských nomádů podporovaných vládními silami severně od Nyala v listopadu 2005. AU se snažila patrolovat a vyšetřovat, ale přeživší uprchli do nedaleké vesnice, blokováni nomády, kteří stříleli na přibližující se vozidla. Stovky vesnic v Dárfúru byly vypáleny a vyloupeny arabskými nomády.
Vesnice Silea, nedávno bombardovaná súdánskou vládou a napadená Džandžavíd na velbloudech, koních a oslech v Západním Dárfúru 28. února 2008. Bombardování byla odpovědí na přepadení. Dva měsíce předtím rebelové z Hnutí za spravedlnost a rovnost převzali kontrolu a zpravodajské informace naznačovaly, že žijí v těchto vesnicích a používají je jako základnu. Fotografie: Lynsey Addario/Getty Images
Zobrazit snímek na celou obrazovku: Súdánské ženy čekají na pomoc od mezinárodních humanitárních organizací ve vesnici Selea, únor 2008. Fotografie: Lynsey Addario
Libye 2011
'Slyšel jsi kov svištět kolem uší'
Varování: Následující fotografie mohou být pro některé diváky znepokojující
Zobrazit snímek na celou obrazovku: Libyjci protestují proti plukovníku Muammaru Kaddáfímu v Benghází, Libye, 26. února 2011. Střety mezi opozičními silami a Kaddáfího věrnými pokračovaly po celé zemi. Fotografie: Lynsey Addario pro The New York Times
Zobrazit snímek na celou obrazovku: Děti si hrají poblíž hořícího auta v čtvrti Benghází, východní Libye, 28. února 2011. Nebezpečné konfrontace mezi opozicí a prokaddáfíovskými silami pokračovaly. Fotografie: Lynsey Addario pro The New York Times
Zobrazit snímek na celou obrazovku: Opoziční vojáci se střetáv
