UNPKG

react-cqtoolbox

Version:

[![Travis][build-badge]][build] [![npm package][npm-badge]][npm] [![Coveralls][coveralls-badge]][coveralls]

123 lines (101 loc) 2.46 kB
.tabs { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; box-sizing: border-box; font-family: Microsoft Yahei,Helvetica Neue,\\5B8B\4F53,Helvetica,Arial,sans-serif; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; } .tabs *, .tabs *::after, .tabs *::before { box-sizing: border-box; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; -webkit-touch-callout: none; } .label { font-size: 14px; font-weight: 500; line-height: 1; position: relative; padding: 17px 12px; -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); -webkit-transition-duration: 0.35s; transition-duration: 0.35s; -webkit-transition-property: box-shadow, color; transition-property: box-shadow, color; color: rgba(0, 0, 0, 0.7) } .label > .rippleWrapper { overflow: hidden; } .label.active { color: rgb(0, 0, 0); } .label.disabled { opacity: 0.2; } .label:not(.disabled) { cursor: pointer; } .label.hidden { display: none; } .tab { padding: 17px 12px; outline: none } .tab:not(.active) { display: none; } .tab.active { display: block; } .navigation { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; overflow-x: hidden; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; box-shadow: inset 0 -1px rgb(238, 238, 238); } .navigationContainer { display: -webkit-box; display: -ms-flexbox; display: flex } .navigationContainer .navigation { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .pointer { position: absolute; width: 0; height: 2px; margin-top: -2px; -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); -webkit-transition-duration: 0.35s; transition-duration: 0.35s; -webkit-transition-property: left, width; transition-property: left, width; background-color: rgb(0, 188, 212); }