fix: UI - styles for task distribution section in settings (#5310)

- [x] Fix missing styles in distribution task section in setting page
- [x] Update translation for the error toast

argilla-frontend/components/features/annotation/settings/SettingsInfoReadOnly.vue

@@ -26,13 +26,13 @@
         v-text="$t('taskDistribution')"
       />
 
-      <div class="form_group">
+      <div class="form-group">
         <label v-text="$t('minimumSubmittedResponses')" />
         <span class="info-icon" :data-title="$t('taskDistributionTooltip')">
           <svgicon name="info" width="20" height="20"></svgicon>
         </span>
         <span
-          class="form_group__input--read-only"
+          class="form-group__input--read-only"
           v-text="settings.dataset.distribution.minSubmitted"
         />
       </div>
@@ -94,4 +94,33 @@ export default {
     margin: 0;
   }
 }
+
+.form-group {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  gap: $base-space;
+  &__input--read-only {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    width: 80px;
+    height: 24px;
+    padding: $base-space * 2;
+    border: 1px solid $black-20;
+    border-radius: $border-radius;
+    background: $black-4;
+    border: 1px solid $black-20;
+    opacity: 0.6;
+  }
+}
+.info-icon {
+  color: $black-37;
+  margin-right: $base-space * 2;
+  &[data-title] {
+    position: relative;
+    overflow: visible;
+    @include tooltip-mini("top", $base-space);
+  }
+}
 </styles>

argilla-frontend/translation/en.js

@@ -238,7 +238,7 @@ export default {
       },
       update_distribution_with_existing_responses: {
         message:
-          "Distribution settings cannot be modified for a published dataset",
+          "This dataset has responses. Task distribution settings cannot be modified",
       },
     },
     http: {