Adjust menubar (& overview naming) (#4922)

* Adjust menubar (& overview naming) * Slight padding adjustment
2021-03-24 13:14:46 +01:00 · 2021-03-24 13:14:46 +01:00 · d3482e638b
commit d3482e638b
parent 0146b95fbc
21 changed files with 38 additions and 38 deletions
--- a/packages/apps/public/locales/es/translation.json
+++ b/packages/apps/public/locales/es/translation.json
@ -122,6 +122,7 @@
  "Decimals decides the smallest unit of the token, which is 1/10^decimals": "Los decimales deciden la unidad más pequeña del token, que es 1/10^decimales",
  "Delete this custom example": "Eliminar este ejemplo personalizado",
  "Democracy overview": "Resumen de la democracia",
+  "Overview": "Resumen",
  "Deploy": "Despliegue",
  "Deploy a code hash": "Despliegue el hash del código",
  "Deploy this code hash as a smart contract": "Despliegue este hash del código como un contrato inteligente",
@ -1117,4 +1118,4 @@
  "{{threshold}}, not passing": "{{threshold}},  no pasará",
  "{{threshold}}, passing": "{{threshold}},  de aprobación",
  "{{value}}x voting balance, locked for {{lock}}x enactment ({{period}} days)": "{{value}}x saldo de votos, bloqueado por {{lock}}x sentencia ({{period}} días."
-}
+}
--- a/packages/apps/public/locales/id/translation.json
+++ b/packages/apps/public/locales/id/translation.json
@ -157,6 +157,7 @@
  "Copy the following string and sign it with the Ethereum account you used during the pre-sale in the wallet of your choice, using the string as the payload, and then paste the transaction signature object below:": "Salin string berikut dan tandatangani dengan akun Ethereum yang anda gunakan selama pra-penjualan di dompet pilihan anda, gunakan string sebagai muatan, lalu tempel objek tanda tangan transaksi di bawah ini:",
  "Council": "Dewan",
  "Council overview": "Tinjauan dewan",
+  "Overview": "Tinjauan",
  "Create": "Membuat",
  "Create a backup file for this account": "Membuat sebuah file cadangan untuk akun ini",
  "Create an account now.": "Buat sebuah akun sekarang.",
@ -1452,4 +1453,4 @@
  "{{threshold}}, not passing": "{{threshold}}, tidak melewati",
  "{{threshold}}, passing": "{{threshold}}, melewati",
  "{{value}}x voting balance, locked for {{lock}}x enactment ({{period}} days)": "{{value}}x memilih saldo, terkunci untuk {{lock}}x berlaku ({{period}} hari)"
-}
+}
--- a/packages/apps/public/locales/it/translation.json
+++ b/packages/apps/public/locales/it/translation.json
@ -164,6 +164,7 @@
  "Copy the following string and sign it with the Ethereum account you used during the pre-sale in the wallet of your choice, using the string as the payload, and then paste the transaction signature object below:": "Copia la seguente stringa e firmala con il conto Ethereum che hai usato durante la prevendita, sfruttando la stringa, e poi incolla la firma della tx qui sotto:",
  "Council": "Consiglio",
  "Council overview": "Resoconto Consiglio",
+  "Overview": "Resoconto",
  "Create": "Crea",
  "Create a backup file for this account": "Crea un file di backup per questo account",
  "Create an account now.": "Crea un account ora",
@ -1504,4 +1505,4 @@
  "{{threshold}}, passing": "{{threshold}}, approvato",
  "{{type}} copied": "{{type}} copiato",
  "{{value}}x voting balance, locked for {{lock}}x enactment ({{period}} days)": "{{value}} x moltiplicatore di voto, fondi bloccati per {{lock}}x = {{period}} giorni"
-}
+}
--- a/packages/apps/public/locales/ko/translation.json
+++ b/packages/apps/public/locales/ko/translation.json
@ -153,6 +153,7 @@
  "Copy the following string and sign it with the Ethereum account you used during the pre-sale in the wallet of your choice, using the string as the payload, and then paste the transaction signature object below:": "이 문자열을 복붙하고 프리세일에 참가했던 이더리움 지갑으로 사인한 다음에, 사인한 디지털 서명값을 아래 오브젝트에 붙여주세요.",
  "Council": "위원회",
  "Council overview": "위원회 개요",
+  "Overview": "개요",
  "Create": "생성하기",
  "Create a backup file for this account": "이 계정의 백업파일 생성하기",
  "Create and backup account": "계정을 생성하고 백업하기",
@ -1480,4 +1481,4 @@
  "{{threshold}}, not passing": "{{threshold}}, 통과되지 않았습니다",
  "{{threshold}}, passing": "{{threshold}}, 통과되었습니다",
  "{{value}}x voting balance, locked for {{lock}}x enactment ({{period}} days)": "{{value}}x 투표 발란스, 잠금 {{lock}}x제정 ({{period}} days)"
-}
+}
--- a/packages/apps/public/locales/pt/translation.json
+++ b/packages/apps/public/locales/pt/translation.json
@ -109,6 +109,7 @@
  "Copy the following string and sign it with the Ethereum account you used during the pre-sale in the wallet of your choice, using the string as the payload, and then paste the transaction signature object below:": "Copie a seguinte string e assine-a na conta Ethereum usada durante a pré-venda na carteira de sua escolha, usando a string como carga útil e cole o objeto de assinatura da transação abaixo:",
  "Council": "Conselho",
  "Council overview": "Visão geral do Conselho",
+  "Overview": "Visão geral",
  "Create": "Criar",
  "Create a backup file for this account": "Criar um arquivo de backup para esta conta",
  "Create an account now.": "Criar uma conta agora.",
@ -1124,4 +1125,4 @@
  "{{threshold}}, not passing": "{{threshold}}, não passando",
  "{{threshold}}, passing": "{{threshold}}, passando",
  "{{value}}x voting balance, locked for {{lock}}x enactment ({{period}} days)": "{{value}} x saldo de votos, bloqueado por {{lock}} x promulgação ({{period}} dias)"
-}
+}
--- a/packages/apps/public/locales/ru/translation.json
+++ b/packages/apps/public/locales/ru/translation.json
@ -110,6 +110,7 @@
  "Copy the following string and sign it with the Ethereum account you used during the pre-sale in the wallet of your choice, using the string as the payload, and then paste the transaction signature object below:": "Скопируйте следующую строку и подпишите ее учетной записью Ethereum, которую Вы использовали во время предпродажи, используя строку как \\payload\\. Вставьте полученную подпись ниже:",
  "Council": "Совет",
  "Council overview": "Обзор Совета",
+  "Overview": "Обзор",
  "Create": "Создать",
  "Create a backup file for this account": "Создать резервную копиюл для этого аккаунта",
  "Create an account now.": "Создать аккаунт сейчас.",
@ -1135,4 +1136,4 @@
  "{{threshold}}, not passing": "{{threshold}}, не проходит",
  "{{threshold}}, passing": "{{threshold}}, проходит",
  "{{value}}x voting balance, locked for {{lock}}x enactment ({{period}} days)": "{{value}}x баланс голосования, заблокировано на {{lock}}x ({{period}} дней)"
-}
+}
--- a/packages/apps/public/locales/zh/translation.json
+++ b/packages/apps/public/locales/zh/translation.json
@ -148,6 +148,7 @@
  "Copy the following string and sign it with the Ethereum account you used during the pre-sale in the wallet of your choice, using the string as the payload, and then paste the transaction signature object below:": "复制以下字符串，并使用您在预售期间使用的以太坊帐户在您选择的钱包中进行签名，使用该字符串作为有效负载，然后将交易签名对象粘贴到下面",
  "Council": "理事会",
  "Council overview": "理事会概览",
+  "Overview": "概览",
  "Create": "创建",
  "Create a backup file for this account": "给这个账号创建一个备份文件",
  "Create an account now.": "马上创建账户.",
@ -1379,4 +1380,4 @@
  "{{threshold}}, not passing": "{{threshold}},没有通过",
  "{{threshold}}, passing": "{{threshold}}, 通过",
  "{{value}}x voting balance, locked for {{lock}}x enactment ({{period}} days)": "{{value}}x投票余额，锁定 {{lock}}x 执行 ({{period}} days)"
-}
+}
--- a/packages/apps/src/Menu/ChainInfo.tsx
+++ b/packages/apps/src/Menu/ChainInfo.tsx
@ -58,7 +58,7 @@ function ChainInfo ({ className }: Props): React.ReactElement<Props> {

 export default React.memo(styled(ChainInfo)`
  box-sizing: border-box;
-  padding: 0.642rem 1rem 0.642rem 1.5rem;
+  padding: 0.5rem 1rem 0.5rem 1.5rem;
  margin: 0;

  .apps--SideBar-logo-inner {
--- a/packages/apps/src/Menu/Grouping.tsx
+++ b/packages/apps/src/Menu/Grouping.tsx
@ -50,12 +50,10 @@ function Grouping ({ className = '', isActive, name, routes }: Props): React.Rea
 export default React.memo(styled(Grouping)`
  cursor: pointer;
  position: relative;
-  margin-bottom: -5px;

  .groupHdr {
-    border-radius: 0.285rem;
-    padding: 0.857rem 0.857em 0.786rem 1rem;
-    margin-bottom: 1.071rem;
+    border-radius: 0.25rem;
+    padding: 0.857rem 0.857em 0.857rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.214rem;
@ -69,17 +67,16 @@ export default React.memo(styled(Grouping)`
    background-color: var(--bg-tabs);
    font-size: 1rem;
    font-weight: 400;
-    padding: 0.857rem 1.429rem 1.857rem;
+    padding: 0.857rem 1.429rem;
    margin-bottom: 0;

    &:hover {
-      padding: 0.857rem 1.429rem 0.786rem 1.429rem;
-      margin-bottom: 1.071rem;
+      padding: 0.857rem 1.429rem;
    }
  }

  .groupMenu {
-    border-radius: 0.286rem;
+    border-radius: 0.25rem;
    box-shadow: 0 ${SHA_OFF} ${SHA_OFF} -${SHA_OFF} ${SHA_COL}, ${SHA_OFF} 0 ${SHA_OFF} -${SHA_OFF} ${SHA_COL}, -${SHA_OFF} 0 ${SHA_OFF} -${SHA_OFF} ${SHA_COL};
    display: none;
    margin: 0;
--- a/packages/apps/src/Menu/Item.tsx
+++ b/packages/apps/src/Menu/Item.tsx
@ -56,13 +56,11 @@ export default React.memo(styled(Item)`
    font-weight: 400;
    line-height: 1.214rem;
    border-radius: 0.15rem;
-    margin-bottom: -5px;

    a {
-      padding: 0.857rem 0.857em 0.786rem 1rem;
-      margin-bottom: 1.071rem;
+      padding: 0.857rem 0.857em 0.857rem 1rem;
      line-height: 1.214rem;
-      border-radius: 0.285rem;
+      border-radius: 0.25rem;
    }

    &.isActive.highlight--color-contrast {
@ -77,11 +75,9 @@ export default React.memo(styled(Item)`

    &.isActive {
      border-radius: 0.15rem 0.15rem 0 0;
-      margin-bottom: -5px;

      a {
-        padding: 0.857rem 1.429rem 1.857rem;
-        margin-bottom: 0;
+        padding: 0.857rem 1.429rem 0.857rem;
        cursor: default;
      }

--- a/packages/apps/src/Menu/index.tsx
+++ b/packages/apps/src/Menu/index.tsx
@ -164,12 +164,12 @@ export default React.memo(styled(Menu)`

  & .menuContainer {
    flex-direction: row;
-    align-items: flex-end;
+    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 0 1.5rem;
    width: 100%;
-    max-width: 1750px;
+    max-width: var(--width-full);
    margin: 0 auto;
  }

@ -190,7 +190,7 @@ export default React.memo(styled(Menu)`
  }

  .menuSection {
-    align-items: flex-end;
+    align-items: center;
    display: flex;
  }

@ -212,14 +212,14 @@ export default React.memo(styled(Menu)`
    flex: 1 1;
    list-style: none;
    margin: 0 1rem 0 0;
-    padding: 0.786rem 0 0;
+    padding: 0;

    > li {
      display: inline-block;
    }

    > li + li {
-      margin-left: 0.25rem
+      margin-left: 0.5rem
    }
  }

--- a/packages/page-assets/src/index.tsx
+++ b/packages/page-assets/src/index.tsx
@ -21,7 +21,7 @@ function GiltApp ({ basePath, className }: Props): React.ReactElement<Props> {
    {
      isRoot: true,
      name: 'overview',
-      text: t<string>('Asset overview')
+      text: t<string>('Overview')
    }
  ]);

--- a/packages/page-bounties/src/index.tsx
+++ b/packages/page-bounties/src/index.tsx
@ -22,7 +22,7 @@ function BountiesApp ({ basePath, className = '' }: Props): React.ReactElement<P
    {
      isRoot: true,
      name: 'index',
-      text: t<string>('Bounties')
+      text: t<string>('Overview')
    }
  ]);

--- a/packages/page-council/src/index.tsx
+++ b/packages/page-council/src/index.tsx
@ -41,7 +41,7 @@ function CouncilApp ({ basePath, className }: Props): React.ReactElement<Props>
    {
      isRoot: true,
      name: 'overview',
-      text: t<string>('Council overview')
+      text: t<string>('Overview')
    },
    {
      count: numMotions,
--- a/packages/page-democracy/src/index.tsx
+++ b/packages/page-democracy/src/index.tsx
@ -26,7 +26,7 @@ function DemocracyApp ({ basePath }: Props): React.ReactElement<Props> {
    {
      isRoot: true,
      name: 'overview',
-      text: t<string>('Democracy overview')
+      text: t<string>('Overview')
    },
    {
      count: dispatchCount,
--- a/packages/page-gilt/src/index.tsx
+++ b/packages/page-gilt/src/index.tsx
@ -21,7 +21,7 @@ function GiltApp ({ basePath, className }: Props): React.ReactElement<Props> {
    {
      isRoot: true,
      name: 'overview',
-      text: t<string>('Gilt overview')
+      text: t<string>('Overview')
    }
  ]);

--- a/packages/page-parachains/src/index.tsx
+++ b/packages/page-parachains/src/index.tsx
@ -33,7 +33,7 @@ function ParachainsApp ({ basePath, className }: Props): React.ReactElement<Prop
    {
      isRoot: true,
      name: 'overview',
-      text: t<string>('Parachains overview')
+      text: t<string>('Overview')
    },
    api.query.proposeParachain && {
      name: 'proposals',
--- a/packages/page-society/src/index.tsx
+++ b/packages/page-society/src/index.tsx
@ -100,7 +100,7 @@ function SocietyApp ({ basePath, className }: Props): React.ReactElement<Props>
    {
      isRoot: true,
      name: 'overview',
-      text: t<string>('Society overview')
+      text: t<string>('Overview')
    },
    {
      count: candidateCount,
--- a/packages/page-staking/src/index.tsx
+++ b/packages/page-staking/src/index.tsx
@ -66,7 +66,7 @@ function StakingApp ({ basePath, className = '' }: Props): React.ReactElement<Pr
    {
      isRoot: true,
      name: 'overview',
-      text: t<string>('Staking overview')
+      text: t<string>('Overview')
    },
    {
      name: 'actions',
--- a/packages/page-tech-comm/src/index.tsx
+++ b/packages/page-tech-comm/src/index.tsx
@ -36,7 +36,7 @@ function TechCommApp ({ basePath, className }: Props): React.ReactElement<Props>
    {
      isRoot: true,
      name: 'overview',
-      text: t<string>('Tech. committee')
+      text: t<string>('Overview')
    },
    {
      name: 'proposals',
--- a/packages/page-treasury/src/index.tsx
+++ b/packages/page-treasury/src/index.tsx
@ -37,7 +37,7 @@ function TreasuryApp ({ basePath }: Props): React.ReactElement<Props> {
    {
      isRoot: true,
      name: 'overview',
-      text: t<string>('Treasury overview')
+      text: t<string>('Overview')
    },
    isFunction((api.query.tips || api.query.treasury)?.tips) && {
      count: tipHashes?.length,