Files
xhs-examples/xhs-mini-demos/component-case/image/image.skeleton.css
2025-09-14 00:21:54 +08:00

11 lines
8.6 KiB
CSS

.skeleton-text-block-mark, .skeleton-text-block-mark * { background-origin: content-box; background-clip: content-box; background-repeat: repeat-y; background-color: transparent !important; color: transparent !important; }.sk-pseudo::before, .sk-pseudo::after { background: none rgb(238, 238, 238) !important; color: transparent !important; border-color: transparent !important; border-radius: 0px !important; }.sk-button { box-shadow: none !important; }.sk-transparent::before, .sk-transparent::after { opacity: 0 !important; }.sk-animation-shine-2 { background: linear-gradient(90deg, rgba(0, 0, 0, 0.06) 20%, rgba(0, 0, 0, 0.15) 37%, rgba(0, 0, 0, 0.06) 63%) 0% 0% / 400% 100%; animation-name: sk-shine-2; animation-duration: 1.4s; animation-timing-function: ease; animation-iteration-count: infinite; }@keyframes sk-shine-2 {
0% { background-position: 100% 50%; }
100% { background-position: 0px 50%; }
}
html { width: 100%; height: 100%; }body { margin: 0px; width: 100%; height: 100%; scroll-behavior: smooth; overflow-x: hidden; }* { text-size-adjust: none; }.xhs_inner-loading { height: 60px; margin-top: -60px; text-align: center; transition: height 0.25s ease 0s, border-bottom-width 0.25s ease 0s; background-color: rgb(238, 238, 238); font-size: 14px; overflow: hidden; line-height: 60px !important; }xhs-page { min-width: 100vw; min-height: 100vh; display: block; }#xhs_inner_app { height: 100%; }
xhs-template { display: none; width: 0px; height: 0px; }
xhs-view { display: block; }xhs-video { display: inline-block; width: 100%; height: 100%; }.xgplayer div.gradient { background-image: none; }.xgplayer-mobile xg-controls.xgplayer-controls { background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.75)); }.xgplayer .flex-controls xg-inner-controls.xg-inner-controls { bottom: 4px; }.xhs-ios-native-input { overflow: scroll; position: absolute; inset: 0px; }xhs-input { position: relative; cursor: auto; display: block; height: 22px; text-overflow: clip; overflow: hidden; white-space: nowrap; margin: 0px; }xhs-input .web-input { position: relative; min-height: 22px; text-overflow: inherit; border: none; font-size: inherit; font-weight: inherit; color: inherit; padding: 0px; margin: 0px; outline: none; text-align: inherit; -webkit-tap-highlight-color: transparent; }xhs-input .web-input div { position: absolute; inset: 0px; margin: auto; min-height: 22px; white-space: pre; text-align: inherit; overflow: hidden; vertical-align: middle; }xhs-input input { position: relative; border: none; height: inherit; width: 100%; font-size: inherit; font-weight: inherit; color: inherit; background: transparent; display: inherit; padding: 0px; margin: 0px; outline: none; vertical-align: middle; text-align: inherit; overflow: inherit; white-space: inherit; text-overflow: inherit; -webkit-tap-highlight-color: transparent; z-index: 1; }.xhs-inner-input-placeholder { color: rgb(153, 153, 153); }xhs-map { display: block; position: relative; }xhs-map .tmap-scale-text { display: var(--map-showScale, block); }xhs-map .tmap-scale-line { display: var(--map-showScale, block); }xhs-map .rotate-circle { display: var(--map-showCompass, block); }xhs-map img { display: inline; }xhs-map .logo-text { display: none; }xhs-map a[target="_blank"] { display: none; }xhs-map .tmap-zoom-control { display: none; }xhs-map > * { z-index: 1099; position: absolute !important; }xhs-camera { display: block; position: relative; }.xhs-i-n-c { overflow: scroll; position: absolute; inset: 0px; }
::-webkit-scrollbar { width: 1px; }::-webkit-scrollbar-track { background: rgb(241, 241, 241); }::-webkit-scrollbar-thumb { background: rgb(136, 136, 136); }
.xhs_0__ma2 { margin: 4px; }.xhs_0__mx2 { margin: 0px 4px; }.xhs_0__my2 { margin: 4px 0px; }.xhs_0__mt2 { margin-top: 4px; }.xhs_0__mb2 { margin-bottom: 4px; }.xhs_0__ml2 { margin-left: 4px; }.xhs_0__mr2 { margin-right: 4px; }.xhs_0__pa2 { padding: 4px; }.xhs_0__px2 { padding: 0px 4px; }.xhs_0__py2 { padding: 4px 0px; }.xhs_0__pt2 { padding-top: 4px; }.xhs_0__pb2 { padding-bottom: 4px; }.xhs_0__pl2 { padding-left: 4px; }.xhs_0__pr2 { padding-right: 4px; }.xhs_0__ma4 { margin: 8px; }.xhs_0__mx4 { margin: 0px 8px; }.xhs_0__my4 { margin: 8px 0px; }.xhs_0__mt4 { margin-top: 8px; }.xhs_0__mb4 { margin-bottom: 8px; }.xhs_0__ml4 { margin-left: 8px; }.xhs_0__mr4 { margin-right: 8px; }.xhs_0__pa4 { padding: 8px; }.xhs_0__px4 { padding: 0px 8px; }.xhs_0__py4 { padding: 8px 0px; }.xhs_0__pt4 { padding-top: 8px; }.xhs_0__pb4 { padding-bottom: 8px; }.xhs_0__pl4 { padding-left: 8px; }.xhs_0__pr4 { padding-right: 8px; }.xhs_0__ma6 { margin: 12px; }.xhs_0__mx6 { margin: 0px 12px; }.xhs_0__my6 { margin: 12px 0px; }.xhs_0__mt6 { margin-top: 12px; }.xhs_0__mb6 { margin-bottom: 12px; }.xhs_0__ml6 { margin-left: 12px; }.xhs_0__mr6 { margin-right: 12px; }.xhs_0__pa6 { padding: 12px; }.xhs_0__px6 { padding: 0px 12px; }.xhs_0__py6 { padding: 12px 0px; }.xhs_0__pt6 { padding-top: 12px; }.xhs_0__pb6 { padding-bottom: 12px; }.xhs_0__pl6 { padding-left: 12px; }.xhs_0__pr6 { padding-right: 12px; }.xhs_0__ma8 { margin: 16px; }.xhs_0__mx8 { margin: 0px 16px; }.xhs_0__my8 { margin: 16px 0px; }.xhs_0__mt8 { margin-top: 16px; }.xhs_0__mb8 { margin-bottom: 16px; }.xhs_0__ml8 { margin-left: 16px; }.xhs_0__mr8 { margin-right: 16px; }.xhs_0__pa8 { padding: 16px; }.xhs_0__px8 { padding: 0px 16px; }.xhs_0__py8 { padding: 16px 0px; }.xhs_0__pt8 { padding-top: 16px; }.xhs_0__pb8 { padding-bottom: 16px; }.xhs_0__pl8 { padding-left: 16px; }.xhs_0__pr8 { padding-right: 16px; }.xhs_0__ma10 { margin: 20px; }.xhs_0__mx10 { margin: 0px 20px; }.xhs_0__my10 { margin: 20px 0px; }.xhs_0__mt10 { margin-top: 20px; }.xhs_0__mb10 { margin-bottom: 20px; }.xhs_0__ml10 { margin-left: 20px; }.xhs_0__mr10 { margin-right: 20px; }.xhs_0__pa10 { padding: 20px; }.xhs_0__px10 { padding: 0px 20px; }.xhs_0__py10 { padding: 20px 0px; }.xhs_0__pt10 { padding-top: 20px; }.xhs_0__pb10 { padding-bottom: 20px; }.xhs_0__pl10 { padding-left: 20px; }.xhs_0__pr10 { padding-right: 20px; }.xhs_0__ui-input { background-color: rgba(51, 51, 51, 0.024); border-radius: 18px; padding: 9px 16px; }.xhs_0__ui-textarea { background-color: rgba(0, 0, 0, 0.04); border-radius: 8px; padding: 14px 12px; }.xhs_0__ui-button { background-color: rgb(255, 36, 66); color: white; }.xhs_0__ui-button-hover { background-color: rgba(255, 36, 66, 0.7); color: white; }.xhs_0__ui-button-hover::after { border: none; }xhs-picker { border: 1px solid rgb(238, 238, 238); border-radius: 5px; }xhs-button { height: 40px; border-radius: 1000px; font-size: 16px; font-weight: 500; line-height: 40px; }xhs-button::after { border: none; }.xhs_0_button-hover::after { border: none; }xhs-textarea { padding: 0px; }.xhs_0_xhs-inner-switch-control-switch::after { background-color: aqua; }xhs-picker { border: none; }xhs-radio * { display: flex; }xhs-checkbox * { display: flex; }xhs-slider > div > div > div > div:nth-child(2) { width: 16px !important; height: 16px !important; margin-top: -8px !important; margin-left: -8px !important; }:root { --xhs-theme-color: red; }.xhs_0__cred { color: var(--xhs-theme-color); }.xhs_0__bcred { background-color: var(--xhs-theme-color); color: white; }.xhs_0__dflex { display: flex; }.xhs_0__fd_column { flex-direction: column; }.xhs_0__jc_space-around { justify-content: space-around; }.xhs_0__jc_center { justify-content: center; }.xhs_0__jc_space-between { justify-content: space-between; }.xhs_0__ai_center { align-items: center; }.xhs_0__flex_1 { flex: 1 1 0%; }.xhs_0__text_wrap { word-break: break-all; }.xhs_0__end_split { position: relative; border: 0px; }.xhs_0__end_split::after { content: ""; position: absolute; bottom: 0px; height: 1px; background: rgb(235, 235, 235); left: 0px; right: 0px; }.xhs_0__ui-space > * { margin-bottom: 20px; }.xhs_0__ui-space > :last-child { margin-bottom: 0px; }* { box-sizing: border-box; margin: 0px; padding: 0px; }html, body { height: 100%; font-family: -apple-system-font, "Helvetica Neue", Helvetica, sans-serif; font-size: 100px; color: rgb(51, 51, 51); }.xhs_0_container { font-size: 0.14rem; overflow: hidden; }
.xhs_0_page-section-ctn { text-align: center; }.xhs_0_image { margin-top: 15px; width: 345px; height: 225px; }.xhs_0_test { border-radius: 10px; }
.xhs_1_xhs-demo-card { margin: 10px; background-color: white; border-radius: 12px; overflow: hidden; }.xhs_1_xhs-demo-card-title { margin: 0px 16px; padding: 15px 0px; font-size: 14px; font-weight: 500; line-height: 18px; }.xhs_1_xhs-demo-card-content { background-color: rgb(255, 255, 255); }.xhs_1_xhs-demo-card-spiver { position: relative; border: 0px; }.xhs_1_xhs-demo-card-spiver::after { content: ""; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 1px; background: rgb(239, 239, 239); transform-origin: 0px 100%; }