Merge pull request #41 from poap-xyz/release/v1.2.3

Release v1.2.3
poap-xyz · May 25, 2023 · 6cc600e · 6cc600e
2 parents 172da9f + 3850e3f
commit 6cc600e
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 36 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@poap-xyz/poap-family",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "author": {
     "name": "POAP",
     "url": "https://poap.xyz"

diff --git a/src/components/EventCount.js b/src/components/EventCount.js
@@ -1,22 +1,11 @@
 import TokenImage from './TokenImage'
 import '../styles/event-count.css'
 
-function EventCount({ event, count, linkToGallery = false }) {
+function EventCount({ event, count, size = 64 }) {
   return (
     <div className="event-count">
-      {linkToGallery &&
-        <a href={`https://poap.gallery/event/${event.id}`} title={event.name}>
-          <TokenImage event={event} size={64} />
-          <span className="count">{count}</span>
-        </a>
-      }
-      {!linkToGallery &&
-        // eslint-disable-next-line jsx-a11y/anchor-is-valid
-        <a id={`event-${event.id}`} title={event.name}>
-          <TokenImage event={event} size={64} />
-          <span className="count">{count}</span>
-        </a>
-      }
+      <TokenImage event={event} size={size} />
+      <span className="count">{count}</span>
     </div>
   )
 }

diff --git a/src/components/InCommon.js b/src/components/InCommon.js
@@ -142,20 +142,25 @@ function InCommon({
         <div className={`in-common-events${showAll ? ' show-all' : ''}`}>
           {inCommonEntries.map(
             ([eventId, addresses]) => (
-              <button
-                key={eventId}
-                className={`event-button${activeEventIds.indexOf(eventId) !== -1 ? ' selected' : ''}${showCount > 0 && showCount === addresses.length ? ' perfect' : ''}`}
-                onClick={() => toggleActiveEventId(eventId)}
+              <div
+                className={`in-common-event${activeEventIds.indexOf(eventId) !== -1 ? ' selected' : ''}${showCount > 0 && showCount === addresses.length ? ' perfect' : ''}`}
+                title={events[eventId].name}
               >
-                {showCount > 0 && showCount === addresses.length
-                  ? (
-                    <div className="event-image">
-                      <TokenImage event={events[eventId]} size={64} />
-                    </div>
-                  )
-                  : <EventCount event={events[eventId]} count={addresses.length} />
-                }
-              </button>
+                <button
+                  key={eventId}
+                  className="event-button"
+                  onClick={() => toggleActiveEventId(eventId)}
+                >
+                  {showCount > 0 && showCount === addresses.length
+                    ? (
+                      <div className="event-image">
+                        <TokenImage event={events[eventId]} size={64} />
+                      </div>
+                    )
+                    : <EventCount event={events[eventId]} count={addresses.length} size={64} />
+                  }
+                </button>
+              </div>
             )
           )}
           {hasMore && (

diff --git a/src/styles/in-common.css b/src/styles/in-common.css
@@ -1,22 +1,29 @@
 .in-common .event-button {
   background: transparent;
+  border-width: 0;
+  cursor: pointer;
+}
+
+.in-common .in-common-event {
+  display: inline-block;
   border: .1rem solid transparent;
   border-radius: 12px;
-  cursor: pointer;
-  margin: .1rem;
+  margin: .2rem;
+  overflow-wrap: break-word;
+  width: 72px;
 }
 
-.in-common .show-all .event-button.perfect {
+.in-common .show-all .in-common-event.perfect {
   background-color: #eee;
   border-color: #cdcdcd;
 }
 
-.in-common .event-button.selected {
+.in-common .in-common-event.selected {
   background-color: #7d73e2 !important;
   border-color: #473e6b !important;
 }
 
-.in-common .event-button .event-image {
+.in-common .in-common-event .event-image {
   display: inline-block;
   margin: 4px;
   width: 64px;

diff --git a/src/styles/page.css b/src/styles/page.css
@@ -30,11 +30,10 @@
 @media only screen and (min-width: 1024px) {
   .page-aside {
     position: inherit;
-    margin-top: .5rem;
-    margin-right: 1rem;
+    margin: .5rem 1rem 0 0;
   }
   .page-content {
-    width: calc(100% - 4.2rem);
+    width: calc(100% - 5.2rem);
   }
   .logo-menu-card {
     background-color: transparent !important;