[enh] Switch to a 12px default font size

Signed-off-by: Stéphane Bégaudeau <[email protected]>
eclipse-sirius · Jun 14, 2024 · a0f0def · a0f0def
1 parent 9742458
commit a0f0def
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 18 deletions.
diff --git a/packages/core/frontend/sirius-components-core/src/theme.ts b/packages/core/frontend/sirius-components-core/src/theme.ts
@@ -1,5 +1,5 @@
 /*******************************************************************************
- * Copyright (c) 2021, 2023 Obeo.
+ * Copyright (c) 2021, 2024 Obeo.
  * This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v2.0
  * which accompanies this distribution, and is available at
@@ -25,62 +25,57 @@ const fallbackTheme = createTheme({
     selected: 'gray',
   },
   typography: {
+    fontSize: 12,
     h1: {
-      fontSize: '4rem',
+      fontSize: '3.42rem',
       fontWeight: 400,
       lineHeight: 1.167,
       letterSpacing: '0em',
     },
     h2: {
-      fontSize: '3rem',
+      fontSize: '2.5rem',
       fontWeight: 400,
       lineHeight: 1.2,
       letterSpacing: '0em',
     },
     h3: {
-      fontSize: '2.5rem',
+      fontSize: '2.142rem',
       fontWeight: 400,
       lineHeight: 1.167,
       letterSpacing: '0.3px',
     },
     h4: {
-      fontSize: '2rem',
+      fontSize: '1.7rem',
       fontWeight: 400,
       lineHeight: 1.235,
       letterSpacing: '0.00735em',
     },
     h5: {
-      fontSize: '1.5rem',
       fontWeight: 700,
       lineHeight: 1.334,
       letterSpacing: '0em',
     },
     h6: {
-      fontSize: '1.25rem',
       fontWeight: 700,
       lineHeight: 1.5,
       letterSpacing: '0.0075em',
     },
     subtitle1: {
-      fontSize: '1rem',
       fontWeight: 700,
       lineHeight: 1.7,
       letterSpacing: '0.03em',
     },
     subtitle2: {
-      fontSize: '0.875rem',
       fontWeight: 700,
       lineHeight: 2,
       letterSpacing: '0.06em',
     },
     body1: {
-      fontSize: '1rem',
       fontWeight: 400,
       lineHeight: 1.5,
       letterSpacing: '0.00938em',
     },
     body2: {
-      fontSize: '0.875rem',
       fontWeight: 400,
       lineHeight: 1.43,
       letterSpacing: '0.01071em',

diff --git a/...us-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.tsx b/...us-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.tsx
@@ -46,7 +46,6 @@ const useProjectTemplateStyles = makeStyles((theme) => ({
   projectTemplateLabel: {
     textTransform: 'none',
     fontWeight: 400,
-    fontSize: theme.spacing(2),
     textOverflow: 'ellipsis',
     overflow: 'hidden',
     whiteSpace: 'nowrap',
@@ -68,7 +67,7 @@ export const ProjectTemplateCard = ({ template, running, disabled, onCreateProje
         </CardContent>
         <CardActions className={classes.templateCardActions}>
           <Tooltip title={template.label}>
-            <Typography variant="h5" className={classes.projectTemplateLabel}>
+            <Typography variant="body1" className={classes.projectTemplateLabel}>
               + {template.label}
             </Typography>
           </Tooltip>
@@ -91,7 +90,6 @@ const useProjectCardStyles = makeStyles((theme) => ({
   projectCardLabel: {
     textTransform: 'none',
     fontWeight: 400,
-    fontSize: theme.spacing(2),
     textOverflow: 'ellipsis',
     overflow: 'hidden',
     whiteSpace: 'nowrap',
@@ -129,7 +127,7 @@ export const NewProjectCard = () => {
         </CardContent>
         <CardActions className={classes.projectCardActions}>
           <Tooltip title={'Blank project'}>
-            <Typography variant="h5" className={classes.projectCardLabel}>
+            <Typography variant="body1" className={classes.projectCardLabel}>
               + Blank project
             </Typography>
           </Tooltip>
@@ -149,7 +147,7 @@ export const UploadProjectCard = () => {
         </CardContent>
         <CardActions className={classes.projectCardActions}>
           <Tooltip title={'Upload project'}>
-            <Typography variant="h5" className={classes.projectCardLabel}>
+            <Typography variant="body1" className={classes.projectCardLabel}>
               + Upload project
             </Typography>
           </Tooltip>
@@ -169,7 +167,7 @@ export const ShowAllTemplatesCard = ({ onClick }: ShowAllTemplatesCardProps) =>
         </CardContent>
         <CardActions className={classes.projectCardActions}>
           <Tooltip title={'Show all templates'}>
-            <Typography variant="h5" className={classes.projectCardLabel}>
+            <Typography variant="body1" className={classes.projectCardLabel}>
               Show all templates
             </Typography>
           </Tooltip>

diff --git a/...ontend/sirius-web-application/src/views/project-settings/images/ProjectImagesSettings.tsx b/...ontend/sirius-web-application/src/views/project-settings/images/ProjectImagesSettings.tsx
@@ -83,7 +83,7 @@ export const ProjectImagesSettings = () => {
     <>
       <div className={classes.imageSettingsViewContainer}>
         <div className={classes.header}>
-          <Typography variant="h3">Project Images</Typography>
+          <Typography variant="h4">Project Images</Typography>
 
           <div className={classes.actions}>
             <Button data-testid="upload-image" color="primary" variant="outlined" onClick={onTriggerUpload}>