fix styling

src/components/styled/views/Board.styled.jsx

@@ -87,14 +87,14 @@ export const NavBar = styled.div`
       return `font-size: 9pt;
       color: #b86;
       
-      a, span {
+      a, #button-span {
         font-weight: 400 !important;
         padding: 1px !important;
         text-decoration: none !important;
         color: maroon !important;
       }
 
-      a:hover, span:hover {
+      a:hover, #button-span:hover {
         color: red !important;
       }
       
@@ -115,14 +115,14 @@ export const NavBar = styled.div`
       return `font-size: 9pt;
       color: #89a;
       
-      a, span {
+      a, #button-span {
         font-weight: 400 !important;
         padding: 1px !important;
         text-decoration: none !important;
         color: #34345c !important;
       }
 
-      a:hover, span:hover {
+      a:hover, #button-span:hover {
         color: #d00 !important;
       }
       
@@ -133,14 +133,14 @@ export const NavBar = styled.div`
       case 'Futaba':
         return `font-size: 11pt;
         
-        a, a:visited, span {
+        a, a:visited, #button-span {
           font-weight: 400 !important;
           padding: 1px !important;
           color: #00e !important;
           text-decoration: underline !important;
         }
 
-        a:hover, span:hover {
+        a:hover, #button-span:hover {
           color: red !important;
         }
       
@@ -158,14 +158,14 @@ export const NavBar = styled.div`
       case 'Burichan':
         return `font-size: 11pt;
         
-        a, a:visited, span {
+        a, a:visited, #button-span {
           font-weight: 400 !important;
           padding: 1px !important;
           color: #34345c !important;
           text-decoration: underline !important;
         }
 
-        a:hover, span:hover {
+        a:hover, #button-span:hover {
           color: #d00 !important;
         }
       
@@ -180,14 +180,14 @@ export const NavBar = styled.div`
         return `font-size: 9pt;
         color: #c5c8c6;
         
-        a, a:visited, span {
+        a, a:visited, #button-span {
           font-weight: 400 !important;
           padding: 1px !important;
           text-decoration: none !important;
           color: #81a2be !important;
         }
 
-        a:hover, span:hover {
+        a:hover, #button-span:hover {
           color: #5f89ab !important;
         }
 
@@ -206,14 +206,14 @@ export const NavBar = styled.div`
         return `font-size: 9pt;
         color: #333;
         
-        a, a:visited, span {
+        a, a:visited, #button-span {
           font-weight: 400 !important;
           padding: 1px !important;
           text-decoration: none !important;
           color: #f60 !important;
         }
 
-        a:hover, span:hover {
+        a:hover, #button-span:hover {
           color: #ff3300 !important;
         }
 

src/components/views/All.jsx

@@ -221,11 +221,11 @@ const All = () => {
             </span>
             <span className="nav">
               [
-              <button style={{all: 'unset', cursor: 'pointer'}} onClick={
+              <span id="button-span" style={{cursor: 'pointer'}} onClick={
                 () => alert(
                   'To create a board, first you have to run a full node.\nYou can run a full node by simply browsing with the plebbit desktop app. After you download it, open it, wait for it loading, then click on "Home" in the top left, then "Create Community".\n\nAfter you create the community, you can go back to plebchan at any time to see it as a board by pasting its address (begins with p/12D3KooW...) in the search bar, which is in the Home.\n\nNote:\n\n- Your community will be online for as long as you leave the app open, because it functions like a server for the community.\n- The longer you leave the app open, the more data you are seeding to the protocol, which helps performance for everybody.\n - All the data in the plebbit protocol is just text, which is extremely lightweight. All media is generated by links, which is text, embedded by the clients.\n\nDownload the plebbit app here: https://github.com/plebbit/plebbit-react/releases\n\nYou can also use a CLI: https://github.com/plebbit/plebbit-cli\n\nRunning boards in the plebchan app is a planned feature.\n\n'
                   )
-              }>Create Board</button>
+              }>Create Board</span>
               ]
               [
               <Link to={`/p/all/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>

src/components/views/AllCatalog.jsx

@@ -122,11 +122,11 @@ const AllCatalog = () => {
           </span>
             <span className="nav">
             [
-              <button style={{all: 'unset', cursor: 'pointer'}} onClick={
+              <span id="button-span" style={{cursor: 'pointer'}} onClick={
                 () => alert(
                   'To create a board, first you have to run a full node.\nYou can run a full node by simply browsing with the plebbit desktop app. After you download it, open it, wait for it loading, then click on "Home" in the top left, then "Create Community".\n\nAfter you create the community, you can go back to plebchan at any time to see it as a board by pasting its address (begins with p/12D3KooW...) in the search bar, which is in the Home.\n\nNote:\n\n- Your community will be online for as long as you leave the app open, because it functions like a server for the community.\n- The longer you leave the app open, the more data you are seeding to the protocol, which helps performance for everybody.\n - All the data in the plebbit protocol is just text, which is extremely lightweight. All media is generated by links, which is text, embedded by the clients.\n\nDownload the plebbit app here: https://github.com/plebbit/plebbit-react/releases\n\nYou can also use a CLI: https://github.com/plebbit/plebbit-cli\n\nRunning boards in the plebchan app is a planned feature.\n\n'
                   )
-              }>Create Board</button>
+              }>Create Board</span>
               ]
               [
               <Link to={`/p/all/catalog/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>

src/components/views/Board.jsx

@@ -564,11 +564,11 @@ const Board = () => {
             </span>
             <span className="nav">
               [
-              <button style={{all: 'unset', cursor: 'pointer'}} onClick={
+              <span id="button-span" style={{cursor: 'pointer'}} onClick={
                 () => alert(
                   'To create a board, first you have to run a full node.\nYou can run a full node by simply browsing with the plebbit desktop app. After you download it, open it, wait for it loading, then click on "Home" in the top left, then "Create Community".\n\nAfter you create the community, you can go back to plebchan at any time to see it as a board by pasting its address (begins with p/12D3KooW...) in the search bar, which is in the Home.\n\nNote:\n\n- Your community will be online for as long as you leave the app open, because it functions like a server for the community.\n- The longer you leave the app open, the more data you are seeding to the protocol, which helps performance for everybody.\n - All the data in the plebbit protocol is just text, which is extremely lightweight. All media is generated by links, which is text, embedded by the clients.\n\nDownload the plebbit app here: https://github.com/plebbit/plebbit-react/releases\n\nYou can also use a CLI: https://github.com/plebbit/plebbit-cli\n\nRunning boards in the plebchan app is a planned feature.\n\n'
                   )
-              }>Create Board</button>
+              }>Create Board</span>
               ]
               [
               <Link to={`/p/${selectedAddress}/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>

src/components/views/Catalog.jsx

@@ -487,11 +487,11 @@ const Catalog = () => {
           </span>
             <span className="nav">
             [
-              <button style={{all: 'unset', cursor: 'pointer'}} onClick={
+              <span id="button-span" style={{cursor: 'pointer'}} onClick={
                 () => alert(
                   'To create a board, first you have to run a full node.\nYou can run a full node by simply browsing with the plebbit desktop app. After you download it, open it, wait for it loading, then click on "Home" in the top left, then "Create Community".\n\nAfter you create the community, you can go back to plebchan at any time to see it as a board by pasting its address (begins with p/12D3KooW...) in the search bar, which is in the Home.\n\nNote:\n\n- Your community will be online for as long as you leave the app open, because it functions like a server for the community.\n- The longer you leave the app open, the more data you are seeding to the protocol, which helps performance for everybody.\n - All the data in the plebbit protocol is just text, which is extremely lightweight. All media is generated by links, which is text, embedded by the clients.\n\nDownload the plebbit app here: https://github.com/plebbit/plebbit-react/releases\n\nYou can also use a CLI: https://github.com/plebbit/plebbit-cli\n\nRunning boards in the plebchan app is a planned feature.\n\n'
                   )
-              }>Create Board</button>
+              }>Create Board</span>
               ]
               [
               <Link to={`/p/${selectedAddress}/catalog/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>

src/components/views/Pending.jsx

@@ -125,6 +125,13 @@ const Pending = () => {
             ]
           </span>
             <span className="nav">
+              [
+              <span id="button-span" style={{cursor: 'pointer'}} onClick={
+                () => alert(
+                  'To create a board, first you have to run a full node.\nYou can run a full node by simply browsing with the plebbit desktop app. After you download it, open it, wait for it loading, then click on "Home" in the top left, then "Create Community".\n\nAfter you create the community, you can go back to plebchan at any time to see it as a board by pasting its address (begins with p/12D3KooW...) in the search bar, which is in the Home.\n\nNote:\n\n- Your community will be online for as long as you leave the app open, because it functions like a server for the community.\n- The longer you leave the app open, the more data you are seeding to the protocol, which helps performance for everybody.\n - All the data in the plebbit protocol is just text, which is extremely lightweight. All media is generated by links, which is text, embedded by the clients.\n\nDownload the plebbit app here: https://github.com/plebbit/plebbit-react/releases\n\nYou can also use a CLI: https://github.com/plebbit/plebbit-cli\n\nRunning boards in the plebchan app is a planned feature.\n\n'
+                  )
+              }>Create Board</span>
+              ]
               [
               <Link to={`/profile/c/${index}/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>
               ]

src/components/views/Subscriptions.jsx

@@ -220,11 +220,11 @@ const Subscriptions = () => {
             </span>
             <span className="nav">
               [
-              <button style={{all: 'unset', cursor: 'pointer'}} onClick={
+              <span id="button-span" style={{cursor: 'pointer'}} onClick={
                 () => alert(
                   'To create a board, first you have to run a full node.\nYou can run a full node by simply browsing with the plebbit desktop app. After you download it, open it, wait for it loading, then click on "Home" in the top left, then "Create Community".\n\nAfter you create the community, you can go back to plebchan at any time to see it as a board by pasting its address (begins with p/12D3KooW...) in the search bar, which is in the Home.\n\nNote:\n\n- Your community will be online for as long as you leave the app open, because it functions like a server for the community.\n- The longer you leave the app open, the more data you are seeding to the protocol, which helps performance for everybody.\n - All the data in the plebbit protocol is just text, which is extremely lightweight. All media is generated by links, which is text, embedded by the clients.\n\nDownload the plebbit app here: https://github.com/plebbit/plebbit-react/releases\n\nYou can also use a CLI: https://github.com/plebbit/plebbit-cli\n\nRunning boards in the plebchan app is a planned feature.\n\n'
                   )
-              }>Create Board</button>
+              }>Create Board</span>
               ]
               [
               <Link to={`/p/subscriptions/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>

src/components/views/SubscriptionsCatalog.jsx

@@ -123,11 +123,11 @@ const SubscriptionsCatalog = () => {
           </span>
             <span className="nav">
             [
-              <button style={{all: 'unset', cursor: 'pointer'}} onClick={
+              <span id="button-span" style={{cursor: 'pointer'}} onClick={
                 () => alert(
                   'To create a board, first you have to run a full node.\nYou can run a full node by simply browsing with the plebbit desktop app. After you download it, open it, wait for it loading, then click on "Home" in the top left, then "Create Community".\n\nAfter you create the community, you can go back to plebchan at any time to see it as a board by pasting its address (begins with p/12D3KooW...) in the search bar, which is in the Home.\n\nNote:\n\n- Your community will be online for as long as you leave the app open, because it functions like a server for the community.\n- The longer you leave the app open, the more data you are seeding to the protocol, which helps performance for everybody.\n - All the data in the plebbit protocol is just text, which is extremely lightweight. All media is generated by links, which is text, embedded by the clients.\n\nDownload the plebbit app here: https://github.com/plebbit/plebbit-react/releases\n\nYou can also use a CLI: https://github.com/plebbit/plebbit-cli\n\nRunning boards in the plebchan app is a planned feature.\n\n'
                   )
-              }>Create Board</button>
+              }>Create Board</span>
               ]
               [
               <Link to={`/p/subscriptions/catalog/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>

src/components/views/Thread.jsx

@@ -522,11 +522,11 @@ const Thread = () => {
           </span>
             <span className="nav">
               [
-              <button style={{all: 'unset', cursor: 'pointer'}} onClick={
+              <span id="button-span" style={{cursor: 'pointer'}} onClick={
                 () => alert(
                   'To create a board, first you have to run a full node.\nYou can run a full node by simply browsing with the plebbit desktop app. After you download it, open it, wait for it loading, then click on "Home" in the top left, then "Create Community".\n\nAfter you create the community, you can go back to plebchan at any time to see it as a board by pasting its address (begins with p/12D3KooW...) in the search bar, which is in the Home.\n\nNote:\n\n- Your community will be online for as long as you leave the app open, because it functions like a server for the community.\n- The longer you leave the app open, the more data you are seeding to the protocol, which helps performance for everybody.\n - All the data in the plebbit protocol is just text, which is extremely lightweight. All media is generated by links, which is text, embedded by the clients.\n\nDownload the plebbit app here: https://github.com/plebbit/plebbit-react/releases\n\nYou can also use a CLI: https://github.com/plebbit/plebbit-cli\n\nRunning boards in the plebchan app is a planned feature.\n\n'
                   )
-              }>Create Board</button>
+              }>Create Board</span>
               ]
               [
               <Link to={`/p/${selectedAddress}/c/${selectedThread}/settings`} onClick={() => setIsSettingsOpen(true)}>Settings</Link>