luckysheet-zoom.css
4.87 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
.luckysheet-zoom-content{
position: relative;
float: right;
width:210px;
/* right: 0px; */
height: 22px;
line-height: 22px;
text-align: right;
padding-right: 10px;
white-space: nowrap;
overflow: hidden;
display: flex;
align-items: center;
user-select: none;
}
.luckysheet-zoom-content .luckysheet-zoom-minus{
position: absolute;
top: 0;
left: 0px;
width: 20px;
height:20px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.luckysheet-zoom-content .luckysheet-zoom-minus-icon{
background-image:url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTRweCIgaGVpZ2h0PSIycHgiIHZpZXdCb3g9IjAgMCAxNCAyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA2MyAoOTI0NDUpIC0gaHR0cHM6Ly9za2V0Y2guY29tIC0tPgogICAgPHRpdGxlPnJpcWlxdWppYW7lpIfku70gNDU8L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZyBpZD0iMjAyMC8wOC8xNCIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IueUu+adv+Wkh+S7vS0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTcwNC4wMDAwMDAsIC0xMDY0LjAwMDAwMCkiIGZpbGw9IiM0NDRENUEiPgogICAgICAgICAgICA8ZyBpZD0icmlxaXF1amlhbuWkh+S7vS0xMjYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2OTkuMDAwMDAwLCAxMDUzLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPGcgaWQ9Iue8lue7hCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNS4wMDAwMDAsIDExLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSLnn6nlvaIiIHg9IjAiIHk9IjAiIHdpZHRoPSIxNCIgaGVpZ2h0PSIyIj48L3JlY3Q+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==');
width: 14px;
height: 2px;
}
.luckysheet-zoom-content .luckysheet-zoom-minus:hover{
background-color: #E1E4E8;
}
.luckysheet-zoom-content .luckysheet-zoom-slider{
position: absolute;
top: 0;
left: 25px;
width: 100px;
height: 100%;
display: flex;
align-items: center;
}
.luckysheet-zoom-content .luckysheet-zoom-slider .luckysheet-zoom-line{
position: absolute;
top: 10px;
width: 100px;
height: 2px;
background: #E1E4E8;
}
.luckysheet-zoom-content .luckysheet-zoom-slider .luckysheet-zoom-cursor{
position: absolute;
top: 7px;
width: 8px;
height: 8px;
border-radius: 8px;
background: #B5BDB8;
cursor: pointer;
z-index: 2;
transition: all 0.3s;
}
.luckysheet-zoom-content .luckysheet-zoom-slider .luckysheet-zoom-cursor:hover{
transform: scale(1.2);
transform-origin: center center;
background: rgb(160, 160, 160);
}
.luckysheet-zoom-content .luckysheet-zoom-slider .luckysheet-zoom-hundred{
position: absolute;
top: 9px;
width: 2px;
height: 4px;
left: 49px;
background: #1E1E1F;
}
.luckysheet-zoom-content .luckysheet-zoom-plus{
position: absolute;
top: 0;
left: 130px;
width: 20px;
height:20px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.luckysheet-zoom-content .luckysheet-zoom-plus .luckysheet-zoom-plus-icon{
background-image:url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTRweCIgaGVpZ2h0PSIxNHB4IiB2aWV3Qm94PSIwIDAgMTQgMTQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDYzICg5MjQ0NSkgLSBodHRwczovL3NrZXRjaC5jb20gLS0+CiAgICA8dGl0bGU+cmlxaXF1amlhbuWkh+S7vSA0NjwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KICAgIDxnIGlkPSIyMDIwLzA4LzE0IiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0i55S75p2/5aSH5Lu9LTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xODQ4LjAwMDAwMCwgLTEwNTguMDAwMDAwKSIgZmlsbD0iIzQ0NEQ1QSI+CiAgICAgICAgICAgIDxnIGlkPSJyaXFpcXVqaWFu5aSH5Lu9LTExOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTg0My4wMDAwMDAsIDEwNTMuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uEIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg1LjAwMDAwMCwgNS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICA8cmVjdCBpZD0i55+p5b2iIiB4PSIwIiB5PSI2IiB3aWR0aD0iMTQiIGhlaWdodD0iMiI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSLnn6nlvaLlpIfku70iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDcuMDAwMDAwLCA3LjAwMDAwMCkgcm90YXRlKC0yNzAuMDAwMDAwKSB0cmFuc2xhdGUoLTcuMDAwMDAwLCAtNy4wMDAwMDApICIgeD0iMCIgeT0iNiIgd2lkdGg9IjE0IiBoZWlnaHQ9IjIiPjwvcmVjdD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+');
width: 14px;
height: 14px;
}
.luckysheet-zoom-content .luckysheet-zoom-plus:hover{
background-color: #E1E4E8;
}
.luckysheet-zoom-content .luckysheet-zoom-ratioText{
position: absolute;
top: 0;
left: 155px;
width: 60px;
color: #1E1E1F;
font-size: 12px;
text-align: left;
cursor: pointer;
}
.luckysheet-zoom-content .luckysheet-zoom-ratioText:hover{
background-color: #E1E4E8;
}