Bir projemde Bootstrap 5 kullanılıyorum. BS'nin varsayılan özelliklerini değiştirerek temayı özelleştiriyorum. Aynı özelleştirmeyi RTL sürümünde de yapmak istiyorum ama BS kendi sayfasında bize derlenmiş dosya veriyor.

https://getbootstrap.com/docs/5.0/getting-started/rtl/

Burada RTL sürümünün nasıl aktif edileceği yazıyor ama SASS desteği yok ve ben bu özelleştirmeleri yapamayacağım. Benim yapmak istediğim hem RTL sürümünü kullanıp hemde aşağıda paylaştığım dosyadaki özelleştirmeleri yapmak.

Öncelikle Bootstrap'i kendime göre özelleştirdiğim dosyam:

// Bootstrap colors
$primary: #ff6e40;
$secondary: #9932e7;
$success: #05b171;
$info: #25c2e3;
$warning: #faae42;
$danger: #ea4444;
$light: #ededed;
$dark: #293134;

$border-radius: .50rem; // Custom border radius

$dropdown-border-radius: $border-radius;

$font-size-base: 0.875rem;

$display-font-sizes: (
    1: 5rem,
    2: 4.5rem,
    3: 4rem,
    4: 3.5rem,
    5: 3rem,
    6: 2.5rem,
    7: 2rem,
    8: 1.8rem,
);
$display-font-weight: 400;

$utilities: (
    "opacity": (
        property: opacity,
        values: (
            0: 0,
            25: .25,
            50: .5,
            75: .75,
            100: 1,
        )
    )
);

$enable-smooth-scroll: false;

Not: BS Rtl ve Ltr dosyaları sayfaya ayrı ayrı dahil edilir. Her iki dosyayı da çağırın demeyin lütfen olmuyor çünkü. Eksik kalıyor. Örnek:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" >

veya

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.rtl.min.css">

bu iki dosyayı aynı anda sayfaya çağıramam. Daha bozuluyor işler.

Yardımlarınızı bekliyorum.