[REF] web: add btn-links variations

Create variations for btn-link with UI color classes.
These btns appear as default text (muted necessary) and they will use
an UI color on hover.
This commit is contained in:
stefanorigano
2017-09-05 12:13:55 +02:00
committed by qsm-odoo
parent 1f78ae3c18
commit 378fe92b60
+34
View File
@@ -108,9 +108,43 @@
}
//== Buttons
// Mixin to define variations for btn-links and muted btn-links
.o-btn-link-variant(@color, @color-active) {
text-transform: none;
.o-hover-text-color(@default-color: @color, @hover-color: @color-active);
&, &:hover, &:focus, &:active, &.active {
border-color: transparent;
background-color: transparent
}
&.text-muted, .text-muted {
.o-hover-opacity();
.o-hover-text-color(@default-color: @text-muted, @hover-color: @color-active);
}
}
.btn-icon {
.button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
}
.btn-link {
font-weight: @btn-font-weight;
&.btn-default {
.o-btn-link-variant(@text-color, @headings-color);
}
&.btn-success, &.text-success {
.o-btn-link-variant(@text-color, @brand-success);
}
&.btn-warning, &.text-warning {
.o-btn-link-variant(@text-color, @brand-warning);
}
&.btn-danger, &.text-danger {
.o-btn-link-variant(@text-color, @brand-danger);
}
&.btn-info, &.text-info {
.o-btn-link-variant(@text-color, darken(@brand-info, 20%));
}
}
//== Printing improvements
@media print {