feat(messagebar): tweak placeholder colors

nolimits4web · nolimits4web · commit 29849ff07bc3 · 2023-04-12T14:58:27.000+03:00
diff --git a/src/core/components/messagebar/messagebar-vars.less b/src/core/components/messagebar/messagebar-vars.less
@@ -33,13 +33,15 @@
   --f7-messagebar-attachment-height: 155px;
   --f7-messagebar-attachment-landscape-height: 120px;
   .light-vars({
+    --f7-messagebar-textarea-placeholder-color: rgba(0,0,0,0.4);
     --f7-messagebar-textarea-text-color: #000;
     --f7-messagebar-textarea-border: 1px solid #c8c8cd;
     --f7-messagebar-attachments-border-color: #c8c8cd;
     --f7-messagebar-bg-color: #fff;
     --f7-messagebar-bg-color-rgb: 255, 255, 255;
   });
   .dark-vars({
+    --f7-messagebar-textarea-placeholder-color: rgba(255, 255, 255, 0.4);
     --f7-messagebar-textarea-text-color: #fff;
     --f7-messagebar-textarea-border: 1px solid var(--f7-bars-border-color);
     --f7-messagebar-attachments-border-color: var(--f7-bars-border-color);
@@ -63,6 +65,7 @@
   --f7-messagebar-attachments-border-color: transparent;
 });
 .md-color-vars({
+  --f7-messagebar-textarea-placeholder-color: var(--f7-md-on-surface-variant);
   --f7-messagebar-textarea-bg-color: var(--f7-md-surface-variant);
   --f7-messagebar-bg-color: var(--f7-md-surface);
   --f7-messagebar-textarea-text-color: var(--f7-md-on-surface);
diff --git a/src/core/components/messagebar/messagebar.less b/src/core/components/messagebar/messagebar.less
@@ -58,6 +58,9 @@
     font-size: var(--f7-messagebar-textarea-font-size);
     line-height: var(--f7-messagebar-textarea-line-height);
     border: var(--f7-messagebar-textarea-border);
+    &::placeholder {
+      color: var(--f7-messagebar-textarea-placeholder-color);
+    }
   }
   a.link {
     align-self: flex-end;
