PronounsPage/components/SupportBanners.vue
2024-05-26 11:49:47 +02:00

45 lines
1.2 KiB
Vue

<template>
<div>
<div class="p-2 border border-primary-subtle bg-white mb-2">
<strong><T>supportBanners.gaza.header</T></strong>
<br class="d-md-none">
<T>supportBanners.gaza.link</T>
</div>
<div class="p-2 border border-primary-subtle bg-white mb-2">
<strong><T>supportBanners.ukraine.header</T></strong>
<br class="d-md-none">
<T>supportBanners.ukraine.link</T>
</div>
</div>
</template>
<style lang="scss">
@import "assets/variables";
$ukraine-blue: #025abc;
$ukraine-golden: #fed602;
.border-ukraine {
//border-top: 3px solid linear-gradient(90deg, $ukraine-blue 40%, $ukraine-golden 60%);
//background-color: $ukraine-blue;
//background: linear-gradient(90deg, $ukraine-blue 40%, $ukraine-golden 60%);
//color: $white;
//text-shadow: 2px 2px 2px rgba($black, .5);
border: 1px solid $border-color;
// border-top: 5px solid;
border-image-slice: 1;
border-image-source: linear-gradient(90deg, $ukraine-blue 40%, $ukraine-golden 60%);
a {
//color: $white;
text-decoration: underline;
}
}
body[data-theme="dark"] .border-ukraine a {
color: $white;
text-decoration: underline;
}
</style>