PluginProbe
Sharing Image / 2.0.11
Sharing Image v2.0.11
3.10 trunk 2.0 2.0.0 2.0.1 2.0.10 2.0.11 2.0.12 2.0.13 2.0.14 2.0.15 2.0.16 2.0.17 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 2.0.7 2.0.8 2.0.9 3.0 3.1 3.2 3.3 All 29 releases
sharing-image / assets / styles / widget.css

widget.css in Sharing Image 2.0.11, at assets/styles/widget.css

220 lines 5.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 body.block-editor-page .button {
2 display: inline-flex;
3 align-items: center;
4 height: 36px;
5 margin: 0;
6 padding: 6px 12px;
7 font-size: 13px;
8 color: #007cba;
9 background: none;
10 border: none;
11 border-radius: 2px;
12 outline: 1px solid transparent;
13 box-shadow: inset 0 0 0 1px #006ba1;
14 }
15 body.block-editor-page .button:hover {
16 color: #007cba;
17 background: none;
18 }
19 body.block-editor-page .button:focus {
20 color: #007cba;
21 box-shadow: inset 0 0 0 1px #007cba;
22 }
23 body.block-editor-page .button-delete {
24 color: #cc1818;
25 box-shadow: inset 0 0 0 1px #cc1818;
26 }
27 body.block-editor-page .button-delete:hover {
28 color: #710d0d;
29 box-shadow: inset 0 0 0 1px #710d0d;
30 }
31 body.block-editor-page textarea {
32 padding: 6px 8px;
33 font-size: 13px;
34 border-radius: 2px;
35 box-shadow: transparent 0px 0px 0px;
36 transition: box-shadow 0.1s linear 0s;
37 }
38 body.block-editor-page textarea:focus {
39 border-color: #007cba;
40 box-shadow: 0 0 0 0.5px #007cba;
41 outline: transparent solid 2px;
42 }
43 body.block-editor-page select {
44 border-radius: 2px;
45 font-size: 13px;
46 }
47 body.block-editor-page select:focus {
48 border-color: #007cba;
49 box-shadow: 0 0 0 0.5px #007cba;
50 outline: transparent solid 2px;
51 }
52 body.block-editor-page select:hover {
53 color: #007cba;
54 }
55
56 .sharing-image-widget {
57 display: flex;
58 position: relative;
59 }
60 .sharing-image-widget * {
61 box-sizing: border-box;
62 }
63 .sharing-image-widget .sharing-image-picker {
64 display: block;
65 position: relative;
66 flex: 1 1 auto;
67 margin-top: 4px;
68 }
69 .sharing-image-widget .sharing-image-picker .sharing-image-picker-template {
70 display: block;
71 width: 100%;
72 margin-bottom: 12px;
73 }
74 .sharing-image-widget .sharing-image-picker .sharing-image-picker-template select {
75 display: block;
76 width: 100%;
77 max-width: 100%;
78 }
79 .sharing-image-widget .sharing-image-picker .sharing-image-picker-fieldset {
80 display: none;
81 position: relative;
82 }
83 .sharing-image-widget .sharing-image-picker .sharing-image-picker-fieldset.fieldset-visible {
84 display: block;
85 }
86 .sharing-image-widget .sharing-image-picker .sharing-image-picker-media {
87 display: flex;
88 flex-flow: row wrap;
89 align-items: center;
90 margin-bottom: 12px;
91 }
92 .sharing-image-widget .sharing-image-picker .sharing-image-picker-media .button {
93 margin-right: 14px;
94 }
95 .sharing-image-widget .sharing-image-picker .sharing-image-picker-featured {
96 display: flex;
97 align-items: center;
98 cursor: pointer;
99 padding: 0;
100 font-size: 18px;
101 color: #8c8f94;
102 background: 0;
103 border: none;
104 transition: color 0.25s;
105 }
106 .sharing-image-widget .sharing-image-picker .sharing-image-picker-featured::after {
107 font-family: dashicons;
108 content: "\f128";
109 }
110 .sharing-image-widget .sharing-image-picker .sharing-image-picker-featured:hover {
111 color: #2271b1;
112 }
113 .sharing-image-widget .sharing-image-picker .sharing-image-picker-featured.featured-seleted {
114 color: #2271b1;
115 }
116 .sharing-image-widget .sharing-image-picker .sharing-image-picker-caption {
117 display: block;
118 width: 100%;
119 margin-bottom: 12px;
120 }
121 .sharing-image-widget .sharing-image-picker .sharing-image-picker-caption h4 {
122 margin: 0;
123 }
124 .sharing-image-widget .sharing-image-picker .sharing-image-picker-caption > * {
125 display: block;
126 width: 100%;
127 }
128 .sharing-image-widget .sharing-image-picker .sharing-image-picker-caption textarea {
129 height: 52px;
130 min-height: 28px;
131 margin-top: 5px;
132 }
133 .sharing-image-widget .sharing-image-picker .sharing-image-picker-poster {
134 display: none;
135 position: relative;
136 width: 100%;
137 margin-bottom: 12px;
138 overflow: hidden;
139 border-radius: 2px;
140 }
141 .sharing-image-widget .sharing-image-picker .sharing-image-picker-poster.poster-visible {
142 display: block;
143 }
144 .sharing-image-widget .sharing-image-picker .sharing-image-picker-poster img {
145 display: block;
146 height: auto;
147 max-width: 100%;
148 }
149 .sharing-image-widget .sharing-image-picker .sharing-image-picker-manager {
150 display: flex;
151 align-items: center;
152 width: 100%;
153 padding-top: 12px;
154 border-top: solid 1px #ccc;
155 }
156 .sharing-image-widget .sharing-image-picker .sharing-image-picker-manager .button {
157 margin-right: 12px;
158 }
159 .sharing-image-widget .sharing-image-picker .sharing-image-picker-warning {
160 display: none;
161 position: relative;
162 margin: 0 0 12px;
163 color: #b32d2e;
164 }
165 .sharing-image-widget .sharing-image-picker .sharing-image-picker-warning.warning-visible {
166 display: block;
167 }
168 .sharing-image-widget .sharing-image-picker .sharing-image-picker-delete {
169 display: none;
170 cursor: pointer;
171 color: #b32d2e;
172 border-color: #b32d2e;
173 }
174 .sharing-image-widget .sharing-image-picker .sharing-image-picker-delete:hover {
175 color: #710d0d;
176 }
177 .sharing-image-widget .sharing-image-picker .sharing-image-picker-spinner {
178 float: none;
179 margin: 0;
180 }
181 .sharing-image-widget .sharing-image-picker .poster-visible ~ .sharing-image-picker-manager .sharing-image-picker-delete {
182 display: inline-flex;
183 }
184 .sharing-image-widget .sharing-image-picker .poster-loader ~ .sharing-image-picker-manager .sharing-image-picker-spinner {
185 visibility: visible;
186 }
187 .sharing-image-widget .sharing-image-title {
188 display: block;
189 position: relative;
190 padding: 20px 10px 20px 0;
191 flex: 0 0 220px;
192 }
193 .sharing-image-widget .sharing-image-title strong {
194 font-weight: 600;
195 font-size: 14px;
196 }
197 @media screen and (max-width: 782px) {
198 .sharing-image-widget .sharing-image-title {
199 padding: 10px 0 0 0;
200 }
201 }
202 .sharing-image-widget.widget-taxonomy {
203 max-width: 95%;
204 margin-bottom: 20px;
205 }
206 .sharing-image-widget.widget-taxonomy .sharing-image-picker {
207 margin-top: 15px;
208 padding: 10px;
209 background: #fff;
210 box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.125);
211 border-radius: 3px;
212 }
213 @media screen and (max-width: 782px) {
214 .sharing-image-widget.widget-taxonomy {
215 display: block;
216 }
217 }
218 .sharing-image-widget.widget-metabox {
219 max-width: 480px;
220 }