You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by vi...@apache.org on 2022/05/06 12:29:06 UTC

[superset] branch mobile-friendly-dash updated: customize font sizes

This is an automated email from the ASF dual-hosted git repository.

villebro pushed a commit to branch mobile-friendly-dash
in repository https://gitbox.apache.org/repos/asf/superset.git


The following commit(s) were added to refs/heads/mobile-friendly-dash by this push:
     new 2c778cc826 customize font sizes
2c778cc826 is described below

commit 2c778cc826d312b4d492d40e1befd9e43baca550
Author: Ville Brofeldt <vi...@gmail.com>
AuthorDate: Fri May 6 15:27:42 2022 +0300

    customize font sizes
---
 superset-frontend/src/components/FaveStar/index.tsx   |  3 ++-
 .../src/dashboard/components/Header/index.jsx         |  5 +++++
 .../dashboard/components/PublishedStatus/index.jsx    | 19 +++++++++++++------
 3 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/superset-frontend/src/components/FaveStar/index.tsx b/superset-frontend/src/components/FaveStar/index.tsx
index 0473e3d9b2..da67b56e2b 100644
--- a/superset-frontend/src/components/FaveStar/index.tsx
+++ b/superset-frontend/src/components/FaveStar/index.tsx
@@ -35,7 +35,8 @@ const StyledLink = styled.a`
   ${({ theme }) => css`
     font-size: ${theme.typography.sizes.xl}px;
     display: flex;
-    padding: 0 0 0 ${theme.gridUnit * 2}px;
+    margin: 0;
+    padding: 0;
   `};
 `;
 
diff --git a/superset-frontend/src/dashboard/components/Header/index.jsx b/superset-frontend/src/dashboard/components/Header/index.jsx
index 2513644d75..1d3767724c 100644
--- a/superset-frontend/src/dashboard/components/Header/index.jsx
+++ b/superset-frontend/src/dashboard/components/Header/index.jsx
@@ -125,6 +125,11 @@ const StyledDashboardHeader = styled.div`
     .action-button {
       display: none;
     }
+
+    .header-large {
+      font-weight: ${({ theme }) => theme.typography.weights.bold};
+      font-size: ${({ theme }) => theme.typography.sizes.l}px;
+    }
   }
   .action-button > span {
     color: ${({ theme }) => theme.colors.grayscale.base};
diff --git a/superset-frontend/src/dashboard/components/PublishedStatus/index.jsx b/superset-frontend/src/dashboard/components/PublishedStatus/index.jsx
index 915ea0aecc..e60cc07f82 100644
--- a/superset-frontend/src/dashboard/components/PublishedStatus/index.jsx
+++ b/superset-frontend/src/dashboard/components/PublishedStatus/index.jsx
@@ -18,7 +18,7 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { t } from '@superset-ui/core';
+import { styled, t } from '@superset-ui/core';
 import { Tooltip } from 'src/components/Tooltip';
 import Label from 'src/components/Label';
 
@@ -44,6 +44,13 @@ const publishedTooltip = t(
   'This dashboard is published. Click to make it a draft.',
 );
 
+const StyledLabel = styled(Label)`
+  margin: 0;
+  @media (max-width: 767px) {
+    font-size: ${({ theme }) => theme.typography.sizes.xs}px;
+  }
+`;
+
 export default class PublishedStatus extends React.Component {
   componentDidMount() {
     this.togglePublished = this.togglePublished.bind(this);
@@ -64,13 +71,13 @@ export default class PublishedStatus extends React.Component {
             placement="bottom"
             title={draftButtonTooltip}
           >
-            <Label
+            <StyledLabel
               onClick={() => {
                 this.togglePublished();
               }}
             >
               {t('Draft')}
-            </Label>
+            </StyledLabel>
           </Tooltip>
         );
       }
@@ -80,7 +87,7 @@ export default class PublishedStatus extends React.Component {
           placement="bottom"
           title={draftDivTooltip}
         >
-          <Label>{t('Draft')}</Label>
+          <StyledLabel>{t('Draft')}</StyledLabel>
         </Tooltip>
       );
     }
@@ -93,13 +100,13 @@ export default class PublishedStatus extends React.Component {
           placement="bottom"
           title={publishedTooltip}
         >
-          <Label
+          <StyledLabel
             onClick={() => {
               this.togglePublished();
             }}
           >
             {t('Published')}
-          </Label>
+          </StyledLabel>
         </Tooltip>
       );
     }