@omnigrid/style 0.1.3 → 0.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/index.css +79 -11
  2. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -136,25 +136,93 @@
136
136
  align-items: center;
137
137
  }
138
138
 
139
- /* Headless pager (PaginationPlugin). */
140
- .omnigrid-pagination {
139
+ /* Reusable controls for slot-based plugin widgets. */
140
+ .omnigrid-control-bar {
141
141
  align-items: center;
142
142
  display: flex;
143
- gap: 8px;
143
+ gap: 24px;
144
+ }
145
+
146
+ .omnigrid-control-group {
147
+ align-items: center;
148
+ display: inline-flex;
149
+ gap: 4px;
144
150
  }
145
151
 
146
- .omnigrid-pagination-btn {
147
- background: var(--omnigrid-button-background);
148
- border: 1px solid var(--omnigrid-button-border);
152
+ .omnigrid-popup-control {
153
+ position: relative;
154
+ }
155
+
156
+ .omnigrid-control-button,
157
+ .omnigrid-popup-option {
158
+ background: transparent;
159
+ border: 0;
160
+ color: inherit;
161
+ font: inherit;
162
+ cursor: pointer;
163
+ }
164
+
165
+ .omnigrid-control-button {
166
+ white-space: nowrap;
167
+ }
168
+
169
+ .omnigrid-popup-menu {
170
+ background: var(--omnigrid-grid-background, #fff);
171
+ border: 1px solid var(--omnigrid-grid-border, #ccc);
149
172
  border-radius: 4px;
150
- color: var(--omnigrid-button-color);
173
+ bottom: calc(100% + 6px);
174
+ display: flex;
175
+ flex-direction: column;
176
+ left: 0;
177
+ min-width: 100%;
178
+ padding: 4px;
179
+ position: absolute;
180
+ z-index: 10;
181
+ }
182
+
183
+ .omnigrid-popup-option {
184
+ padding: 4px 8px;
185
+ text-align: left;
186
+ }
187
+
188
+ .omnigrid-popup-option:hover,
189
+ .omnigrid-popup-option[aria-selected="true"] {
190
+ background: var(--omnigrid-cell-hover-background, #eee);
191
+ }
192
+
193
+ .omnigrid-number-input {
194
+ background: var(--omnigrid-grid-background, #fff);
195
+ border: 1px solid var(--omnigrid-grid-border, #ccc);
196
+ border-radius: 3px;
197
+ color: var(--omnigrid-cell-color, currentColor);
198
+ font: inherit;
199
+ padding: 2px 4px;
200
+ }
201
+
202
+ .omnigrid-icon {
203
+ display: block;
204
+ flex: 0 0 auto;
205
+ }
206
+
207
+ .omnigrid-icon-button {
208
+ align-items: center;
209
+ background: transparent;
210
+ border: 0;
211
+ border-radius: 3px;
212
+ color: inherit;
151
213
  cursor: pointer;
152
- font-size: 12px;
153
- line-height: 1.4;
154
- padding: 3px 10px;
214
+ display: inline-flex;
215
+ justify-content: center;
216
+ line-height: 1;
217
+ padding: 4px;
218
+ }
219
+
220
+ .omnigrid-icon-button:focus-visible {
221
+ outline: 2px solid currentColor;
222
+ outline-offset: 1px;
155
223
  }
156
224
 
157
- .omnigrid-pagination-btn:disabled {
225
+ .omnigrid-icon-button:disabled {
158
226
  cursor: default;
159
227
  opacity: 0.5;
160
228
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@omnigrid/style",
3
- "version": "0.1.3",
3
+ "version": "0.1.4",
4
4
  "description": "Shared styles for OmniGrid",
5
5
  "keywords": [
6
6
  "omnigrid",