From 36d129414b696bd2a633d379cac1dff867f64413 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Wed, 25 May 2022 15:49:31 +0200
Subject: fix(settings): reduce font-size on small devices

With French translation, words are a little longer so I reduce the
font size on small devices to avoid line breaking.
---
 src/components/molecules/forms/select-with-tooltip.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

(limited to 'src/components/molecules/forms/select-with-tooltip.tsx')

diff --git a/src/components/molecules/forms/select-with-tooltip.tsx b/src/components/molecules/forms/select-with-tooltip.tsx
index 29e2563..46075c2 100644
--- a/src/components/molecules/forms/select-with-tooltip.tsx
+++ b/src/components/molecules/forms/select-with-tooltip.tsx
@@ -10,6 +10,10 @@ export type SelectWithTooltipProps = Omit<
   'labelPosition'
 > &
   Pick<TooltipProps, 'title' | 'content'> & {
+    /**
+     * Set additional classnames to the select wrapper.
+     */
+    className?: string;
     /**
      * Set additional classnames to the tooltip wrapper.
      */
@@ -22,9 +26,10 @@ export type SelectWithTooltipProps = Omit<
  * Render a select with a button to display a tooltip about options.
  */
 const SelectWithTooltip: FC<SelectWithTooltipProps> = ({
-  title,
+  className = '',
   content,
   id,
+  title,
   tooltipClassName = '',
   ...props
 }) => {
@@ -47,7 +52,7 @@ const SelectWithTooltip: FC<SelectWithTooltipProps> = ({
   );
 
   return (
-    <div className={styles.wrapper}>
+    <div className={`${styles.wrapper} ${className}`}>
       <LabelledSelect
         labelPosition="left"
         id={id}
-- 
cgit v1.2.3