Rename message fix layout color

source/Component/AttrInput/AttrInput.scss

@@ -11,6 +11,7 @@ div.attr-input {
 	div.input-intro {
 		width: 50%;
 		height: 100%;
+        min-height: $line-min-height;
 		max-width: 220px;
 		display: flex;
 		align-items: center;

source/Component/ColorInput/ColorInput.scss

@@ -12,6 +12,7 @@ div.color-input-root {
 		width: 50%;
 		height: 100%;
 		max-width: 220px;
+        min-height: $line-min-height;
 		display: flex;
 		align-items: center;
         padding-right: 5px;

source/Component/ErrorMessage/ErrorMessage.scss

@@ -1,3 +0,0 @@
-div.panel-error-message {
-    padding-top: 5px;
-}

source/Component/ErrorMessage/ErrorMessage.tsx

@@ -1,17 +0,0 @@
-import { AllI18nKeys, Localization } from "@Component/Localization/Localization";
-import { FunctionComponent } from "react";
-import "./ErrorMessage.scss";
-
-interface IErrorMessageProps {
-    i18nKey: AllI18nKeys;
-    options?: Record<string, string>;
-    className?: string;
-}
-
-const ErrorMessage: FunctionComponent<IErrorMessageProps> = (props) => {
-    return <div className={["panel-error-message", props.className].filter(c => !!c).join(" ")}>
-        <Localization i18nKey={props.i18nKey} options={props.options}/>
-    </div>
-}
-
-export { ErrorMessage };

source/Component/LabelList/LabelList.tsx

@@ -2,7 +2,6 @@ import { Component, RefObject } from "react";
 import { Label } from "@Model/Label";
 import { Icon } from "@fluentui/react";
 import { useSetting, IMixinSettingProps, Themes } from "@Context/Setting";
-import { ErrorMessage } from "@Component/ErrorMessage/ErrorMessage";
 import "./LabelList.scss";
 
 interface ILabelListProps {

source/Component/LabelPicker/LabelPicker.scss

@@ -12,6 +12,7 @@ div.label-picker-root {
     div.input-intro {
 		width: 50%;
 		height: 100%;
+		min-height: $line-min-height;
 		max-width: 220px;
 		display: flex;
 		align-items: center;

source/Component/Message/Message.scss

@@ -0,0 +1,20 @@
+div.panel-error-message {
+    transition: none !important;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    min-height: 26px;
+    display: flex;
+    align-items: center;
+
+    span {
+        display: block;
+    }
+}
+
+div.panel-error-message.title {
+    padding: 15px 0 5px 0;
+}
+
+div.panel-error-message.title.first {
+    padding: 5px 0 5px 0;
+}

source/Component/Message/Message.tsx

@@ -0,0 +1,42 @@
+import { AllI18nKeys, I18N } from "@Component/Localization/Localization";
+import { useSetting, IMixinSettingProps, Themes, Language } from "@Context/Setting";
+import { FunctionComponent } from "react";
+import "./Message.scss";
+
+interface IMessageProps {
+    i18nKey: AllI18nKeys;
+    options?: Record<string, string>;
+    className?: string;
+    isTitle?: boolean;
+    first?: boolean;
+}
+
+const MessageView: FunctionComponent<IMessageProps & IMixinSettingProps> = (props) => {
+
+    let theme = props.setting ? props.setting.themes : Themes.dark;
+    let language: Language = props.setting ? props.setting.language : "EN_US";
+    let classList: string[] = [
+        "panel-error-message",
+        theme === Themes.dark ? "dark" : "light",
+    ];
+
+    if (props.first) {
+        classList.push("first");
+    }
+
+    if (props.isTitle) {
+        classList.push("title");
+        classList.push("font-lvl3");
+    }
+
+    if (props.className) {
+        classList.push(props.className);
+    }
+
+    return <div className={classList.join(" ")}>
+        <span className={language}>{I18N(language, props.i18nKey, props.options)}</span>
+    </div>
+}
+
+const Message = useSetting(MessageView);
+export { Message };

source/Component/PickerList/PickerList.scss

@@ -1,5 +1,6 @@
 div.picker-list-root {
 	max-width: 200px;
+	height: 100%;
 	padding: 0px;
 	margin: 0px;
 	overflow-y: auto;
@@ -45,7 +46,7 @@ div.picker-list-root {
 
 	span.picker-list-nodata {
 		display: inline-block;
-		padding: 5px;
+		padding: 8px;
 	}
 }
 
@@ -62,7 +63,7 @@ div.picker-list-root::-webkit-scrollbar {
 div.picker-list-root::-webkit-scrollbar-thumb {
 	/*滚动条里面小方块*/
 	border-radius: 8px;
-	background-color: rgba($color: #000000, $alpha: .1);
+	background-color: rgba($color: #000000, $alpha: .2);
 }
 
 div.picker-list-root::-webkit-scrollbar-track {

source/Component/TogglesInput/TogglesInput.scss

@@ -12,6 +12,7 @@ div.toggles-input {
 		width: 50%;
 		height: 100%;
 		max-width: 220px;
+        min-height: $line-min-height;
 		display: flex;
 		align-items: center;
         padding-right: 5px;