| | |
|---|
| | | .t-float-left { |
|---|
| | | float: left; |
|---|
| | | } |
|---|
| | | .t-float-right { |
|---|
| | | float: right; |
|---|
| | | } |
|---|
| | | @keyframes tdesign-fade-out { |
|---|
| | | from { |
|---|
| | | opacity: 1; |
|---|
| | | } |
|---|
| | | to { |
|---|
| | | opacity: 0; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .hotspot-expanded.relative { |
|---|
| | | position: relative; |
|---|
| | | } |
|---|
| | | .hotspot-expanded::after { |
|---|
| | | content: ''; |
|---|
| | | display: block; |
|---|
| | | position: absolute; |
|---|
| | | left: 0; |
|---|
| | | top: 0; |
|---|
| | | right: 0; |
|---|
| | | bottom: 0; |
|---|
| | | transform: scale(1.5); |
|---|
| | | } |
|---|
| | | .t-indexes { |
|---|
| | | position: relative; |
|---|
| | | height: 100vh; |
|---|
| | | } |
|---|
| | | .t-indexes__sidebar { |
|---|
| | | position: fixed; |
|---|
| | | right: var(--td-indexes-sidebar-right, 16rpx); |
|---|
| | | width: var(--td-indexes-sidebar-item-size, 40rpx); |
|---|
| | | color: var(--td-indexes-sidebar-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))); |
|---|
| | | font-size: var(--td-indexes-sidebar-font-size, 24rpx); |
|---|
| | | line-height: var(--td-indexes-sidebar-line-height, 40rpx); |
|---|
| | | display: flex; |
|---|
| | | flex-flow: column nowrap; |
|---|
| | | top: 50%; |
|---|
| | | transform: translateY(-50%); |
|---|
| | | z-index: 1; |
|---|
| | | } |
|---|
| | | .t-indexes__sidebar-item { |
|---|
| | | border-radius: 50%; |
|---|
| | | position: relative; |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | .t-indexes__sidebar-item--active { |
|---|
| | | background-color: var(--td-indexes-sidebar-active-bg-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9))); |
|---|
| | | color: var(--td-indexes-sidebar-active-color, var(--td-font-white-1, #ffffff)); |
|---|
| | | } |
|---|
| | | .t-indexes__sidebar-item + .t-indexes__sidebar-item { |
|---|
| | | margin-top: 4rpx; |
|---|
| | | } |
|---|
| | | .t-indexes__sidebar-tips { |
|---|
| | | width: var(--td-indexes-sidebar-tips-size, 96rpx); |
|---|
| | | height: var(--td-indexes-sidebar-tips-size, 96rpx); |
|---|
| | | line-height: var(--td-indexes-sidebar-tips-size, 96rpx); |
|---|
| | | text-align: center; |
|---|
| | | font-size: var(--td-indexes-sidebar-tips-font-size, 40rpx); |
|---|
| | | font-weight: 700; |
|---|
| | | color: var(--td-indexes-sidebar-tips-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9))); |
|---|
| | | background-color: var(--td-indexes-sidebar-tips-bg-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff))); |
|---|
| | | border-radius: 50%; |
|---|
| | | position: absolute; |
|---|
| | | top: 50%; |
|---|
| | | bottom: 0; |
|---|
| | | transform: translateY(-50%); |
|---|
| | | right: var(--td-indexes-sidebar-tips-right, 76rpx); |
|---|
| | | } |
|---|
| | | @import '../common/style/index.wxss';.t-indexes{position:relative;height:100vh;} |
|---|
| | | .t-indexes__sidebar{position:fixed;right:var(--td-indexes-sidebar-right,16rpx);width:var(--td-indexes-sidebar-item-size,40rpx);color:var(--td-indexes-sidebar-color,var(--td-text-color-primary,var(--td-font-gray-1,rgba(0,0,0,.9))));font-size:var(--td-indexes-sidebar-font-size,24rpx);line-height:var(--td-indexes-sidebar-line-height,40rpx);display:flex;flex-flow:column nowrap;top:50%;transform:translateY(-50%);z-index:1;} |
|---|
| | | .t-indexes__sidebar-item{border-radius:50%;position:relative;text-align:center;} |
|---|
| | | .t-indexes__sidebar-item--active{background-color:var(--td-indexes-sidebar-active-bg-color,var(--td-brand-color,var(--td-primary-color-7,#0052d9)));color:var(--td-indexes-sidebar-active-color,var(--td-text-color-anti,var(--td-font-white-1,#fff)));} |
|---|
| | | .t-indexes__sidebar-item+.t-indexes__sidebar-item{margin-top:4rpx;} |
|---|
| | | .t-indexes__sidebar-tips{min-width:var(--td-indexes-sidebar-tips-size,96rpx);max-width:198rpx;padding:0 32rpx;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:var(--td-indexes-sidebar-tips-size,96rpx);line-height:var(--td-indexes-sidebar-tips-size,96rpx);text-align:center;font-size:var(--td-indexes-sidebar-tips-font-size,40rpx);font-weight:700;color:var(--td-indexes-sidebar-tips-color,var(--td-brand-color,var(--td-primary-color-7,#0052d9)));background-color:var(--td-indexes-sidebar-tips-bg-color,var(--td-brand-color-light,var(--td-primary-color-1,#f2f3ff)));border-radius:var(--td-indexes-sidebar-tips-size,96rpx);position:absolute;top:50%;bottom:0;transform:translateY(-50%);right:var(--td-indexes-sidebar-tips-right,calc(100% + 32rpx));} |
|---|
