Use notice theme for Vue compiler warning

getkirby · Feb 7, 2025 · da766cb · da766cb
1 parent 74e2578
commit da766cb
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 10 deletions.
diff --git a/config/areas/system/views.php b/config/areas/system/views.php
@@ -12,6 +12,7 @@
 			$updateStatus = $system->updateStatus();
 			$license      = $system->license();
 			$debugMode    = $kirby->option('debug', false);
+			$isLocal      = $system->isLocal();
 
 			$environment = [
 				[
@@ -67,9 +68,11 @@
 
 			if ($debugMode === true) {
 				$security[] = [
-					'id'   => 'debug',
-					'text' => I18n::translate('system.issues.debug'),
-					'link' => 'https://getkirby.com/security/debug'
+					'id'    => 'debug',
+					'icon'  => $isLocal ? 'info' : 'alert',
+					'text'  => I18n::translate('system.issues.debug'),
+					'theme' => $isLocal ? 'info' : 'negative',
+					'link'  => 'https://getkirby.com/security/debug'
 				];
 			}
 
@@ -83,9 +86,10 @@
 
 			if ($kirby->option('panel.vue.compiler', null) === null) {
 				$security[] = [
-					'id'   => 'vue-compiler',
-					'text' => I18n::translate('system.issues.vue.compiler'),
-					'link' => 'https://getkirby.com/security/vue-compiler'
+					'id'    => 'vue-compiler',
+					'link'  => 'https://getkirby.com/security/vue-compiler',
+					'text'  => I18n::translate('system.issues.vue.compiler'),
+					'theme' => 'notice'
 				];
 			}
 

diff --git a/panel/src/components/Collection/Items.vue b/panel/src/components/Collection/Items.vue
@@ -38,7 +38,7 @@
 					:layout="layout"
 					:link="link ? item.link : false"
 					:sortable="sortable && item.sortable"
-					:theme="theme"
+					:theme="item.theme ?? theme"
 					:width="item.column"
 					@click="$emit('item', item, itemIndex)"
 					@drag="onDragStart($event, item.dragText)"

diff --git a/panel/src/components/Views/System/SystemSecurity.vue b/panel/src/components/Views/System/SystemSecurity.vue
@@ -13,11 +13,11 @@
 		<k-items
 			:items="
 				issues.map((issue) => ({
-					// give each message an image prop unless it already has one
+					theme: 'negative',
 					image: {
-						back: 'var(--color-red-200)',
+						back: 'var(--theme-color-200)',
 						icon: issue.icon ?? 'alert',
-						color: 'var(--color-red)'
+						color: 'var(--theme-color-icon)'
 					},
 					target: '_blank',
 					...issue