Center labels

nam-pi · May 28, 2021 · bf34331 · bf34331
1 parent e70e1e3
commit bf34331
Show file tree

Hide file tree

Showing 7 changed files with 60 additions and 15 deletions.
diff --git a/src/App/components/AspectsPage/index.tsx b/src/App/components/AspectsPage/index.tsx
@@ -30,7 +30,10 @@ export const AspectsPage = () => {
           activeItem={idLocal}
           filterSettings={
             <div className="grid grid-cols-1 sm:grid-cols-6 gap-4">
-              <Label className="col-span-2" htmlFor="type-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="type-input"
+              >
                 <FormattedMessage
                   description="Aspect type filter input label"
                   defaultMessage="Aspect type"
@@ -43,7 +46,10 @@ export const AspectsPage = () => {
                 typeBase={namespaces.core.aspect}
                 typeIri={query.type}
               />
-              <Label className="col-span-2" htmlFor="text-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="text-input"
+              >
                 <FormattedMessage
                   description="Aspect text filter input label"
                   defaultMessage="Text"

diff --git a/src/App/components/AuthorsPage/index.tsx b/src/App/components/AuthorsPage/index.tsx
@@ -28,7 +28,10 @@ export const AuthorsPage = () => {
           activeItem={idLocal}
           filterSettings={
             <div className="grid grid-cols-1 sm:grid-cols-6 gap-4">
-              <Label className="col-span-2" htmlFor="text-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="text-input"
+              >
                 <FormattedMessage
                   description="Author text filter input label"
                   defaultMessage="Text"

diff --git a/src/App/components/EventsPage/index.tsx b/src/App/components/EventsPage/index.tsx
@@ -44,7 +44,10 @@ export const EventsPage = () => {
           activeItem={idLocal}
           filterSettings={
             <div className="grid grid-cols-1 sm:grid-cols-6 gap-4">
-              <Label className="col-span-2" htmlFor="sort-select">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="sort-select"
+              >
                 <FormattedMessage
                   description="Order by filter input label"
                   defaultMessage="Order by"
@@ -62,7 +65,10 @@ export const EventsPage = () => {
                 ]}
                 selected={query.orderBy}
               />
-              <Label className="col-span-2" htmlFor="aspect-type-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="aspect-type-input"
+              >
                 <FormattedMessage
                   description="Used aspect type filter input label"
                   defaultMessage="Used aspect type"
@@ -75,7 +81,10 @@ export const EventsPage = () => {
                 typeBase={namespaces.core.aspect}
                 typeIri={query.aspectType}
               />
-              <Label className="col-span-2" htmlFor="participant-type-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="participant-type-input"
+              >
                 <FormattedMessage
                   description="Used participant type filter input label"
                   defaultMessage="Used participant type"
@@ -90,7 +99,10 @@ export const EventsPage = () => {
                 typeBase={namespaces.core.agent}
                 typeIri={query.participantType}
               />
-              <Label className="col-span-2" htmlFor="text-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="text-input"
+              >
                 <FormattedMessage
                   description="Event text filter input label"
                   defaultMessage="Text"

diff --git a/src/App/components/GroupsPage/index.tsx b/src/App/components/GroupsPage/index.tsx
@@ -30,7 +30,10 @@ export const GroupsPage = () => {
           activeItem={idLocal}
           filterSettings={
             <div className="grid grid-cols-1 sm:grid-cols-6 gap-4">
-              <Label className="col-span-2" htmlFor="type-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="type-input"
+              >
                 <FormattedMessage
                   description="Group type filter input label"
                   defaultMessage="Group type"
@@ -43,7 +46,10 @@ export const GroupsPage = () => {
                 typeBase={namespaces.core.group}
                 typeIri={query.type}
               />
-              <Label className="col-span-2" htmlFor="text-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="text-input"
+              >
                 <FormattedMessage
                   description="Group text filter input label"
                   defaultMessage="Text"

diff --git a/src/App/components/PersonsPage/index.tsx b/src/App/components/PersonsPage/index.tsx
@@ -34,7 +34,10 @@ export const PersonsPage = () => {
           activeItem={idLocal}
           filterSettings={
             <div className="grid grid-cols-1 sm:grid-cols-6 gap-4">
-              <Label className="col-span-2" htmlFor="type-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="type-input"
+              >
                 <FormattedMessage
                   description="Person type filter input label"
                   defaultMessage="Person type"
@@ -47,7 +50,10 @@ export const PersonsPage = () => {
                 typeBase={namespaces.core.person}
                 typeIri={query.type}
               />
-              <Label className="col-span-2" htmlFor="text-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="text-input"
+              >
                 <FormattedMessage
                   description="Person text filter input label"
                   defaultMessage="Text"

diff --git a/src/App/components/PlacesPage/index.tsx b/src/App/components/PlacesPage/index.tsx
@@ -30,7 +30,10 @@ export const PlacesPage = () => {
           activeItem={idLocal}
           filterSettings={
             <div className="grid grid-cols-1 sm:grid-cols-6 gap-4">
-              <Label className="col-span-2" htmlFor="type-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="type-input"
+              >
                 <FormattedMessage
                   description="Place type filter input label"
                   defaultMessage="Place type"
@@ -43,7 +46,10 @@ export const PlacesPage = () => {
                 typeBase={namespaces.core.place}
                 typeIri={query.type}
               />
-              <Label className="col-span-2" htmlFor="text-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="text-input"
+              >
                 <FormattedMessage
                   description="Place text filter input label"
                   defaultMessage="Text"

diff --git a/src/App/components/SourcesPage/index.tsx b/src/App/components/SourcesPage/index.tsx
@@ -30,7 +30,10 @@ export const SourcesPage = () => {
           activeItem={idLocal}
           filterSettings={
             <div className="grid grid-cols-1 sm:grid-cols-6 gap-4">
-              <Label className="col-span-2" htmlFor="type-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="type-input"
+              >
                 <FormattedMessage
                   description="Source type filter input label"
                   defaultMessage="Source type"
@@ -43,7 +46,10 @@ export const SourcesPage = () => {
                 typeBase={namespaces.core.source}
                 typeIri={query.type}
               />
-              <Label className="col-span-2" htmlFor="text-input">
+              <Label
+                className="col-span-2 sm:flex sm:items-center"
+                htmlFor="text-input"
+              >
                 <FormattedMessage
                   description="Source text filter input label"
                   defaultMessage="Text"