129 lines
2.5 KiB
Plaintext
129 lines
2.5 KiB
Plaintext
|
|
.fab-box.data-v-308565d7 {
|
|
position: fixed;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
z-index: 2;
|
|
}
|
|
.fab-box.top.data-v-308565d7 {
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
right: 30rpx;
|
|
bottom: 60rpx;
|
|
border: 1px #5989b9 solid;
|
|
background: #6699cc;
|
|
border-radius: 10rpx;
|
|
color: #fff;
|
|
transition: all 0.3;
|
|
opacity: 0;
|
|
}
|
|
.fab-box.active.data-v-308565d7 {
|
|
opacity: 1;
|
|
}
|
|
.fab-box.fab.data-v-308565d7 {
|
|
z-index: 10;
|
|
}
|
|
.fab-box.fab.leftBottom.data-v-308565d7 {
|
|
left: 30rpx;
|
|
bottom: 60rpx;
|
|
}
|
|
.fab-box.fab.leftTop.data-v-308565d7 {
|
|
left: 30rpx;
|
|
top: 80rpx;
|
|
}
|
|
.fab-box.fab.rightBottom.data-v-308565d7 {
|
|
right: 30rpx;
|
|
bottom: 190rpx;
|
|
}
|
|
.fab-box.fab.rightTop.data-v-308565d7 {
|
|
right: 30rpx;
|
|
top: 80rpx;
|
|
}
|
|
.fab-circle.data-v-308565d7 {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
position: absolute;
|
|
width: 85rpx;
|
|
height: 85rpx;
|
|
background: #3c3e49;
|
|
/* background: #5989b9; */
|
|
border-radius: 50%;
|
|
box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.2);
|
|
z-index: 11;
|
|
}
|
|
.fab-circle.left.data-v-308565d7 {
|
|
left: 0;
|
|
}
|
|
.fab-circle.right.data-v-308565d7 {
|
|
right: 0;
|
|
}
|
|
.fab-circle.top.data-v-308565d7 {
|
|
top: 0;
|
|
}
|
|
.fab-circle.bottom.data-v-308565d7 {
|
|
bottom: 0;
|
|
}
|
|
.fab-circle .icontop.data-v-308565d7 {
|
|
color: #ffffff;
|
|
font-size: 50rpx;
|
|
transition: all 0.3s;
|
|
}
|
|
.fab-circle .icontop.active.data-v-308565d7 {
|
|
-webkit-transform: rotate(180deg);
|
|
transform: rotate(180deg);
|
|
}
|
|
.fab-content.data-v-308565d7 {
|
|
background: #6699cc;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
border-radius: 100rpx;
|
|
overflow: hidden;
|
|
box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1);
|
|
transition: all 0.2s;
|
|
width: 85rpx;
|
|
}
|
|
.fab-content.left.data-v-308565d7 {
|
|
justify-content: flex-start;
|
|
}
|
|
.fab-content.right.data-v-308565d7 {
|
|
justify-content: flex-end;
|
|
}
|
|
.fab-content.flexDirection.data-v-308565d7 {
|
|
flex-direction: column;
|
|
justify-content: flex-end;
|
|
}
|
|
.fab-content.flexDirectionStart.data-v-308565d7 {
|
|
flex-direction: column;
|
|
justify-content: flex-start;
|
|
}
|
|
.fab-content.flexDirectionEnd.data-v-308565d7 {
|
|
flex-direction: column;
|
|
justify-content: flex-end;
|
|
}
|
|
.fab-content .fab-item.data-v-308565d7 {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 85rpx;
|
|
height: 85rpx;
|
|
font-size: 22rpx;
|
|
color: #fff;
|
|
opacity: 0;
|
|
transition: opacity 0.2s;
|
|
}
|
|
.fab-content .fab-item.active.data-v-308565d7 {
|
|
opacity: 1;
|
|
}
|
|
.fab-content .fab-item .content-image.data-v-308565d7 {
|
|
width: 45rpx;
|
|
height: 45rpx;
|
|
margin-bottom: 5rpx;
|
|
}
|
|
.fab-content .fab-item.first.data-v-308565d7 {
|
|
width: 85rpx;
|
|
}
|
|
|