changes

app/assets/styles/main.scss

@@ -25,3 +25,40 @@
     }
   }
 }
+
+// Tooltip Styles
+.tooltiptext {
+  visibility: hidden;
+  opacity: 0;
+  background-color: var(--bulma-primary-95);
+  color: var(--bulma-primary-bold);
+  border-radius: 6px;
+  position: absolute;
+  margin-left: 0px;
+  z-index: 999;
+  bottom: 110%;
+  transition: opacity 0.3s;
+  padding: 6px 9px;
+  font-size: 13px;
+  pointer-events: none;
+  box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.1);
+}
+
+.to-left {
+  right: 30px;
+}
+
+@mixin tooltipshow() {
+  visibility: visible;
+  opacity: 1;
+  position: absolute;
+  min-width: 300px;
+  z-index: 999;
+}
+
+.control:hover .tooltiptext {
+  @include tooltipshow();
+}
+.control:hover .tooltiptext .to-left {
+  @include tooltipshow();
+}

app/assets/styles/overrides-components.scss

@@ -10,6 +10,11 @@
   --bulma-hr-background-color: var(--bulma-grey-90);
 }
 
+.title,
+.subtitle {
+  --bulma-subtitle-weight: var(--bulma-weight-semibold);
+}
+
 .textarea,
 .input {
   box-shadow: none;
@@ -30,6 +35,22 @@
 .modal-card-head {
   --bulma-shadow: 0 0.125em 0 0 hsla(var(--bulma-shadow-h), var(--bulma-shadow-s), var(--bulma-shadow-l), 0.1);
 }
+
+.label {
+  color: inherit;
+}
+
+.control {
+  --bulma-input-icon-color: var(--bulma-text-60);
+}
+
+.control,
+.input,
+.select,
+.textarea {
+  --bulma-input-placeholder-color: hsla(var(--bulma-text-h), var(--bulma-text-s), var(--bulma-text-strong-l), 0.5);
+}
+
 // might break lots of stuff
 // .skeleton-block:not(:last-child), .media:not(:last-child), .level:not(:last-child), .fixed-grid:not(:last-child), .grid:not(:last-child), .tabs:not(:last-child), .pagination:not(:last-child), .message:not(:last-child), .card:not(:last-child), .breadcrumb:not(:last-child), .field:not(:last-child), .file:not(:last-child), .title:not(:last-child), .subtitle:not(:last-child), .tags:not(:last-child), .table:not(:last-child), .table-container:not(:last-child), .progress:not(:last-child), .notification:not(:last-child), .content:not(:last-child), .buttons:not(:last-child), .box:not(:last-child), .block:not(:last-child) {
 //   margin-bottom: inherit;