PluginProbe
Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant / 1.11.1
Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant v1.11.1
2.3.2 2.3.1 2.3.0 2.2.8 2.2.7 trunk 1.10.0 1.10.1 1.10.2 1.10.3 1.10.4 1.10.5 1.11.0 1.11.1 1.11.2 1.6 1.7 1.8 1.8.1 1.8.2 1.8.3 1.9.0 1.9.1 1.9.10 1.9.11 All 60 releases
merchant / assets / css / modules / recent-sales-notifications / admin / preview.css

preview.css in Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant 1.11.1, at assets/css/modules/recent-sales-notifications/admin/preview.css

142 lines 4.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 :root {
2 --merchant-rsn-bg-color: #fff;
3 --merchant-rsn-bg-image: unset;
4 --merchant-rsn-box-width: 420px;
5 --merchant-rsn-border-color: rgba(255, 255, 255, 0);
6 --merchant-rsn-close-btn-bg: #f3f3f3;
7 --merchant-rsn-box-radius: 0px;
8 --merchant-rsn-box-product-image-radius: 5px;
9 }
10
11 .merchant-module-page-setting-field-fields_group {
12 margin-bottom: 0;
13 }
14 .merchant-module-page-setting-field-fields_group > .merchant-module-page-setting-field-title {
15 display: none;
16 }
17
18 .merchant-module-page-preview-browser-inner {
19 min-height: 300px;
20 position: relative;
21 }
22
23 .merchant-module-page-setting-field-image_picker .merchant-image-picker label {
24 max-width: 31%;
25 }
26 .merchant-module-page-setting-field-image_picker .merchant-image-picker img {
27 max-width: 100%;
28 }
29
30 .merchant-recent-sales-notifications-widget {
31 padding: 15px;
32 padding-right: 35px;
33 position: absolute;
34 -webkit-transition: 300ms;
35 transition: 300ms;
36 background-color: var(--merchant-rsn-bg-color);
37 background-image: var(--merchant-rsn-bg-image);
38 background-size: cover;
39 background-position: center;
40 background-repeat: no-repeat;
41 width: var(--merchant-rsn-box-width);
42 max-width: 100%;
43 border: 1px solid var(--merchant-rsn-border-color);
44 border-radius: var(--merchant-rsn-box-radius);
45 z-index: 99999;
46 -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
47 box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
48 -webkit-backdrop-filter: blur(8px);
49 backdrop-filter: blur(8px);
50 top: 50%;
51 left: 50%;
52 -webkit-transform: translate(-50%, -50%);
53 transform: translate(-50%, -50%);
54 }
55 .merchant-recent-sales-notifications-widget .merchant-close-notification {
56 position: absolute;
57 top: 8px;
58 right: 10px;
59 cursor: pointer;
60 background: var(--merchant-rsn-close-btn-bg) !important;
61 border: none !important;
62 outline: none;
63 border-radius: 50% !important;
64 width: 19px;
65 height: 19px !important;
66 padding: 1px !important;
67 -webkit-transition: 300ms;
68 transition: 300ms;
69 }
70 .merchant-recent-sales-notifications-widget .merchant-close-notification svg {
71 line-height: 0;
72 display: block;
73 margin: 0 auto;
74 }
75 .merchant-recent-sales-notifications-widget .merchant-notification-content {
76 display: -webkit-box;
77 display: -ms-flexbox;
78 display: flex;
79 -webkit-box-pack: start;
80 -ms-flex-pack: start;
81 justify-content: flex-start;
82 -webkit-box-align: center;
83 -ms-flex-align: center;
84 align-items: center;
85 gap: 10px;
86 }
87 .merchant-recent-sales-notifications-widget .merchant-notification-content .merchant-notification-image {
88 -webkit-box-flex: 0;
89 -ms-flex: 0 0 77px;
90 flex: 0 0 77px;
91 }
92 .merchant-recent-sales-notifications-widget .merchant-notification-content .merchant-notification-image .image-placeholder {
93 width: 77px;
94 height: 77px;
95 background-color: #dadada;
96 border-radius: var(--merchant-rsn-box-product-image-radius);
97 -webkit-transition: 300ms;
98 transition: 300ms;
99 }
100 .merchant-recent-sales-notifications-widget .merchant-notification-content .merchant-notification-text {
101 -webkit-box-flex: 1;
102 -ms-flex: 1;
103 flex: 1;
104 }
105 .merchant-recent-sales-notifications-widget .merchant-notification-content .merchant-notification-text p {
106 margin: 0;
107 }
108 .merchant-recent-sales-notifications-widget .merchant-notification-content .merchant-notification-text .merchant-notification-message {
109 font-size: 14px;
110 -webkit-transition: 300ms;
111 transition: 300ms;
112 }
113 .merchant-recent-sales-notifications-widget .merchant-notification-content .merchant-notification-text .merchant-notification-title {
114 font-size: 16px;
115 font-weight: bold;
116 -webkit-transition: 300ms;
117 transition: 300ms;
118 }
119 .merchant-recent-sales-notifications-widget .merchant-notification-content .merchant-notification-text .merchant-notification-time {
120 font-size: 12px;
121 color: #919191;
122 -webkit-transition: 300ms;
123 transition: 300ms;
124 }
125 .merchant-recent-sales-notifications-widget.widget-layout-1 .merchant-notification-content .merchant-notification-image .image-placeholder {
126 -webkit-transform: translateY(-35px);
127 transform: translateY(-35px);
128 }
129 .merchant-recent-sales-notifications-widget.widget-layout-4 .merchant-close-notification {
130 top: 50%;
131 -webkit-transform: translateY(-50%);
132 transform: translateY(-50%);
133 }
134 .merchant-recent-sales-notifications-widget.light-text-color-scheme .merchant-notification-content .merchant-notification-text .merchant-notification-message {
135 color: #fff;
136 }
137 .merchant-recent-sales-notifications-widget.light-text-color-scheme .merchant-notification-content .merchant-notification-text .merchant-notification-title {
138 color: #fff;
139 }
140 .merchant-recent-sales-notifications-widget.light-text-color-scheme .merchant-notification-content .merchant-notification-text .merchant-notification-time {
141 color: #dfdfdf;
142 }