<div class="d-flex flex-wrap justify-content-around">
<div class="form-check interest-check">
<input class="form-check-input" type="checkbox" id="f10" bind:checked={abroaddata.inostr} on:change={abroadchange("inostr")}>
<label class="form-check-label rounded-m" for="f10">Inostranstvo</label>
<i class="fa fa-check-circle color-white font-18"></i>
<i class="fa fa-earth-europe font-17 color-highlight"></i>
</div>
<div class="form-check interest-check">
<input class="form-check-input" type="checkbox" id="f11" bind:checked={abroaddata.hrv} on:change={abroadchange("hrv")}>
<label class="form-check-label rounded-m" for="f11">Hrvatska</label>
<i class="fa fa-check-circle color-white font-18"></i>
<i class="fa fa-store font-17 color-dark-dark"></i>
</div>
<div class="form-check interest-check">
<input class="form-check-input" type="checkbox" id="f12" bind:checked={abroaddata.bih} on:change={abroadchange("bih")}>
<label class="form-check-label rounded-m" for="f12">BiH</label>
<i class="fa fa-check-circle color-white font-18"></i>
<i class="fa fa-mountains font-17 color-green-dark"></i>
</div>
<div class="form-check interest-check">
<input class="form-check-input" type="checkbox" id="f13" bind:checked={abroaddata.srb} on:change={abroadchange("srb")}>
<label class="form-check-label rounded-m" for="f13">Srbija</label>
<i class="fa fa-check-circle color-white font-18"></i>
<i class="fa fa-dolly font-17 color-teal-dark"></i>
</div>
<div class="form-check interest-check">
<input class="form-check-input" type="checkbox" id="f14" bind:checked={abroaddata.alb} on:change={abroadchange("alb")}>
<label class="form-check-label rounded-m" for="f14">Albanija</label>
<i class="fa fa-check-circle color-white font-18"></i>
<i class="fa fa-star-and-crescent font-17 color-red-dark"></i>
</div>
</div>
function abroadchange(field) {
return ()=>{
if ( field == "hrv" || field == "bih" || field == "srb" || field == "alb" ) {
if (abroaddata.inostr) {
abroaddata.inostr = false
}
}else{
abroaddata.hrv = abroaddata.bih = abroaddata.srb = abroaddata.alb = false
}
abroadchangeText()
}
}
function abroadchangeText() {
if (abroaddata.inostr) {
abroaddata.abroaddeftext = "inostranstvo"
} else {
abroaddata.abroaddeftext = ""
if (abroaddata.hrv) {
abroaddata.abroaddeftext += "Hrvatsku"
}
if (abroaddata.bih) {
abroaddata.abroaddeftext += (abroaddata.abroaddeftext.length>0?", ":"")+"Bosnu i Hercegovinu"
}
if (abroaddata.srb) {
abroaddata.abroaddeftext += (abroaddata.abroaddeftext.length>0?", ":"")+"Srbiju"
}
if (abroaddata.alb) {
abroaddata.abroaddeftext += (abroaddata.abroaddeftext.length>0?", ":"")+"Albaniju"
}
}
}