UNPKG

3.75 kBCSSView Raw
1/*!
2 * ArchEditor v1.0.0
3 * Author: longlongago2
4 * Build Time: 2021/8/23 16:32:12
5 */
6.ArchEditor-atomic-image-container {
7 display: inline-block;
8}
9.ArchEditor-atomic-image {
10 position: relative;
11 display: inline-block;
12 box-sizing: border-box;
13 transition: box-shadow 0.3s ease;
14}
15.ArchEditor-atomic-image.ArchEditor-active {
16 min-width: 280px;
17}
18.ArchEditor-atomic-image.ArchEditor-active,
19.ArchEditor-atomic-image:hover {
20 outline: 1px solid #d9d9d9;
21 box-shadow: 0 0 15px 5px rgba(36, 26, 26, 0.05);
22}
23.ArchEditor-atomic-image.ArchEditor-active .ArchEditor-image-toolbar,
24.ArchEditor-atomic-image:hover .ArchEditor-image-toolbar {
25 border-top: 1px solid #d9d9d9;
26}
27.ArchEditor-atomic-image > img {
28 display: block;
29 font-size: 12px;
30 transition: all 0.3s ease;
31}
32.ArchEditor-atomic-image .ArchEditor-default-image {
33 width: 280px;
34 height: auto;
35}
36.ArchEditor-atomic-image .ArchEditor-image-toolbar {
37 display: block;
38 width: 100%;
39 padding: 10px 0;
40}
41.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row {
42 display: flex;
43 width: 100%;
44 padding: 5px 0;
45 flex-direction: row;
46 justify-content: center;
47 align-items: center;
48 font-size: 14px;
49 color: #666;
50}
51.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-col {
52 display: inline-block;
53}
54.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-col + .ArchEditor-col {
55 margin-left: 15px;
56}
57.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-input-number {
58 display: inline-block;
59 width: 65px;
60 border: 1px solid #d9d9d9;
61 line-height: 25px;
62 text-indent: 5px;
63 outline: none;
64 background-color: transparent;
65 box-sizing: border-box;
66}
67.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-input-number:focus {
68 border-color: #5d6791;
69}
70.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-input-text {
71 display: inline-block;
72 width: 190px;
73 border: 1px solid #d9d9d9;
74 line-height: 25px;
75 text-indent: 5px;
76 outline: none;
77 background-color: transparent;
78 box-sizing: border-box;
79}
80.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-input-text:focus {
81 border-color: #5d6791;
82}
83.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-input-button {
84 display: inline-block;
85 width: 190px;
86 color: #999;
87 white-space: nowrap;
88 text-overflow: ellipsis;
89 overflow: hidden;
90 transition: border-color 0.3s ease;
91 border: 1px solid #d9d9d9;
92 line-height: 25px;
93 text-indent: 5px;
94 outline: none;
95 background-color: transparent;
96 box-sizing: border-box;
97}
98.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-input-button:focus {
99 border-color: #5d6791;
100}
101.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-input-button:hover {
102 border-color: #5d6791;
103}
104.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-radio-button {
105 display: inline-block;
106}
107.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-radio-button > input[type='radio'] {
108 display: none;
109}
110.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-radio-button > input[type='radio']:checked + span {
111 background-color: #5d6791;
112 color: #fff;
113}
114.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-radio-button > span {
115 display: inline-block;
116 font-size: 12px;
117 line-height: 1;
118 padding: 7px 5px;
119 border: 1px solid #5d6791;
120}
121.ArchEditor-atomic-image .ArchEditor-image-toolbar .ArchEditor-row .ArchEditor-radio-button + .ArchEditor-radio-button > span {
122 border-left-color: transparent;
123 margin-left: -1px;
124}
125