UNPKG

tdesign-mobile-vue

Version:
375 lines (374 loc) 9.13 kB
.t-float-left { float: left; } .t-float-right { float: right; } @-webkit-keyframes t-spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes t-spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes t-fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes t-fade-in { from { opacity: 0; } to { opacity: 1; } } @-webkit-keyframes t-fade-out { from { opacity: 1; } to { opacity: 0; } } @keyframes t-fade-out { from { opacity: 1; } to { opacity: 0; } } @-webkit-keyframes t-slide-top-in { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes t-slide-top-in { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes t-slide-top-out { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes t-slide-top-out { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @-webkit-keyframes t-slide-bottom-in { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes t-slide-bottom-in { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes t-slide-bottom-out { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes t-slide-bottom-out { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @-webkit-keyframes t-slide-right-in { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes t-slide-right-in { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes t-slide-right-out { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes t-slide-right-out { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @-webkit-keyframes t-slide-left-in { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes t-slide-left-in { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes t-slide-left-out { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes t-slide-left-out { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @-webkit-keyframes t-fade-zoom-in { 0% { opacity: 0; -webkit-transform: translate(-50%, -50%) scale(0.6); transform: translate(-50%, -50%) scale(0.6); } 100% { opacity: 1; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } } @keyframes t-fade-zoom-in { 0% { opacity: 0; -webkit-transform: translate(-50%, -50%) scale(0.6); transform: translate(-50%, -50%) scale(0.6); } 100% { opacity: 1; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } } @-webkit-keyframes t-fade-zoom-out { 0% { opacity: 1; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } 100% { opacity: 0; -webkit-transform: translate(-50%, -50%) scale(0.6); transform: translate(-50%, -50%) scale(0.6); } } @keyframes t-fade-zoom-out { 0% { opacity: 1; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } 100% { opacity: 0; -webkit-transform: translate(-50%, -50%) scale(0.6); transform: translate(-50%, -50%) scale(0.6); } } @keyframes t-spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .t-icon-loading { -webkit-animation: t-spin 1s linear infinite; animation: t-spin 1s linear infinite; } .hotspot-expanded.relative { position: relative; } .hotspot-expanded::after { content: ""; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; -webkit-transform: scale(1.5); transform: scale(1.5); } .t-notice-bar { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 13px 16px; font-size: var(--td-font-size-base, 14px); } .t-notice-bar__content-wrap { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; overflow-x: hidden; line-height: 22px; color: var(--td-notice-bar-font-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)))); } .t-notice-bar__content { display: inline-block; white-space: nowrap; } .t-notice-bar__content-wrapable { white-space: normal; } .t-notice-bar__content--vertical { --td-swiper-border-radius: 0; height: 22px; line-height: 22px; } .t-notice-bar__content--vertical-item { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .t-notice-bar__prefix-icon { color: inherit; } .t-notice-bar__prefix-icon:not(:empty) { display: inherit; padding-right: var(--td-spacer, 8px); } .t-notice-bar__suffix-icon { color: var(--td-notice-bar-suffix-icon-color, var(--td-text-color-placeholder, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)))); } .t-notice-bar__prefix-icon, .t-notice-bar__suffix-icon { font-size: 22px; } .t-notice-bar__operation { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; vertical-align: top; color: var(--td-notice-bar-operation-font-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9))); font-weight: 700; } .t-notice-bar__operation:empty { display: none; } .t-notice-bar__suffix-icon:not(:empty) { display: inherit; padding-left: var(--td-spacer, 8px); } .t-notice-bar--info { color: var(--td-notice-bar-info-color, var(--td-brand-color, var(--td-brand-color-7, #0052d9))); background-color: var(--td-notice-bar-info-bg-color, var(--td-brand-color-light, var(--td-brand-color-1, #f2f3ff))); } .t-notice-bar--success { color: var(--td-notice-bar-success-color, var(--td-success-color, var(--td-success-color-5, #2ba471))); background-color: var(--td-notice-bar-success-bg-color, var(--td-success-color-1, #e3f9e9)); } .t-notice-bar--warning { color: var(--td-notice-bar-warning-color, var(--td-warning-color, var(--td-warning-color-5, #e37318))); background-color: var(--td-notice-bar-warning-bg-color, var(--td-warning-color-1, #fff1e9)); } .t-notice-bar--error { color: var(--td-notice-bar-error-color, var(--td-error-color-6, #d54941)); background-color: var(--td-notice-bar-error-bg-color, var(--td-error-color-1, #fff0ed)); }