Change ToS link label in menu (#1039)

Qwant · Mar 12, 2021 · 5d2a9d0 · 5d2a9d0
1 parent 8d70d96
commit 5d2a9d0
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 4 deletions.
diff --git a/src/panel/Menu.jsx b/src/panel/Menu.jsx
@@ -71,7 +71,8 @@ const Menu = () => {
             outsideLink
             icon={<IconLightbulb width={16} fill={ACTION_BLUE_BASE} />}
           >
-            {_('About Qwant Maps', 'menu')}
+            <span dangerouslySetInnerHTML={{
+              __html: _('Terms of service Qwant&nbsp;Maps', 'menu') }} />
           </MenuItem>
           <MenuItem
             href="https://github.com/Qwant/qwantmaps/blob/master/contributing.md"

diff --git a/src/panel/menu/MenuItem.jsx b/src/panel/menu/MenuItem.jsx
@@ -13,9 +13,9 @@ const MenuItem = ({ icon, children, href, onClick, outsideLink }) =>
       target: '_blank',
     } : {})}
   >
-    <Flex>
-      {icon && <Flex className="u-mr-s">{icon}</Flex>}
-      <div style={{ flexGrow: 1 }}>{children}</div>
+    <Flex alignItems="flex-start">
+      {icon && <div className="u-mr-s">{icon}</div>}
+      <div className="u-mr-s" style={{ flexGrow: 1 }}>{children}</div>
       {outsideLink && <IconExternalLink width={16} fill={GREY_SEMI_DARKNESS} />}
     </Flex>
   </a>;

diff --git a/src/scss/includes/menu.scss b/src/scss/includes/menu.scss
@@ -54,6 +54,12 @@ $menuPanelWidth: 300px;
   display: block;
   padding: $spacing-m $spacing-xl-2;
   color: $grey-black;
+
+  // Needed to ensure icons are visually aligned with the first line of text
+  svg {
+    height: 16px;
+    flex-shrink: 0;
+  }
 
   &:hover, &:active {
     text-decoration: none;