diff --git a/plugins/csv-import/src/App.css b/plugins/csv-import/src/App.css index ff50911a8..5361f8034 100644 --- a/plugins/csv-import/src/App.css +++ b/plugins/csv-import/src/App.css @@ -126,6 +126,8 @@ body { align-items: center; gap: 10px; width: 100%; + position: relative; + color: var(--framer-color-text); } .collection-icon-container { @@ -134,7 +136,9 @@ body { justify-content: center; width: 20px; height: 20px; - opacity: 0.5; + position: absolute; + left: 8px; + top: 5px; } .collection-creation-container { @@ -147,22 +151,29 @@ body { .collection-select { flex: 1; min-width: 0; - height: 28px; + padding-left: 33px; } -.collection-select.error { +.collection-selector.error { color: #f36; - background-color: color-mix(in srgb, #f36 10%, transparent); - box-shadow: inset 0 0 0 1px #f36; +} + +.collection-selector.error .collection-select { + color: inherit; + background-color: color-mix(in srgb, currentColor 10%, transparent); + box-shadow: inset 0 0 0 1px currentColor; +} + +select.collection-select { + padding-bottom: 0; } input.collection-select { - padding: 0px 16px 1px 8px; + padding-left: 33px; } .error-message { color: #f36; - padding-left: 30px; } /* Manage conflicts screen */ diff --git a/plugins/csv-import/src/components/CollectionIcon.tsx b/plugins/csv-import/src/components/CollectionIcon.tsx index fd63f15a5..5ab181ae7 100644 --- a/plugins/csv-import/src/components/CollectionIcon.tsx +++ b/plugins/csv-import/src/components/CollectionIcon.tsx @@ -1,10 +1,26 @@ -export function CollectionIcon({ color = "currentColor" }: { color?: string }) { +export function CollectionIcon() { return ( - + ) } diff --git a/plugins/csv-import/src/components/CollectionSelector.tsx b/plugins/csv-import/src/components/CollectionSelector.tsx index e5c5b5e43..0da2368c9 100644 --- a/plugins/csv-import/src/components/CollectionSelector.tsx +++ b/plugins/csv-import/src/components/CollectionSelector.tsx @@ -124,7 +124,7 @@ export function CollectionSelector({ forceCreate, collection, onCollectionChange if (isCreatingNew) { return (
-
+
@@ -132,7 +132,7 @@ export function CollectionSelector({ forceCreate, collection, onCollectionChange