ブートストラップ4：チェックボックスの枠をカスタマイズする

Question

私は自分のチェックボックスの色をカスタマイズしようとしています。私は、マニュアルを参照して、その後、私は背景を変更する方法を思いついた：

.custom-control-input:checked ~ .custom-control-indicator { 
     background-color: #ffa500; 
} 

チェックボックスをクリックするとボックス自体の周りのパディング（と思う）で、それでもいくつかの青い枠線もあります研究、私はあまりにもその国境の色を変更する方法を見つけることができません。誰でも私を助けることができますか？私はfiddleを作って私が持っているものを実証しました。

誰でもその境界線を変更する方法は知っていますか？

ありがとうございます！ブートストラップ4

Answer 1

は、この効果を得るためにbox-shadowを使用している：

.custom-control-input:focus~.custom-control-indicator { 
    -webkit-box-shadow: 0 0 0 1px #fff, 0 0 0 3px #0275d8; 
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px #0275d8; 
} 

丸い境界はborder-radiusで定義されています。それだけです

.custom-checkbox .custom-control-indicator { 
    border-radius: .25rem; 
}