chore(chatbar): disabling the chatbar when it's loading instead of di…

…splaying different text and not being multi line by default (#1402)

common/locales/en-US/main.ftl

@@ -72,6 +72,7 @@ messages = Messages
     .replying = Replying to:
     .react = React
     .reply = Reply
+    .loading = Loading...
     .say-something-placeholder = Say Something...
     .user-sent-message = { $user } sent you a message.
     .unknown-sent-message = someone sent you a message.

kit/src/elements/textarea/style.scss

@@ -4,6 +4,7 @@ textarea {
 	width: 100%;
 	height: "auto";
 	max-height: 250px; //Maybe make max variable?
+	min-height: 22px;
 	margin: 9px 0;
 	&.disabled {
 		cursor: not-allowed;

kit/src/layout/chatbar/mod.rs

@@ -154,7 +154,7 @@ pub fn Chatbar<'a>(cx: Scope<'a, Props<'a>>) -> Element<'a> {
                     placeholder: cx.props.placeholder.clone(),
                     ignore_focus: cx.props.ignore_focus,
                     show_char_counter: true,
-                    value: if cx.props.is_disabled { get_local_text("messages.not-friends")} else { cx.props.value.clone().unwrap_or_default()},
+                    value: if cx.props.is_disabled { get_local_text("messages.loading")} else { cx.props.value.clone().unwrap_or_default()},
                     onchange: move |(v, _)| cx.props.onchange.call(v),
                     onreturn: move |(v, is_valid, _)| {
                         if let Some(i) = selected_emoji.write_silent().take() {

kit/src/style.scss

@@ -239,7 +239,7 @@ pre code {
   --text-color-bright: #ffffff;
   --text-color-link: #ff860d;
   --text-selection: #e0e0e0;
-  --placeholder: #fff;
+  --placeholder: #bcbcbc;
   --primary: #fcfbf4;
   --primary-dark: color-mix(in srgb, var(--primary) 50%, black);
   --primary-light: color-mix(in srgb, var(--primary) 50%, white);