Refactor DashboardWidget and LoggedInView: Update DashboardWidget to display a single news article instead of a list, enhancing user experience. Remove logout button and related functionality from LoggedInView to streamline the interface.

frontend/src/views/home/LoggedInView.vue

@@ -33,9 +33,6 @@
             Fertig
           </button>
         </template>
-        <button type="button" class="logout-btn" @click="handleLogout">
-          Logout
-        </button>
       </div>
     </header>
 
@@ -107,7 +104,6 @@
 </template>
 
 <script>
-import { mapActions } from 'vuex';
 import apiClient from '@/utils/axios.js';
 import DashboardWidget from '@/components/DashboardWidget.vue';
 
@@ -143,7 +139,6 @@ export default {
     this.loadAvailableWidgets();
   },
   methods: {
-    ...mapActions(['logout']),
     /** Counter für EP: wievieltes Widget mit gleichem Endpoint (0, 1, 2, …), damit z. B. News nicht doppelt. */
     widgetRequestCounter(index) {
       const endpoint = this.widgets[index]?.endpoint;
@@ -154,9 +149,6 @@ export default {
       }
       return count;
     },
-    handleLogout() {
-      this.logout();
-    },
     async loadAvailableWidgets() {
       try {
         const { data } = await apiClient.get('/api/dashboard/widgets');
@@ -285,20 +277,21 @@ export default {
 }
 
 .btn-edit,
-.btn-add,
 .btn-done {
   padding: 8px 14px;
-  border-radius: 6px;
-  border: 1px solid #ced4da;
-  background: #fff;
-  color: #495057;
+  border-radius: 4px;
+  border: 1px solid transparent;
+  background: var(--color-primary-orange);
+  color: var(--color-text-on-orange);
   cursor: pointer;
   font-size: 0.9rem;
 }
 
 .btn-edit:hover,
 .btn-done:hover {
-  background: #f1f3f5;
+  background: var(--color-primary-orange-light);
+  color: var(--color-text-secondary);
+  border-color: var(--color-text-secondary);
 }
 
 .widget-add-row {
@@ -308,34 +301,14 @@ export default {
 
 .widget-type-select {
   padding: 8px 12px;
-  border-radius: 6px;
-  border: 1px solid #ced4da;
+  border-radius: 4px;
+  border: 1px solid var(--color-text-secondary);
   background: #fff;
-  color: #495057;
+  color: var(--color-text-primary);
   font-size: 0.9rem;
   min-width: 180px;
 }
 
-.btn-done {
-  border-color: #198754;
-  color: #198754;
-}
-
-.logout-btn {
-  margin-left: auto;
-  background: #dc3545;
-  color: white;
-  border: none;
-  padding: 8px 16px;
-  border-radius: 6px;
-  cursor: pointer;
-  font-size: 0.9rem;
-}
-
-.logout-btn:hover {
-  background: #c82333;
-}
-
 .dashboard-message {
   padding: 16px;
   border-radius: 8px;
@@ -396,17 +369,18 @@ export default {
 .btn-remove {
   align-self: flex-start;
   padding: 6px 12px;
-  border: 1px solid #dc3545;
-  background: #fff;
-  color: #dc3545;
+  border: 1px solid transparent;
+  background: var(--color-primary-orange);
+  color: var(--color-text-on-orange);
   border-radius: 4px;
   cursor: pointer;
   font-size: 0.85rem;
 }
 
 .btn-remove:hover {
-  background: #dc3545;
-  color: #fff;
+  background: var(--color-primary-orange-light);
+  color: var(--color-text-secondary);
+  border-color: var(--color-text-secondary);
 }
 
 .dashboard-empty {