budgeting/ListItemBadges: rm spaced span as produced empty elements a…

…nd replaced span badges with div badges
liqd · Nov 24, 2022 · 417cdf7 · 417cdf7
1 parent 728083b
commit 417cdf7
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 27 deletions.
diff --git a/meinberlin/apps/budgeting/assets/ListItemBadges.jsx b/meinberlin/apps/budgeting/assets/ListItemBadges.jsx
@@ -1,5 +1,4 @@
 import React from 'react'
-import { SpacedSpan } from './SpacedSpan'
 import django from 'django'
 
 const translated = {
@@ -30,24 +29,24 @@ export const ListItemBadges = props => {
     <div className="list-item__labels">
       {props.badges.map((badge, idx) => {
         return (
-          <SpacedSpan
+          <div
             key={'badge_' + idx}
             className={getClass(badge)}
           >
             {hasPointLabelIcon(badge[0])}
             {badge[1]}
-          </SpacedSpan>
+          </div>
         )
       })}
       {props.numOfMoreBadges > 0 &&
-        <SpacedSpan className="label__link label--big">
+        <div className="label__link label--big">
           <a
             href={props.proposalUrl}
             className="list-item__link"
           >
             {props.numOfMoreBadges + ' ' + translated.more}
           </a>
-        </SpacedSpan>}
+        </div>}
     </div>
   )
 }
diff --git a/meinberlin/apps/budgeting/assets/SpacedSpan.jsx b/meinberlin/apps/budgeting/assets/SpacedSpan.jsx
diff --git a/meinberlin/apps/budgeting/assets/__tests__/SpacedSpan.jest.jsx b/meinberlin/apps/budgeting/assets/__tests__/SpacedSpan.jest.jsx
diff --git a/meinberlin/assets/scss/components/_list_item.scss b/meinberlin/assets/scss/components/_list_item.scss
@@ -69,7 +69,9 @@
     @include clearfix;
     margin: 0 0 0.4rem;
 
+    > div.label,
     > span.label {
+        margin-left: 0.2 * $spacer;
         overflow: hidden;
         max-width: 40ch;
         text-overflow: ellipsis;