@opentiny/vue-theme/link/index.css

An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

.tiny-link{--tv-Link-font-size:var(--tv-font-size-default, 14px);--tv-Link-font-weight:var(--tv-font-weight-regular, 400);--tv-Link-border-color:var(--tv-color-border-hover, #191919);--tv-Link-has-icon-underline-width:calc(100% - 20px);--tv-Link-display:inline;--tv-Link-svg-width:var(--tv-font-size-lg, 16px);--tv-Link-svg-height:var(--tv-font-size-xxl, 20px);--tv-Link-svg-margin-right:var(--tv-space-sm, 4px);--tv-Link-icon-hover-text-weight:var(--tv-font-weight-regular, 400);--tv-Link-default-text-color:var(--tv-color-text-link, #1476ff);--tv-Link-default-border-color:var(--tv-color-text-link-hover, #1476ff);--tv-Link-default-hover-text-color:var(--tv-color-text-link-hover, #1476ff);--tv-Link-default-disabled-text-color:var(--tv-color-text-disabled, #c2c2c2);--tv-Link-default-hover-border-color:var(--tv-color-act-primary-border-hover, #595959);--tv-Link-primary-text-color:var(--tv-color-text-link-1, #191919);--tv-Link-primary-border-color:var(--tv-color-act-primary-border, #191919);--tv-Link-primary-hover-text-color:var(--tv-color-text-link-1-hover, #191919);--tv-Link-primary-disabled-text-color:var(--tv-color-text-disabled, #c2c2c2);--tv-Link-danger-text-color:var(--tv-color-act-danger-text, #f23030);--tv-Link-danger-border-color:var(--tv-color-act-danger-border, #f23030);--tv-Link-danger-hover-text-color:var(--tv-color-act-danger-text-hover, #f23030);--tv-Link-danger-disabled-text-color:var(--tv-color-text-disabled, #c2c2c2);--tv-Link-success-text-color:var(--tv-color-success-text, #5cb300);--tv-Link-success-border-color:var(--tv-color-success-border, #5cb300);--tv-Link-success-hover-text-color:var(--tv-color-act-success-text-hover, #5cb300);--tv-Link-success-disabled-text-color:var(--tv-color-text-disabled, #c2c2c2);--tv-Link-warning-text-color:var(--tv-color-warn-text, #ff8800);--tv-Link-warning-border-color:var(--tv-color-warn-border, #ff8800);--tv-Link-warning-hover-text-color:var(--tv-color-act-warning-text-hover, #ff8800);--tv-Link-warning-disabled-text-color:var(--tv-color-text-disabled, #c2c2c2);--tv-Link-info-text-color:var(--tv-color-act-info-text, #1476ff);--tv-Link-info-border-color:var(--tv-color-info-border, #1476ff);--tv-Link-info-hover-text-color:var(--tv-color-act-info-text-hover, #1476ff);--tv-Link-info-disabled-text-color:var(--tv-color-text-disabled, #c2c2c2);--tv-Link-has-svg-hover-text-color:var(--tv-color-text-link-hover, #1476ff);--tv-Link-svg-padding-bottom:var(--tv-space-xs, 2px);vertical-align:middle;position:relative;text-decoration:none;outline:0;cursor:pointer;padding:0;font-size:var(--tv-Link-font-size);font-weight:var(--tv-Link-font-weight)}.tiny-link .tiny-svg{width:var(--tv-Link-svg-width);height:var(--tv-Link-svg-height);padding-bottom:var(--tv-Link-svg-padding-bottom);margin-right:0;margin-left:var(--tv-Link-svg-margin-right)}.tiny-link .tiny-link-svg{margin-right:var(--tv-Link-svg-margin-right);margin-left:0}.tiny-link .tiny-link__inner .tiny-svg{margin-right:0;margin-left:var(--tv-Link-svg-margin-right)}.tiny-link.tiny-link--additional:hover{color:var(--tv-Link-default-hover-text-color);fill:var(--tv-Link-default-hover-text-color)}.tiny-link.tiny-link--additional.is-disabled:hover{color:var(--tv-Link-default-disabled-text-color);fill:var(--tv-Link-default-disabled-text-color)}.tiny-link.tiny-link--additional:has(.tiny-svg):hover{font-weight:var(--tv-Link-icon-hover-text-weight);color:var(--tv-Link-has-svg-hover-text-color);fill:var(--tv-Link-has-svg-hover-text-color)}.tiny-link.tiny-link--additional:has(.tiny-svg).is-disabled:hover{font-weight:var(--tv-Link-font-weight);color:var(--tv-Link-default-disabled-text-color);fill:var(--tv-Link-default-disabled-text-color)}.tiny-link.is-underline:hover:after{content:'';width:100%;position:absolute;left:0;height:0;bottom:0;display:block;border-bottom:1px solid var(--tv-Link-border-color)}.tiny-link.is-underline:hover:has(.tiny-svg):after{width:var(--tv-Link-has-icon-underline-width)}.tiny-link.is-underline:hover:has(>:first-child:not(.tiny-link__inner)):after{left:calc(100% - var(--tv-Link-has-icon-underline-width))}.tiny-link.is-disabled{cursor:not-allowed}.tiny-link.tiny-link--default{color:var(--tv-Link-default-text-color);fill:var(--tv-Link-default-text-color)}.tiny-link.tiny-link--default g{color:var(--tv-Link-default-text-color);fill:var(--tv-Link-default-text-color)}.tiny-link.tiny-link--default.is-underline:hover:after{border-color:var(--tv-Link-default-border-color)}.tiny-link.tiny-link--default:hover{text-decoration:none;color:var(--tv-Link-default-hover-text-color)}.tiny-link.tiny-link--default.is-disabled,.tiny-link.tiny-link--default.is-disabled:hover{color:var(--tv-Link-default-disabled-text-color);fill:var(--tv-Link-default-disabled-text-color)}.tiny-link.tiny-link--default.is-disabled g,.tiny-link.tiny-link--default.is-disabled:hover g{color:var(--tv-Link-default-disabled-text-color);fill:var(--tv-Link-default-disabled-text-color)}.tiny-link.tiny-link--primary{color:var(--tv-Link-primary-text-color);fill:var(--tv-Link-primary-text-color)}.tiny-link.tiny-link--primary g{color:var(--tv-Link-primary-text-color);fill:var(--tv-Link-primary-text-color)}.tiny-link.tiny-link--primary.is-underline:hover:after{border-color:var(--tv-Link-primary-border-color)}.tiny-link.tiny-link--primary:hover{text-decoration:none;color:var(--tv-Link-primary-hover-text-color)}.tiny-link.tiny-link--primary.is-disabled,.tiny-link.tiny-link--primary.is-disabled:hover{color:var(--tv-Link-primary-disabled-text-color);fill:var(--tv-Link-primary-disabled-text-color)}.tiny-link.tiny-link--primary.is-disabled g,.tiny-link.tiny-link--primary.is-disabled:hover g{color:var(--tv-Link-primary-disabled-text-color);fill:var(--tv-Link-primary-disabled-text-color)}.tiny-link.tiny-link--danger{color:var(--tv-Link-danger-text-color);fill:var(--tv-Link-danger-text-color)}.tiny-link.tiny-link--danger g{color:var(--tv-Link-danger-text-color);fill:var(--tv-Link-danger-text-color)}.tiny-link.tiny-link--danger.is-underline:hover:after{border-color:var(--tv-Link-danger-border-color)}.tiny-link.tiny-link--danger:hover{text-decoration:none;color:var(--tv-Link-danger-hover-text-color)}.tiny-link.tiny-link--danger.is-disabled,.tiny-link.tiny-link--danger.is-disabled:hover{color:var(--tv-Link-danger-disabled-text-color);fill:var(--tv-Link-danger-disabled-text-color)}.tiny-link.tiny-link--danger.is-disabled g,.tiny-link.tiny-link--danger.is-disabled:hover g{color:var(--tv-Link-danger-disabled-text-color);fill:var(--tv-Link-danger-disabled-text-color)}.tiny-link.tiny-link--success{color:var(--tv-Link-success-text-color);fill:var(--tv-Link-success-text-color)}.tiny-link.tiny-link--success g{color:var(--tv-Link-success-text-color);fill:var(--tv-Link-success-text-color)}.tiny-link.tiny-link--success.is-underline:hover:after{border-color:var(--tv-Link-success-border-color)}.tiny-link.tiny-link--success:hover{text-decoration:none;color:var(--tv-Link-success-hover-text-color)}.tiny-link.tiny-link--success.is-disabled,.tiny-link.tiny-link--success.is-disabled:hover{color:var(--tv-Link-success-disabled-text-color);fill:var(--tv-Link-success-disabled-text-color)}.tiny-link.tiny-link--success.is-disabled g,.tiny-link.tiny-link--success.is-disabled:hover g{color:var(--tv-Link-success-disabled-text-color);fill:var(--tv-Link-success-disabled-text-color)}.tiny-link.tiny-link--warning{color:var(--tv-Link-warning-text-color);fill:var(--tv-Link-warning-text-color)}.tiny-link.tiny-link--warning g{color:var(--tv-Link-warning-text-color);fill:var(--tv-Link-warning-text-color)}.tiny-link.tiny-link--warning.is-underline:hover:after{border-color:var(--tv-Link-warning-border-color)}.tiny-link.tiny-link--warning:hover{text-decoration:none;color:var(--tv-Link-warning-hover-text-color)}.tiny-link.tiny-link--warning.is-disabled,.tiny-link.tiny-link--warning.is-disabled:hover{color:var(--tv-Link-warning-disabled-text-color);fill:var(--tv-Link-warning-disabled-text-color)}.tiny-link.tiny-link--warning.is-disabled g,.tiny-link.tiny-link--warning.is-disabled:hover g{color:var(--tv-Link-warning-disabled-text-color);fill:var(--tv-Link-warning-disabled-text-color)}.tiny-link.tiny-link--info{color:var(--tv-Link-info-text-color);fill:var(--tv-Link-info-text-color)}.tiny-link.tiny-link--info g{color:var(--tv-Link-info-text-color);fill:var(--tv-Link-info-text-color)}.tiny-link.tiny-link--info.is-underline:hover:after{border-color:var(--tv-Link-info-border-color)}.tiny-link.tiny-link--info:hover{text-decoration:none;color:var(--tv-Link-info-hover-text-color)}.tiny-link.tiny-link--info.is-disabled,.tiny-link.tiny-link--info.is-disabled:hover{color:var(--tv-Link-info-disabled-text-color);fill:var(--tv-Link-info-disabled-text-color)}.tiny-link.tiny-link--info.is-disabled g,.tiny-link.tiny-link--info.is-disabled:hover g{color:var(--tv-Link-info-disabled-text-color);fill:var(--tv-Link-info-disabled-text-color)}