| @@ -18,15 +18,10 @@ | ||
| 18 | 18 | --bkbg-tl-card-border-w: 1px; |
| 19 | 19 | --bkbg-tl-card-radius: 12px; |
| 20 | 20 | --bkbg-tl-card-padding: 24px; |
| 21 | 21 | --bkbg-tl-date-color: #3b82f6; |
| 22 | - --bkbg-tl-date-size: 14px; | |
| 23 | - --bkbg-tl-date-weight: 600; | |
| 24 | 22 | --bkbg-tl-title-color: #1f2937; |
| 25 | - --bkbg-tl-title-size: 20px; | |
| 26 | - --bkbg-tl-title-weight: 600; | |
| 27 | 23 | --bkbg-tl-content-color: #6b7280; |
| 28 | - --bkbg-tl-content-size: 15px; | |
| 29 | 24 | --bkbg-tl-spacing: 40px; |
| 30 | 25 | |
| 31 | 26 | position: relative; |
| 32 | 27 | width: 100%; |
| @@ -166,30 +161,61 @@ | ||
| 166 | 161 | |
| 167 | 162 | /* Date */ |
| 168 | 163 | .bkbg-tl-date { |
| 169 | 164 | color: var(--bkbg-tl-date-color); |
| 170 | - font-size: var(--bkbg-tl-date-size); | |
| 171 | - font-weight: var(--bkbg-tl-date-weight); | |
| 165 | + font-family: var(--bktl-dt-font-family, inherit); | |
| 166 | + font-size: var(--bktl-dt-font-size-d, 14px); | |
| 167 | + font-weight: var(--bktl-dt-font-weight, 600); | |
| 168 | + font-style: var(--bktl-dt-font-style, normal); | |
| 169 | + line-height: var(--bktl-dt-line-height-d, 1.3); | |
| 170 | + text-decoration: var(--bktl-dt-text-decoration, none); | |
| 171 | + text-transform: var(--bktl-dt-text-transform, uppercase); | |
| 172 | + letter-spacing: var(--bktl-dt-letter-spacing-d, 0.5px); | |
| 173 | + word-spacing: var(--bktl-dt-word-spacing-d, normal); | |
| 172 | 174 | margin-bottom: 8px; |
| 173 | - text-transform: uppercase; | |
| 174 | - letter-spacing: 0.5px; | |
| 175 | 175 | } |
| 176 | 176 | |
| 177 | 177 | /* Title */ |
| 178 | 178 | .bkbg-tl-title { |
| 179 | 179 | color: var(--bkbg-tl-title-color); |
| 180 | - font-size: var(--bkbg-tl-title-size); | |
| 181 | - font-weight: var(--bkbg-tl-title-weight); | |
| 180 | + font-family: var(--bktl-tt-font-family, inherit); | |
| 181 | + font-size: var(--bktl-tt-font-size-d, 20px); | |
| 182 | + font-weight: var(--bktl-tt-font-weight, 600); | |
| 183 | + font-style: var(--bktl-tt-font-style, normal); | |
| 184 | + line-height: var(--bktl-tt-line-height-d, 1.3); | |
| 185 | + text-decoration: var(--bktl-tt-text-decoration, none); | |
| 186 | + text-transform: var(--bktl-tt-text-transform, none); | |
| 187 | + letter-spacing: var(--bktl-tt-letter-spacing-d, normal); | |
| 188 | + word-spacing: var(--bktl-tt-word-spacing-d, normal); | |
| 182 | 189 | margin: 0 0 12px 0; |
| 183 | - line-height: 1.3; | |
| 184 | 190 | } |
| 185 | 191 | |
| 192 | +/* Rule 7: heading specificity */ | |
| 193 | +.bkbg-tl-card h4.bkbg-tl-title { | |
| 194 | + font-family: var(--bktl-tt-font-family, inherit); | |
| 195 | + font-size: var(--bktl-tt-font-size-d, 20px); | |
| 196 | + font-weight: var(--bktl-tt-font-weight, 600); | |
| 197 | + font-style: var(--bktl-tt-font-style, normal); | |
| 198 | + line-height: var(--bktl-tt-line-height-d, 1.3); | |
| 199 | + text-decoration: var(--bktl-tt-text-decoration, none); | |
| 200 | + text-transform: var(--bktl-tt-text-transform, none); | |
| 201 | + letter-spacing: var(--bktl-tt-letter-spacing-d, normal); | |
| 202 | + word-spacing: var(--bktl-tt-word-spacing-d, normal); | |
| 203 | +} | |
| 204 | + | |
| 186 | 205 | /* Content */ |
| 187 | 206 | .bkbg-tl-content { |
| 188 | 207 | color: var(--bkbg-tl-content-color); |
| 189 | - font-size: var(--bkbg-tl-content-size); | |
| 208 | + font-family: var(--bktl-ct-font-family, inherit); | |
| 209 | + font-size: var(--bktl-ct-font-size-d, 15px); | |
| 210 | + font-weight: var(--bktl-ct-font-weight, normal); | |
| 211 | + font-style: var(--bktl-ct-font-style, normal); | |
| 212 | + line-height: var(--bktl-ct-line-height-d, 1.6); | |
| 213 | + text-decoration: var(--bktl-ct-text-decoration, none); | |
| 214 | + text-transform: var(--bktl-ct-text-transform, none); | |
| 215 | + letter-spacing: var(--bktl-ct-letter-spacing-d, normal); | |
| 216 | + word-spacing: var(--bktl-ct-word-spacing-d, normal); | |
| 190 | 217 | margin: 0; |
| 191 | - line-height: 1.6; | |
| 192 | 218 | } |
| 193 | 219 | |
| 194 | 220 | /* ======================================== |
| 195 | 221 | Alternating Layout (Vertical) |
| @@ -649,8 +675,19 @@ | ||
| 649 | 675 | |
| 650 | 676 | /* ======================================== |
| 651 | 677 | Responsive |
| 652 | 678 | ======================================== */ |
| 679 | + | |
| 680 | +@media (max-width: 1024px) { | |
| 681 | + .bkbg-tl-date{font-size:var(--bktl-dt-font-size-t,var(--bktl-dt-font-size-d,14px));line-height:var(--bktl-dt-line-height-t,var(--bktl-dt-line-height-d,1.3));letter-spacing:var(--bktl-dt-letter-spacing-t,var(--bktl-dt-letter-spacing-d,0.5px));word-spacing:var(--bktl-dt-word-spacing-t,var(--bktl-dt-word-spacing-d,normal))} | |
| 682 | + .bkbg-tl-card .bkbg-tl-title{font-size:var(--bktl-tt-font-size-t,var(--bktl-tt-font-size-d,20px));line-height:var(--bktl-tt-line-height-t,var(--bktl-tt-line-height-d,1.3));letter-spacing:var(--bktl-tt-letter-spacing-t,var(--bktl-tt-letter-spacing-d,normal));word-spacing:var(--bktl-tt-word-spacing-t,var(--bktl-tt-word-spacing-d,normal))} | |
| 683 | + .bkbg-tl-content{font-size:var(--bktl-ct-font-size-t,var(--bktl-ct-font-size-d,15px));line-height:var(--bktl-ct-line-height-t,var(--bktl-ct-line-height-d,1.6));letter-spacing:var(--bktl-ct-letter-spacing-t,var(--bktl-ct-letter-spacing-d,normal));word-spacing:var(--bktl-ct-word-spacing-t,var(--bktl-ct-word-spacing-d,normal))} | |
| 684 | +} | |
| 685 | +@media (max-width: 767px) { | |
| 686 | + .bkbg-tl-date{font-size:var(--bktl-dt-font-size-m,var(--bktl-dt-font-size-t,var(--bktl-dt-font-size-d,14px)));line-height:var(--bktl-dt-line-height-m,var(--bktl-dt-line-height-t,var(--bktl-dt-line-height-d,1.3)));letter-spacing:var(--bktl-dt-letter-spacing-m,var(--bktl-dt-letter-spacing-t,var(--bktl-dt-letter-spacing-d,0.5px)));word-spacing:var(--bktl-dt-word-spacing-m,var(--bktl-dt-word-spacing-t,var(--bktl-dt-word-spacing-d,normal)))} | |
| 687 | + .bkbg-tl-card .bkbg-tl-title{font-size:var(--bktl-tt-font-size-m,var(--bktl-tt-font-size-t,var(--bktl-tt-font-size-d,20px)));line-height:var(--bktl-tt-line-height-m,var(--bktl-tt-line-height-t,var(--bktl-tt-line-height-d,1.3)));letter-spacing:var(--bktl-tt-letter-spacing-m,var(--bktl-tt-letter-spacing-t,var(--bktl-tt-letter-spacing-d,normal)));word-spacing:var(--bktl-tt-word-spacing-m,var(--bktl-tt-word-spacing-t,var(--bktl-tt-word-spacing-d,normal)))} | |
| 688 | + .bkbg-tl-content{font-size:var(--bktl-ct-font-size-m,var(--bktl-ct-font-size-t,var(--bktl-ct-font-size-d,15px)));line-height:var(--bktl-ct-line-height-m,var(--bktl-ct-line-height-t,var(--bktl-ct-line-height-d,1.6)));letter-spacing:var(--bktl-ct-letter-spacing-m,var(--bktl-ct-letter-spacing-t,var(--bktl-ct-letter-spacing-d,normal)));word-spacing:var(--bktl-ct-word-spacing-m,var(--bktl-ct-word-spacing-t,var(--bktl-ct-word-spacing-d,normal)))} | |
| 689 | +} | |
| 653 | 690 | |
| 654 | 691 | @media (max-width: 768px) { |
| 655 | 692 | /* Disable alternating on mobile */ |
| 656 | 693 | .bkbg-tl-vertical.bkbg-tl-alternating .bkbg-tl-items::before { |
