, | ,
kendi inline "font-size" degerini tasiyordu ve olcek sayfa icinde bile
tutarsizdi (ayni seviyedeki bolum basliklari clarification-text'te hem
16px hem 18px, cookie-policy'de govde satirlari hem 14px hem 16px'ti;
bir hucrede "font-size:14pxv" yazim hatasi vardi).
Ustune base.css'in tipografi olcegi biniyordu:
h1 { font-size: var(--cc-h1) !important } -> masaustunde 40px
!important oldugu icin inline 20px'i eziyor, 14px'lik govdenin ustunde
asiri buyuk bir baslik cikiyordu.
Cozum: inline font-size'lar sablonlardan kaldirildi, olcek tek kaynak
olarak burada. Bolum basliklari .legal-h2 / .legal-h3 sinifiyla, sayfa
basligi .legal-title ile isaretli.
OZGULLUK NOTU: base.css, sayfa CSS'lerinden SONRA yukleniyor
(base.html: customCss bloku 111. satir, base.css 395. satir). Bu yuzden
base.css'in !important tasiyan kurallarini yenmek icin burada da
!important + daha yuksek ozgulluk gerekiyor; sira ile kazanmak mumkun
degil. Ayni sey bootstrap'in .p-5 / .p-4 / .d-flex yardimci siniflari
icin de gecerli (onlar da !important).
OLCEK (base.css'teki kurumsal olcegin basamaklarindan seciliyor):
H1 masaustu 28px / mobil 24px (base.css'in mobil H1 basamagi)
H2 masaustu 20px / mobil 18px
H3 masaustu 17px / mobil 16px
Body 16px / mobil 15px
Tablo 14px / mobil 13px
Baslik 40px degil 28px: bunlar bolum basligi degil, govdesi 16px olan
uzun bir dokumanin tek basligi.
========================================================================== */
/* --- Sayfa cercevesi ------------------------------------------------------
Icerik "col-md-8" ile 12 kolonun 8'ine hapsedilmisti; ustune container'in
p-5'i (her yandan 48px) ve kartin p-4'u (24px) biniyordu. 1920px'lik bir
ekranda metin ~650px kaliyor, iki yanda ~630px bos alan oluyordu.
Kolon tam genislige aciliyor, sinir artik container'in max-width'i.
-------------------------------------------------------------------------- */
main.cc-legal {
/* d-flex + align-items-center uzun bir dokumanda ise yaramiyor,
yalnizca dikey hizalamayi bozuyor. */
display: block !important;
}
.cc-legal > .container.p-5 {
max-width: 1180px;
padding: 32px 20px 56px !important;
}
.cc-legal .col-md-8 {
flex: 0 0 100%;
max-width: 100%;
width: 100%;
}
.cc-legal .bg-light.p-4 {
padding: 40px 48px !important;
}
/* --- Tipografi ----------------------------------------------------------- */
/* Guvenlik agi: inline font-size'lar sablonlardan kaldirildi, ama ikisi
{% trans %} msgid'inin ICINDE kaldi (cookie-policy'de "Cerez kullanilmasini tercih
etmemeniz halinde ..."). msgid'i degistirmek django.po
eslesmesini bozar - ingilizce sayfa turkce metne duserdi - bu yuzden
asagidaki kural inline degeri notrleyip mirasi geri veriyor. Yeni bir
sayfaya ayni sekilde gomulu bir deger gelirse de olcek bozulmaz. */
.cc-legal [style*="font-size"] {
font-size: inherit !important;
}
/* base-1.css'te global bir "span { font-size: 1.25rem; display: block;
font-weight: 500 }" kurali var. Bu sayfalarda cumle icindeki 'ler
(ornegin "tercih etmemeniz halinde" gibi alti cizili ifadeler) blok
haline gelip cumleyi ortasindan kesiyor ve 20px'e cikiyordu. Kapsam
icinde satir ici davranisa geri donuluyor. */
.cc-legal span {
display: inline;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
margin: 0;
color: inherit;
}
/* base.css'teki "a { text-decoration: none; color: black }" yuzunden
metnin icindeki e-posta baglantilari duz metinden ayirt edilemiyordu. */
.cc-legal .bg-light a {
text-decoration: underline;
}
.cc-legal .legal-title {
font-size: 28px !important;
line-height: 1.3;
font-weight: 700;
text-align: center;
margin: 0 0 32px;
}
/* Bolum basliklari. Bir kismi , bir kismi icindeki
(PDF donusumunden kalma); ikisi de blok gibi davranmali. */
.cc-legal .legal-h2 {
display: block;
font-size: 20px;
line-height: 1.35;
font-weight: 700;
margin: 34px 0 10px;
}
.cc-legal .legal-h3 {
display: block;
font-size: 17px;
line-height: 1.4;
font-weight: 700;
margin: 24px 0 8px;
}
/* Baslik dokumanin ilk ogesiyse ustunde bosluk birakmasin. */
.cc-legal .legal-h2:first-child,
.cc-legal .legal-h3:first-child {
margin-top: 0;
}
.cc-legal p,
.cc-legal li {
font-size: 16px;
line-height: 1.7;
}
.cc-legal p {
margin-bottom: 14px;
}
/* PDF donusumu satir araligi icin bos 'ler birakmis (ayrica kapatilmamis
ciftleri tarayicida bos 'ye donusuyor). Hepsi gereksiz dikey
bosluk uretiyordu. */
.cc-legal p:empty {
display: none;
}
.cc-legal ul,
.cc-legal ol {
padding-left: 24px;
margin-bottom: 16px;
}
.cc-legal li {
margin-bottom: 8px;
}
.cc-legal li > ul,
.cc-legal li > ol {
margin-top: 8px;
}
/* Tablo (cookie-policy'deki cerez listesi) govdeden bir basamak kucuk. */
.cc-legal table {
width: 100%;
max-width: 100%;
border-collapse: collapse;
margin: 16px 0 24px;
}
.cc-legal th,
.cc-legal td {
font-size: 14px;
line-height: 1.5;
vertical-align: top;
}
/* --- Tablet ve alti ------------------------------------------------------ */
@media (max-width: 991px) {
.cc-legal > .container.p-5 {
padding: 24px 16px 40px !important;
}
.cc-legal .bg-light.p-4 {
padding: 28px 24px !important;
}
}
@media (max-width: 767px) {
.cc-legal .legal-title {
font-size: 24px !important;
margin-bottom: 24px;
}
.cc-legal .legal-h2 {
font-size: 18px;
margin-top: 28px;
}
.cc-legal .legal-h3 {
font-size: 16px;
}
.cc-legal p,
.cc-legal li {
font-size: 15px;
}
.cc-legal > .container.p-5 {
padding: 20px 12px 32px !important;
}
.cc-legal .bg-light.p-4 {
padding: 20px 16px !important;
}
.cc-legal th,
.cc-legal td {
font-size: 13px;
padding: 6px !important;
}
}
|