From dfa794a90ac54e1d98da9166be65f43699be3636 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Tue, 6 Dec 2022 13:09:14 +0100
Subject: [PATCH] Contributions list style edited

---
 .../src/assets/scss/gradido-template.scss     | 10 +++++++---
 .../Contributions/ContributionListItem.vue    | 20 +++++++++++++------
 .../GddSend/TransactionConfirmationSend.vue   |  2 +-
 .../src/components/Overview/CommunityNews.vue |  1 +
 frontend/src/components/Transaction.vue       |  4 ++--
 .../TransactionRows/CollapseIcon.vue          |  1 +
 .../Transactions/TransactionCreation.vue      |  2 +-
 .../Transactions/TransactionLinkSummary.vue   |  2 +-
 .../Transactions/TransactionReceive.vue       |  2 +-
 .../Transactions/TransactionSend.vue          |  2 +-
 frontend/src/locales/de.json                  |  2 +-
 frontend/src/locales/en.json                  |  2 +-
 12 files changed, 32 insertions(+), 18 deletions(-)

diff --git a/frontend/src/assets/scss/gradido-template.scss b/frontend/src/assets/scss/gradido-template.scss
index bc02ae4a2..ed719bff7 100644
--- a/frontend/src/assets/scss/gradido-template.scss
+++ b/frontend/src/assets/scss/gradido-template.scss
@@ -9,9 +9,9 @@ body {
   cursor: pointer;
 }
 
-// .bg-default {
-//   background-color: rgba(245 245 245 / 75%) !important;
-// }
+.bg-gray300 {
+  background-color: $gray-300
+}
 
 .shadow-default {
   box-shadow: rgb(0 0 0 / 14%) 0 4px 10px;
@@ -222,6 +222,10 @@ a:hover,
   border-color: #047006 !important;
 }
 
+.gradido-global-border-color-danger {
+  border-color: rgb(140 5 5) !important;
+}
+
 .gradido-global-color-gray {
   color: #858383;
 }
diff --git a/frontend/src/components/Contributions/ContributionListItem.vue b/frontend/src/components/Contributions/ContributionListItem.vue
index 62a8089c6..a1aeec7f5 100644
--- a/frontend/src/components/Contributions/ContributionListItem.vue
+++ b/frontend/src/components/Contributions/ContributionListItem.vue
@@ -1,5 +1,8 @@
 <template>
-  <div class="contribution-list-item bg-white appBoxShadow gradido-border-radius p-3">
+  <div
+    class="contribution-list-item bg-white appBoxShadow gradido-border-radius p-3"
+    :class="state === 'IN_PROGRESS' ? 'border gradido-global-border-color-danger' : ''"
+  >
     <slot>
       <div class="">
         <b-row>
@@ -8,12 +11,12 @@
               v-if="firstName"
               :text="avatarText"
               :badge-variant="variant"
-              size="4em"
+              size="3em"
               class="font-weight-bold"
             >
               <template #badge><b-icon :icon="icon"></b-icon></template>
             </b-avatar>
-            <b-avatar v-else :icon="icon" :variant="variant" size="4em"></b-avatar>
+            <b-avatar v-else :icon="icon" :variant="variant" size="3em"></b-avatar>
           </b-col>
           <b-col>
             <div v-if="firstName" class="mr-3 font-weight-bold">{{ firstName }} {{ lastName }}</div>
@@ -38,7 +41,12 @@
             <collapse-icon class="text-right" :visible="visible" v-if="messagesCount > 0" />
           </b-col>
         </b-row>
-        <b-row class="mt-2">
+        <b-row
+          v-if="
+            (!['CONFIRMED', 'DELETED'].includes(state) && !allContribution) || messagesCount > 0
+          "
+          class="mt-4 bg-gray300 p-4"
+        >
           <b-col>
             <div
               v-if="!['CONFIRMED', 'DELETED'].includes(state) && !allContribution"
@@ -49,7 +57,7 @@
               {{ $t('delete') }}
             </div>
           </b-col>
-          <b-col>
+          <b-col class="text-center">
             <div
               v-if="!['CONFIRMED', 'DELETED'].includes(state) && !allContribution"
               class="test-edit-contribution pointer mr-3"
@@ -67,7 +75,7 @@
             </div>
           </b-col>
 
-          <b-col>
+          <b-col class="text-right">
             <div v-if="messagesCount > 0" class="pointer">
               <b-icon icon="chat-dots" @click="visible = !visible"></b-icon>
               {{ $t('moderatorChat') }}
diff --git a/frontend/src/components/GddSend/TransactionConfirmationSend.vue b/frontend/src/components/GddSend/TransactionConfirmationSend.vue
index c9653c0ea..86c7d3d78 100644
--- a/frontend/src/components/GddSend/TransactionConfirmationSend.vue
+++ b/frontend/src/components/GddSend/TransactionConfirmationSend.vue
@@ -4,7 +4,7 @@
       <div class="h3 mb-4">{{ $t('form.send_check') }}</div>
       <b-row class="mt-5">
         <b-col cols="2">
-          <b-avatar :text="avatarText" variant="success" size="4em"></b-avatar>
+          <b-avatar :text="avatarText" variant="success" size="3em"></b-avatar>
         </b-col>
         <b-col>
           <div class="h4">
diff --git a/frontend/src/components/Overview/CommunityNews.vue b/frontend/src/components/Overview/CommunityNews.vue
index c5ae9bb3c..c7eabc2ef 100644
--- a/frontend/src/components/Overview/CommunityNews.vue
+++ b/frontend/src/components/Overview/CommunityNews.vue
@@ -31,6 +31,7 @@ export default {
 </script>
 <style scoped>
 .card {
+  height: 400px;
   background-attachment: absolute;
   background-position: center;
   background-repeat: no-repeat;
diff --git a/frontend/src/components/Transaction.vue b/frontend/src/components/Transaction.vue
index a31c9e6e7..21c134ed3 100644
--- a/frontend/src/components/Transaction.vue
+++ b/frontend/src/components/Transaction.vue
@@ -6,7 +6,7 @@
           <b-avatar
             :icon="getLinesByType.icon"
             variant="light"
-            size="4em"
+            size="3em"
             :class="getLinesByType.iconclasses"
           ></b-avatar>
         </b-col>
@@ -26,7 +26,7 @@
         </b-col>
         <b-col cols="3">
           <div class="small mt-2">{{ $t('gdt.credit') }}</div>
-          <div class="">{{ getLinesByType.credittext }}</div>
+          <div class="font-weight-bold">{{ getLinesByType.credittext }}</div>
         </b-col>
         <b-col cols="1"><collapse-icon class="text-right" :visible="visible" /></b-col>
       </b-row>
diff --git a/frontend/src/components/TransactionRows/CollapseIcon.vue b/frontend/src/components/TransactionRows/CollapseIcon.vue
index ac24d0b0c..2338e87cb 100644
--- a/frontend/src/components/TransactionRows/CollapseIcon.vue
+++ b/frontend/src/components/TransactionRows/CollapseIcon.vue
@@ -3,6 +3,7 @@
     <b-icon
       :icon="visible ? 'arrow-up-circle' : 'arrow-down-circle'"
       :class="visible ? 'text-black' : 'text-muted'"
+      class="h1"
     />
   </div>
 </template>
diff --git a/frontend/src/components/Transactions/TransactionCreation.vue b/frontend/src/components/Transactions/TransactionCreation.vue
index 7e9698296..d64948716 100644
--- a/frontend/src/components/Transactions/TransactionCreation.vue
+++ b/frontend/src/components/Transactions/TransactionCreation.vue
@@ -2,7 +2,7 @@
   <div class="transaction-slot-creation">
     <b-row @click="visible = !visible" class="">
       <b-col cols="2">
-        <b-avatar icon="gift" variant="success" size="4em"></b-avatar>
+        <b-avatar icon="gift" variant="success" size="3em"></b-avatar>
       </b-col>
       <b-col>
         <div>{{ linkedUser.firstName }} {{ linkedUser.lastName }}</div>
diff --git a/frontend/src/components/Transactions/TransactionLinkSummary.vue b/frontend/src/components/Transactions/TransactionLinkSummary.vue
index 20fd01383..7e2e72d58 100644
--- a/frontend/src/components/Transactions/TransactionLinkSummary.vue
+++ b/frontend/src/components/Transactions/TransactionLinkSummary.vue
@@ -2,7 +2,7 @@
   <div class="transaction-slot-link">
     <b-row @click="showTransactionLinks()">
       <b-col cols="2">
-        <b-avatar icon="link" variant="danger" size="4em"></b-avatar>
+        <b-avatar icon="link" variant="light" size="3em"></b-avatar>
       </b-col>
       <b-col>
         <div>{{ $t('gdd_per_link.links_sum') }}</div>
diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index 5f0221ada..9bcb1d052 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -2,7 +2,7 @@
   <div class="transaction-slot-receive">
     <b-row @click="visible = !visible" class="">
       <b-col cols="2">
-        <b-avatar :text="avatarText" variant="success" size="4em"></b-avatar>
+        <b-avatar :text="avatarText" variant="success" size="3em"></b-avatar>
       </b-col>
       <b-col>
         <div>
diff --git a/frontend/src/components/Transactions/TransactionSend.vue b/frontend/src/components/Transactions/TransactionSend.vue
index e593b95dd..7aa623479 100644
--- a/frontend/src/components/Transactions/TransactionSend.vue
+++ b/frontend/src/components/Transactions/TransactionSend.vue
@@ -2,7 +2,7 @@
   <div class="transaction-slot-send">
     <b-row @click="visible = !visible" class="">
       <b-col cols="2">
-        <b-avatar :text="avatarText" variant="danger" size="4em"></b-avatar>
+        <b-avatar :text="avatarText" variant="danger" size="3em"></b-avatar>
       </b-col>
       <b-col>
         <div>
diff --git a/frontend/src/locales/de.json b/frontend/src/locales/de.json
index 6ecf9c4be..6fef428d6 100644
--- a/frontend/src/locales/de.json
+++ b/frontend/src/locales/de.json
@@ -309,7 +309,7 @@
     }
   },
   "success": "Erfolg",
-  "lastMonth":"letzter Monat",
+  "lastMonth": "letzter Monat",
   "time": {
     "days": "Tage",
     "hours": "Stunden",
diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json
index 9e31fdf8a..0321e61f4 100644
--- a/frontend/src/locales/en.json
+++ b/frontend/src/locales/en.json
@@ -29,7 +29,7 @@
     "openContributionLinkText": "The following {count} automatic creations are currently provided by the \"{name}\" community.",
     "submitContribution": "Submit contribution"
   },
-  "lastMonth":"Last month",
+  "lastMonth": "Last month",
   "contact": "Contact",
   "contribution": {
     "activity": "Activity",