陈誉午
994b267f5c
- 电子药箱: 药品库存管理 + 手动录入 + 今日用药打卡 - 药品百科: 搜索 + 分类筛选 + 20种药品静态数据 - 惠教中心: 4条药品使用指南课程 - 我的: 家庭成员信息管理 - 自定义TabBar + navigation-bar组件 - SVG药品分类插图
1 line
2.9 KiB
Plaintext
1 line
2.9 KiB
Plaintext
@keyframes keyframesHeartBeat{0%{transform:scale(1)}50%{transform:scale(1.05)}100%{transform:scale(1.05)}}@keyframes keyframesTada{0%,10%,20%{transform:rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{transform:rotate3d(0,0,1,3deg)}40%,60%,80%{transform:rotate3d(0,0,1,-3deg)}to{transform:scale3d(1,1,1)}}.rain,.trailerMask{position:fixed;z-index:11010;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5)}.countdown{position:absolute;z-index:1;text-align:center;font-size:calc(28rpx + .5 * (1rem - 16px));display:flex;width:100%;margin-top:100rpx;flex-direction:column;align-items:center;font-weight:600;line-height:calc(48rpx + .5 * (1rem - 16px));padding-bottom:20rpx}.countdown .text{color:#fff0b8;margin:0 20rpx}.countdown .count{color:#ffd48c;margin-top:16rpx;font-size:calc(72rpx + .5 * (1rem - 16px));font-weight:700}.hongBaoWrap{position:absolute;z-index:2;top:50%;left:50%;transform:translate3d(-50%,-50%,100px)}.hongBao{position:relative;background:url(https://p1-live.byteimg.com/tos-cn-i-gjr78lqtd0/5e9353a6aa3949ab81c1df809ce35031~tplv-gjr78lqtd0-image.image);background-repeat:no-repeat;background-size:contain;border-radius:16rpx;width:292rpx;height:430rpx;text-align:center;overflow:hidden}.hongBao.toda{animation-duration:1s;animation-fill-mode:both;animation-iteration-count:infinite;animation-name:keyframesTada}.hongBao.active{animation-duration:.1s;animation-fill-mode:both;animation-name:keyframesHeartBeat}.hongBao .content{position:absolute;z-index:2;left:0;text-align:center;width:100%;padding-top:40rpx}.hongBao .content .title{color:#fff0cd;font-size:calc(28rpx + .5 * (1rem - 16px));line-height:calc(48rpx + .5 * (1rem - 16px));font-weight:800}.hongBao .content .count{margin-top:8rpx;color:#ffd977;font-family:'DIN Alternate';font-weight:700;font-size:calc(48rpx + .5 * (1rem - 16px));line-height:calc(56rpx + .5 * (1rem - 16px));animation-duration:.5s;animation-fill-mode:both}.hongBao .btn{user-select:none;cursor:pointer;display:block;width:112rpx;height:calc(112rpx + .5 * (1rem - 16px));font-size:calc(48rpx + .5 * (1rem - 16px));line-height:calc(112rpx + .5 * (1rem - 16px));color:#d1632c;font-weight:800;border-radius:50%;position:absolute;z-index:1;bottom:120rpx;left:50%;transform:translateX(-50%);background-color:#ffe69f}.hongBao .btn .border{position:absolute;z-index:1;top:4rpx;left:4rpx;width:104rpx;height:104rpx;border:2rpx solid #ffb800;box-sizing:border-box;border-radius:50%}.trailer{width:600rpx;height:925rpx;position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;background-image:url(https://p3-live.byteimg.com/tos-cn-i-gjr78lqtd0/rain-trailer-2x~tplv-gjr78lqtd0-png.png);background-repeat:no-repeat;background-size:contain}.trailer .count{display:inline-block;font-size:calc(100rpx + .5 * (1rem - 16px));font-weight:700;margin-top:500rpx;color:#ff7300;animation-duration:1s;animation-fill-mode:both}.rain-canvas{width:100%;height:100%;background-color:transparent;pointer-events:none} |