gengx
This commit is contained in:
+1
-153
@@ -1,153 +1 @@
|
||||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.sugar-tree-graphic.data-v-d91cb5e7 {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.size-sm.data-v-d91cb5e7 {
|
||||
width: 64rpx;
|
||||
height: 72rpx;
|
||||
}
|
||||
.size-md.data-v-d91cb5e7 {
|
||||
width: 80rpx;
|
||||
height: 88rpx;
|
||||
}
|
||||
.size-lg.data-v-d91cb5e7 {
|
||||
width: 112rpx;
|
||||
height: 124rpx;
|
||||
}
|
||||
.stg-glow.data-v-d91cb5e7 {
|
||||
position: absolute;
|
||||
inset: 6%;
|
||||
border-radius: 50%;
|
||||
background: radial-gradient(circle, rgba(32, 78, 43, 0.22) 0%, transparent 68%);
|
||||
pointer-events: none;
|
||||
}
|
||||
.lv-0 .stg-glow.data-v-d91cb5e7 {
|
||||
background: radial-gradient(circle, rgba(148, 163, 184, 0.25) 0%, transparent 70%);
|
||||
}
|
||||
.tier-4 .stg-glow.data-v-d91cb5e7,
|
||||
.tier-5 .stg-glow.data-v-d91cb5e7,
|
||||
.is-max .stg-glow.data-v-d91cb5e7 {
|
||||
background: radial-gradient(circle, rgba(251, 191, 36, 0.3) 0%, rgba(32, 78, 43, 0.15) 55%, transparent 72%);
|
||||
}
|
||||
.stg-aura.data-v-d91cb5e7 {
|
||||
position: absolute;
|
||||
inset: -8%;
|
||||
border-radius: 50%;
|
||||
border: 2rpx solid rgba(253, 224, 71, 0.35);
|
||||
animation: stg-aura-pulse-d91cb5e7 2.4s ease-in-out infinite;
|
||||
pointer-events: none;
|
||||
}
|
||||
@keyframes stg-aura-pulse-d91cb5e7 {
|
||||
0%, 100% {
|
||||
transform: scale(0.92);
|
||||
opacity: 0.5;
|
||||
}
|
||||
50% {
|
||||
transform: scale(1.05);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
.stg-image.data-v-d91cb5e7 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
transition: transform 0.35s ease;
|
||||
}
|
||||
.sugar-tree-graphic.watering .stg-image.data-v-d91cb5e7,
|
||||
.sugar-tree-graphic.watering .stg-emoji.data-v-d91cb5e7 {
|
||||
animation: stg-water-bounce-d91cb5e7 0.65s ease;
|
||||
}
|
||||
.stg-emoji.data-v-d91cb5e7 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
line-height: 1;
|
||||
font-size: 72rpx;
|
||||
}
|
||||
.size-sm .stg-emoji.data-v-d91cb5e7 {
|
||||
font-size: 48rpx;
|
||||
}
|
||||
.size-md .stg-emoji.data-v-d91cb5e7 {
|
||||
font-size: 60rpx;
|
||||
}
|
||||
.size-lg .stg-emoji.data-v-d91cb5e7 {
|
||||
font-size: 88rpx;
|
||||
}
|
||||
@keyframes stg-water-bounce-d91cb5e7 {
|
||||
0%, 100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
35% {
|
||||
transform: scale(1.1) translateY(-6rpx);
|
||||
}
|
||||
60% {
|
||||
transform: scale(0.96) translateY(2rpx);
|
||||
}
|
||||
}
|
||||
.stg-sparkle.data-v-d91cb5e7 {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
border-radius: 50%;
|
||||
background: #fde68a;
|
||||
box-shadow: 0 0 6rpx rgba(253, 224, 71, 0.8);
|
||||
pointer-events: none;
|
||||
animation: stg-sparkle-twinkle-d91cb5e7 1.8s ease-in-out infinite;
|
||||
}
|
||||
.stg-sparkle-a.data-v-d91cb5e7 {
|
||||
top: 4%;
|
||||
right: 16%;
|
||||
}
|
||||
.stg-sparkle-b.data-v-d91cb5e7 {
|
||||
top: 12%;
|
||||
left: 10%;
|
||||
width: 6rpx;
|
||||
height: 6rpx;
|
||||
animation-delay: 0.4s;
|
||||
}
|
||||
.stg-sparkle-c.data-v-d91cb5e7 {
|
||||
top: 22%;
|
||||
right: 28%;
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
animation-delay: 0.8s;
|
||||
}
|
||||
@keyframes stg-sparkle-twinkle-d91cb5e7 {
|
||||
0%, 100% {
|
||||
opacity: 0.4;
|
||||
transform: scale(0.8);
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
transform: scale(1.2);
|
||||
}
|
||||
}
|
||||
.sugar-tree-graphic.data-v-d91cb5e7{position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.size-sm.data-v-d91cb5e7{width:64rpx;height:72rpx}.size-md.data-v-d91cb5e7{width:80rpx;height:88rpx}.size-lg.data-v-d91cb5e7{width:112rpx;height:124rpx}.stg-glow.data-v-d91cb5e7{position:absolute;top:6%;right:6%;bottom:6%;left:6%;border-radius:50%;background:radial-gradient(circle,rgba(32,78,43,.22) 0%,transparent 68%);pointer-events:none}.lv-0 .stg-glow.data-v-d91cb5e7{background:radial-gradient(circle,rgba(148,163,184,.25) 0%,transparent 70%)}.tier-4 .stg-glow.data-v-d91cb5e7,.tier-5 .stg-glow.data-v-d91cb5e7,.is-max .stg-glow.data-v-d91cb5e7{background:radial-gradient(circle,rgba(251,191,36,.3) 0%,rgba(32,78,43,.15) 55%,transparent 72%)}.stg-aura.data-v-d91cb5e7{position:absolute;top:-8%;right:-8%;bottom:-8%;left:-8%;border-radius:50%;border:2rpx solid rgba(253,224,71,.35);animation:stg-aura-pulse-d91cb5e7 2.4s ease-in-out infinite;pointer-events:none}@keyframes stg-aura-pulse-d91cb5e7{0%,to{transform:scale(.92);opacity:.5}50%{transform:scale(1.05);opacity:1}}.stg-image.data-v-d91cb5e7{position:relative;z-index:1;width:100%;height:100%;transition:transform .35s ease}.sugar-tree-graphic.watering .stg-image.data-v-d91cb5e7,.sugar-tree-graphic.watering .stg-emoji.data-v-d91cb5e7{animation:stg-water-bounce-d91cb5e7 .65s ease}.stg-emoji.data-v-d91cb5e7{position:relative;z-index:1;line-height:1;font-size:72rpx}.size-sm .stg-emoji.data-v-d91cb5e7{font-size:48rpx}.size-md .stg-emoji.data-v-d91cb5e7{font-size:60rpx}.size-lg .stg-emoji.data-v-d91cb5e7{font-size:88rpx}@keyframes stg-water-bounce-d91cb5e7{0%,to{transform:scale(1)}35%{transform:scale(1.1) translateY(-6rpx)}60%{transform:scale(.96) translateY(2rpx)}}.stg-sparkle.data-v-d91cb5e7{position:absolute;z-index:2;width:8rpx;height:8rpx;border-radius:50%;background:#fde68a;box-shadow:0 0 6rpx rgba(253,224,71,.8);pointer-events:none;animation:stg-sparkle-twinkle-d91cb5e7 1.8s ease-in-out infinite}.stg-sparkle-a.data-v-d91cb5e7{top:4%;right:16%}.stg-sparkle-b.data-v-d91cb5e7{top:12%;left:10%;width:6rpx;height:6rpx;animation-delay:.4s}.stg-sparkle-c.data-v-d91cb5e7{top:22%;right:28%;width:10rpx;height:10rpx;animation-delay:.8s}@keyframes stg-sparkle-twinkle-d91cb5e7{0%,to{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}
|
||||
Reference in New Issue
Block a user