From 47e3e54543b2b9a613d0029435794d2265e2a952 Mon Sep 17 00:00:00 2001 From: IEatChili Date: Thu, 16 May 2024 16:49:55 -0700 Subject: feat: added image sorting --- .../collectionFreeForm/ImageLabelHandler.scss | 44 ++++++++++++++++++++++ 1 file changed, 44 insertions(+) create mode 100644 src/client/views/collections/collectionFreeForm/ImageLabelHandler.scss (limited to 'src/client/views/collections/collectionFreeForm/ImageLabelHandler.scss') diff --git a/src/client/views/collections/collectionFreeForm/ImageLabelHandler.scss b/src/client/views/collections/collectionFreeForm/ImageLabelHandler.scss new file mode 100644 index 000000000..e7413bf8e --- /dev/null +++ b/src/client/views/collections/collectionFreeForm/ImageLabelHandler.scss @@ -0,0 +1,44 @@ +#label-handler { + display: flex; + flex-direction: column; + align-items: center; + + > div:first-child { + display: flex; // Puts the input and button on the same row + align-items: center; // Vertically centers items in the flex container + + input { + color: black; + } + + .IconButton { + margin-left: 8px; // Adds space between the input and the icon button + width: 19px; + } + } + + > div:not(:first-of-type) { + display: flex; + flex-direction: column; + align-items: center; // Centers the content vertically in the flex container + width: 100%; + + > div { + display: flex; + justify-content: space-between; // Puts the content and delete button on opposite ends + align-items: center; + width: 100%; + margin-top: 8px; // Adds space between label rows + + p { + text-align: center; // Centers the text of the paragraph + flex-grow: 1; // Allows the paragraph to grow and occupy the available space + } + + .IconButton { + // Styling for the delete button + margin-left: auto; // Pushes the button to the far right + } + } + } +} -- cgit v1.2.3-70-g09d2