diff --git a/src/atoms/input/DaoInput.jsx b/src/atoms/input/DaoInput.jsx
index 31476cfd8..51d34e7c3 100644
--- a/src/atoms/input/DaoInput.jsx
+++ b/src/atoms/input/DaoInput.jsx
@@ -19,7 +19,7 @@ export default function DaoInput({
     onChange(type === 'file' ? e.target.files?.[0] : e.target.value)
 
   return (
-    <div className={`${styles.container} ${className || ''}`}>
+    <div className={`${styles.container} ${className ?? ''}`}>
       <label>
         <p>{label}</p>
         <input
diff --git a/src/atoms/link/index.jsx b/src/atoms/link/index.jsx
index 76de64c87..7878f7ac5 100644
--- a/src/atoms/link/index.jsx
+++ b/src/atoms/link/index.jsx
@@ -1,4 +1,3 @@
-import React from 'react'
 import { CIDToURL } from '@utils/index'
 import { walletPreview } from '@utils/string'
 import { TOKENS } from '@constants'
diff --git a/src/data/api.ts b/src/data/api.ts
index d8db24762..645c6740c 100644
--- a/src/data/api.ts
+++ b/src/data/api.ts
@@ -4,6 +4,7 @@ import {
   CLAIMED_DAO_TOKENS_BIGMAP_ID,
 } from '@constants'
 import axios from 'axios'
+
 export const BaseTokenFieldsFragment = `
 fragment baseTokenFields on tokens {
   artifact_uri
@@ -281,6 +282,7 @@ interface TzktMetadata {
 interface TzktData {
   data?: TzktMetadata
 }
+
 /**
  * Get User Metadata
  */
diff --git a/src/data/swr.js b/src/data/swr.js
index da0dfc56d..3e877260a 100644
--- a/src/data/swr.js
+++ b/src/data/swr.js
@@ -88,7 +88,17 @@ export function useDaoRepresentatives(daoStorage) {
     getTzktData
   )
 
-  return [data?.representatives, mutate]
+  const representatives = data?.representatives
+    ? Object.fromEntries(
+        Object.entries(data.representatives).sort(([, com1], [, com2]) => {
+          if (com1 < com2) return -1
+          if (com1 > com2) return 1
+          return 0
+        })
+      )
+    : undefined
+
+  return [representatives, mutate]
 }
 
 export function useDaoUserVotes(address, daoStorage) {
diff --git a/src/pages/dao/claim.jsx b/src/pages/dao/claim.jsx
index 8d3fe7cc7..804bd7ec1 100644
--- a/src/pages/dao/claim.jsx
+++ b/src/pages/dao/claim.jsx
@@ -15,12 +15,13 @@ export const Claim = () => {
   return (
     <Page title="Claim DAO tokens" large>
       <div className={styles.container}>
+        <div className={styles.headline}>
+          <h1>Welcome to the TEIA tokens claim page!</h1>
+          <p>Here you can claim your Teia DAO tokens.</p>
+          <DAOIcon />
+        </div>
+
         <section className={styles.section}>
-          <div className={styles.headline}>
-            <h1>Welcome to the TEIA tokens claim page!</h1>
-            <p>Here you can claim your Teia DAO tokens.</p>
-            <DAOIcon />
-          </div>
           <p>
             By owning TEIA tokens, you are part of the Teia DAO LLC and eligible
             to put forward and vote on DAO proposals for Teia. Teia DAO tokens,
@@ -72,6 +73,7 @@ export const Claim = () => {
               <b>Confirm you have read the disclaimer</b> by checking the box at
               the bottom of this page to get access to the claim button.
             </li>
+
             <li counter="4">
               <b>Click on the "Claim TEIA tokens" button</b> at the bottom of
               this page to initiate the token claim process and confirm the
@@ -176,6 +178,7 @@ export const Claim = () => {
           </ol>
 
           <br />
+
           <Checkbox
             alt={`click to ${
               acceptLegalDisclaimer ? 'decline' : 'accept'
@@ -195,6 +198,7 @@ export const Claim = () => {
         {acceptLegalDisclaimer && (
           <>
             <Line />
+
             <section className={styles.section}>
               <h1 className={styles.section_title}>Claim your TEIA tokens!</h1>
 
@@ -204,13 +208,14 @@ export const Claim = () => {
                 </Button>
               </p>
             </section>
+
             <Line />
 
             <section className={styles.section}>
               <h1 className={styles.section_title}>Troubleshooting</h1>
               <p>
                 Here are some of the most common solutions if the token claim
-                process fails
+                process fails.
               </p>
 
               <ol>
@@ -220,7 +225,7 @@ export const Claim = () => {
                   wallet. The transaction cost for the claim process is about
                   0.1-0.2 tez.
                 </li>
-                <li>Clear your browser cache</li>
+                <li>Clear your browser cache.</li>
                 <li>
                   Switch the rpc node in the{' '}
                   <DefaultLink href="/settings">config menu</DefaultLink>,
diff --git a/src/pages/dao/index.jsx b/src/pages/dao/index.jsx
index e8b3fd16d..a58404063 100644
--- a/src/pages/dao/index.jsx
+++ b/src/pages/dao/index.jsx
@@ -3,11 +3,11 @@ import { DAO_GOVERNANCE_CONTRACT } from '@constants'
 import { useUserStore } from '@context/userStore'
 import { Page } from '@atoms/layout'
 import { Loading } from '@atoms/loading'
-import { Tabs } from '@atoms/tab/Tabs'
+import { Tabs } from '@atoms/tab'
 import {
-  useDaoTokenBalance,
   useStorage,
   useDaoRepresentatives,
+  useDaoTokenBalance,
 } from '@data/swr'
 import styles from '@style'
 
@@ -29,37 +29,38 @@ const TABS = [
 
 export const DAO = () => {
   // Get all the required DAO information
-  const daoStorage = useStorage(DAO_GOVERNANCE_CONTRACT)
-  const representatives = useDaoRepresentatives(daoStorage)
+  const [daoStorage] = useStorage(DAO_GOVERNANCE_CONTRACT)
+  const [representatives] = useDaoRepresentatives(daoStorage)
 
   // Get all the required user information
   const userAddress = useUserStore((st) => st.address)
   const userCommunity = representatives?.[userAddress]
-  const userTokenBalance = useDaoTokenBalance(userAddress)
+  const [userTokenBalance] = useDaoTokenBalance(userAddress)
 
   return (
     <Page title="Teia DAO">
-      <div className={styles.headline}>
-        <h1>Teia DAO</h1>
-      </div>
+      <div className={styles.container}>
+        <h1 className={styles.headline}>Teia DAO</h1>
 
-      {!daoStorage || !representatives ? (
-        <Loading message="Loading DAO information" />
-      ) : (
-        <>
-          <Tabs
-            tabs={TABS}
-            filter={(tab) => {
-              if (userTokenBalance === 0 && !userCommunity && tab.private) {
-                return null
-              }
+        {!daoStorage || !representatives ? (
+          <Loading message="Loading DAO information" />
+        ) : (
+          <>
+            <Tabs
+              tabs={TABS}
+              filter={(tab) => {
+                if (userTokenBalance === 0 && !userCommunity && tab.private) {
+                  return null
+                }
 
-              return tab
-            }}
-          />
-          <Outlet />
-        </>
-      )}
+                return tab
+              }}
+            />
+
+            <Outlet />
+          </>
+        )}
+      </div>
     </Page>
   )
 }
diff --git a/src/pages/dao/index.module.scss b/src/pages/dao/index.module.scss
index 2bde7b637..1cd9c2bc3 100644
--- a/src/pages/dao/index.module.scss
+++ b/src/pages/dao/index.module.scss
@@ -1,28 +1,19 @@
 @import '@styles/mixins.scss';
-@import '@styles/variables.scss';
 
 .container {
-  padding-top: 12px;
   padding-bottom: 60px;
   width: 100%;
-
-  @include respond-to('desktop') {
-    margin: 0;
-  }
 }
 
 .headline {
   text-align: center;
-  margin-bottom: 1em;
+  margin-bottom: 1em 0;
+
   > p {
     margin: 1em 0;
   }
 }
 
-.section_title {
-  margin-bottom: 1em;
-}
-
 .section {
   margin: 1em 0;
 
@@ -57,3 +48,7 @@
     margin-bottom: 30px;
   }
 }
+
+.section_title {
+  margin-bottom: 1em;
+}
diff --git a/src/pages/dao/tabs/Parameters.jsx b/src/pages/dao/tabs/Parameters.jsx
index bb36dee1a..67b3b69ef 100644
--- a/src/pages/dao/tabs/Parameters.jsx
+++ b/src/pages/dao/tabs/Parameters.jsx
@@ -4,16 +4,16 @@ import { Loading } from '@atoms/loading'
 import { Line } from '@atoms/line'
 import { TeiaUserLink, TezosAddressLink } from '@atoms/link'
 import {
-  useBalance,
-  useDaoTokenBalance,
   useStorage,
   useDaoGovernanceParameters,
   useDaoProposals,
   useDaoRepresentatives,
+  useDaoMemberCount,
+  useBalance,
+  useDaoTokenBalance,
   useDaoUserVotes,
   useDaoCommunityVotes,
   useDaoUsersAliases,
-  useDaoMemberCount,
 } from '@data/swr'
 import styles from '@style'
 
@@ -42,7 +42,7 @@ export const DaoParameters = () => {
   )
 
   // Display the loading page information until all data is available
-  if (!daoStorage || !governanceParameters || !representatives || !proposals) {
+  if (!governanceParameters || !proposals || !representatives) {
     return <Loading message="Loading DAO information" />
   }
 
@@ -55,14 +55,6 @@ export const DaoParameters = () => {
     ? DAO_TOKEN_DECIMALS
     : Math.pow(DAO_TOKEN_DECIMALS, 0.5)
 
-  // Invert the representatives map and sort the community keys
-  const communities = {}
-  const communitiesList = Object.values(representatives).sort()
-  communitiesList.forEach((key) => (communities[key] = ''))
-  Object.entries(representatives).forEach(
-    ([representative, community]) => (communities[community] = representative)
-  )
-
   // Calculate the number of times that the user has voted
   const numberOfTimesVoted = userVotes ? Object.keys(userVotes).length : 0
   const numberOfTimesVotedAsRepresentative = userCommunityVotes
@@ -70,14 +62,15 @@ export const DaoParameters = () => {
     : 0
 
   return (
-    <div className={styles.container}>
+    <>
       {userAddress && (
         <>
           <section className={styles.section}>
             <h1 className={styles.section_title}>User information</h1>
+
             <ul className={styles.parameters_list}>
-              <li>Address: {<TeiaUserLink address={userAddress} />}</li>
-              {userCommunity && <li>Teia Community: {userCommunity}</li>}
+              <li>Address: {<TeiaUserLink address={userAddress} shorten />}</li>
+              {userCommunity && <li>Representative for {userCommunity}.</li>}
               <li>
                 DAO token balance: {Math.round(userTokenBalance * 10) / 10} TEIA
               </li>
@@ -100,11 +93,12 @@ export const DaoParameters = () => {
       )}
 
       <section className={styles.section}>
-        <h1 className={styles.section_title}>General information</h1>
+        <h1 className={styles.section_title}>DAO information</h1>
+
         <ul className={styles.parameters_list}>
-          <li>DAO members: {daoMemberCount}</li>
+          <li>Members: {daoMemberCount}</li>
           <li>
-            DAO Treasury balance: {Math.round(daoBalance)} tez and{' '}
+            Treasury balance: {Math.round(daoBalance)} tez and{' '}
             {Math.round(daoTokenBalance * 10) / 10} TEIA tokens
           </li>
           <li>Total number of proposals: {Object.keys(proposals).length}</li>
@@ -136,16 +130,19 @@ export const DaoParameters = () => {
 
       <section className={styles.section}>
         <h1 className={styles.section_title}>Community representatives</h1>
+
         <ul className={styles.parameters_list}>
-          {Object.entries(communities).map(([community, representative]) => (
-            <li key={community}>
-              {community}:{' '}
-              <TeiaUserLink
-                address={representative}
-                alias={usersAliases?.[representative]}
-              />
-            </li>
-          ))}
+          {Object.entries(representatives).map(
+            ([representative, community]) => (
+              <li key={community}>
+                {`${community}: `}
+                <TeiaUserLink
+                  address={representative}
+                  alias={usersAliases?.[representative]}
+                />
+              </li>
+            )
+          )}
         </ul>
       </section>
 
@@ -155,6 +152,7 @@ export const DaoParameters = () => {
         <h1 className={styles.section_title}>
           Current DAO governance parameters
         </h1>
+
         <ul className={styles.parameters_list}>
           <li>
             Vote method:{' '}
@@ -203,30 +201,33 @@ export const DaoParameters = () => {
 
       <section className={styles.section}>
         <h1 className={styles.section_title}>Smart contracts</h1>
+
         <ul className={styles.parameters_list}>
           <li>
             DAO governance:{' '}
-            <TezosAddressLink address={DAO_GOVERNANCE_CONTRACT} />
+            <TezosAddressLink address={DAO_GOVERNANCE_CONTRACT} shorten />
           </li>
           <li>
-            DAO token: <TezosAddressLink address={daoStorage.token} />
+            DAO token: <TezosAddressLink address={daoStorage.token} shorten />
           </li>
           <li>
-            DAO treasury: <TezosAddressLink address={daoStorage.treasury} />
+            DAO treasury:{' '}
+            <TezosAddressLink address={daoStorage.treasury} shorten />
           </li>
           <li>
-            DAO guardians: <TezosAddressLink address={daoStorage.guardians} />
+            DAO guardians:{' '}
+            <TezosAddressLink address={daoStorage.guardians} shorten />
           </li>
           <li>
             DAO administrator:{' '}
-            <TezosAddressLink address={daoStorage.administrator} />
+            <TezosAddressLink address={daoStorage.administrator} shorten />
           </li>
           <li>
             Community representatives:{' '}
-            <TezosAddressLink address={daoStorage.representatives} />
+            <TezosAddressLink address={daoStorage.representatives} shorten />
           </li>
         </ul>
       </section>
-    </div>
+    </>
   )
 }
diff --git a/src/pages/dao/tabs/Proposals.jsx b/src/pages/dao/tabs/Proposals.jsx
index 6f4bf2bf8..c79c87501 100644
--- a/src/pages/dao/tabs/Proposals.jsx
+++ b/src/pages/dao/tabs/Proposals.jsx
@@ -130,32 +130,29 @@ export function DaoProposals() {
   )
 
   return (
-    <div className={styles.container}>
-      <section className={styles.section}>
-        <h1 className={styles.section_title}>Teia DAO proposals</h1>
-
-        <Select
-          alt="proposal group selection"
-          value={{
-            value: selectedStatus,
-            label: `${PROPOSAL_STATUS_OPTIONS[selectedStatus]} (${proposalsByStatus[selectedStatus].length})`,
-          }}
-          onChange={(e) => setSelectedStatus(e.value)}
-          options={statusToSelect.map((status) => ({
-            value: status,
-            label: `${PROPOSAL_STATUS_OPTIONS[status]} (${proposalsByStatus[status].length})`,
-          }))}
-          className={styles.selector}
-        >
-          <Line />
-        </Select>
-
-        <ProposalGroup
-          status={selectedStatus}
-          proposals={proposalsByStatus[selectedStatus]}
-        />
-      </section>
-    </div>
+    <section className={styles.section}>
+      <h1 className={styles.section_title}>Teia DAO proposals</h1>
+
+      <Select
+        alt="proposal group selection"
+        value={{
+          value: selectedStatus,
+          label: `${PROPOSAL_STATUS_OPTIONS[selectedStatus]} (${proposalsByStatus[selectedStatus].length})`,
+        }}
+        onChange={(e) => setSelectedStatus(e.value)}
+        options={statusToSelect.map((status) => ({
+          value: status,
+          label: `${PROPOSAL_STATUS_OPTIONS[status]} (${proposalsByStatus[status].length})`,
+        }))}
+      >
+        <Line />
+      </Select>
+
+      <ProposalGroup
+        status={selectedStatus}
+        proposals={proposalsByStatus[selectedStatus]}
+      />
+    </section>
   )
 }
 
diff --git a/src/pages/dao/tabs/Submit.jsx b/src/pages/dao/tabs/Submit.jsx
index cf9028e08..8168720d3 100644
--- a/src/pages/dao/tabs/Submit.jsx
+++ b/src/pages/dao/tabs/Submit.jsx
@@ -54,43 +54,40 @@ export function SubmitDaoProposals() {
     currentGovernanceParameters.escrow_amount / DAO_TOKEN_DECIMALS
 
   return (
-    <div className={styles.container}>
-      <section className={styles.section}>
-        <h1 className={styles.section_title}>Submit a new DAO proposal</h1>
-
-        {userTokenBalance === 0 ||
-        userTokenBalance < minimumTokensToCreateProposals ? (
-          userTokenBalance === 0 ? (
-            <p>Only DAO members can create proposals.</p>
-          ) : (
-            <p>
-              A minimum of {minimumTokensToCreateProposals} TEIA tokens are
-              needed to create proposals.
-            </p>
-          )
-        ) : (
-          <>
-            <Select
-              alt="proposal form selection"
-              value={{
-                value: selectedKind,
-                label: PROPOSAL_KINDS[selectedKind],
-              }}
-              onChange={(e) => setSelectedKind(e.value)}
-              options={Object.keys(PROPOSAL_KINDS).map((kind) => ({
-                value: kind,
-                label: PROPOSAL_KINDS[kind],
-              }))}
-              className={styles.selector}
-            >
-              <Line />
-            </Select>
+    <section className={styles.section}>
+      <h1 className={styles.section_title}>Submit a new DAO proposal</h1>
 
-            <ProposalForm kind={selectedKind} callback={callback} />
-          </>
-        )}
-      </section>
-    </div>
+      {userTokenBalance === 0 ||
+      userTokenBalance < minimumTokensToCreateProposals ? (
+        userTokenBalance === 0 ? (
+          <p>Only DAO members can create proposals.</p>
+        ) : (
+          <p>
+            A minimum of {minimumTokensToCreateProposals} TEIA tokens are needed
+            to create proposals.
+          </p>
+        )
+      ) : (
+        <>
+          <Select
+            alt="proposal form selection"
+            value={{
+              value: selectedKind,
+              label: PROPOSAL_KINDS[selectedKind],
+            }}
+            onChange={(e) => setSelectedKind(e.value)}
+            options={Object.keys(PROPOSAL_KINDS).map((kind) => ({
+              value: kind,
+              label: PROPOSAL_KINDS[kind],
+            }))}
+          >
+            <Line />
+          </Select>
+
+          <ProposalForm kind={selectedKind} callback={callback} />
+        </>
+      )}
+    </section>
   )
 }
 
diff --git a/src/pages/dao/tabs/index.module.scss b/src/pages/dao/tabs/index.module.scss
index 83b375083..27decfc94 100644
--- a/src/pages/dao/tabs/index.module.scss
+++ b/src/pages/dao/tabs/index.module.scss
@@ -1,31 +1,9 @@
 @import '@styles/mixins.scss';
 @import '@styles/variables.scss';
 
-.container {
-  padding-top: 12px;
-  padding-bottom: 60px;
-  width: 100%;
-
-  @include respond-to('desktop') {
-    margin: 0;
-  }
-}
-
-.section_title {
-  margin-bottom: 1em;
-}
-
 .section {
   margin: 1em 0;
 
-  b {
-    font-weight: bold;
-  }
-
-  i {
-    font-style: italic;
-  }
-
   a {
     text-decoration: underline;
   }
@@ -34,27 +12,21 @@
     margin: 1em 0;
   }
 
-  li {
-    margin-left: 1.5em;
-    margin-top: 0.8em;
-  }
-
-  li:before {
-    content: attr(counter) '.';
-    position: absolute;
-    margin-left: -1.5em;
-  }
-
   @include respond-to('desktop') {
     margin-bottom: 30px;
   }
 }
 
-.selector {
+.section_title {
   margin-bottom: 1em;
 }
 
 .parameters_list {
+  li {
+    margin-left: 1.5em;
+    margin-top: 0.8em;
+  }
+
   li:before {
     content: '';
   }