Nous normalisons l'apparence des bordures qui peuvent être utilisées pour les boutons, les cartes, les pop-ups et d'autres composants.
Il y a plusieurs styles de bordure que vous pouvez choisir.
Nom | Épaisseur | Demo |
Solid | 1px | |
Dashed | 2px |
Il y a plusieurs styles de radius que vous pouvez choisir.
<div class="title">Pas de radius</div>
<div class="value">border-radius: 0px</div>
<div class="radius"></div>
<div class="title">Petit radius</div>
<div class="value">border-radius: {{borderRadiusSmall}}</div>
<div
class="radius"
:style="{ borderRadius: borderRadiusSmall }"
></div>
<div class="title">Grand radius</div>
<div class="value">border-radius: {{borderRadiusBase}}</div>
<div
class="radius"
:style="{ borderRadius: borderRadiusBase }"
></div>
<div class="title">Radius rond</div>
<div class="value">border-radius: 30px</div>
<div class="radius radius-30"></div>
Il y a plusieurs styles d'ombres que vous pouvez choisir.
<div class="demo-shadow" :style="{ boxShadow: boxShadowBase }"
Ombre de base, box-shadow: {{boxShadowBase}}
<div class="demo-shadow" :style="{ boxShadow: boxShadowLight }"
Ombre légère, box-shadow: {{boxShadowLight}}