feature: Add description to circle (and subtitle)

src/locales/en.json

@@ -70,17 +70,21 @@
       "title": " Create a circle",
       "labelStatus": "Statut du circle",
       "labelName": "Circle name *",
-      "labelDescription": "Circle headline *",
+      "labelSubtitle": "Circle headline *",
+      "labelDescription": "Circle description",
+      "descriptionHelp": "You can use markdown",
       "buttonSubmit": "Save"
     },
     "edit": {
       "buttonDelete": "Remove",
       "backlink": "Back",
       "title": "Edit your circle",
-      "labelStatus": "Circle status",
+      "labelStatus": "Circle status *",
       "labelName": "Circle name *",
       "labelOwner": "Admin *",
-      "labelDescription": "Circle headline *",
+      "labelDescription": "Circle description",
+      "descriptionHelp": "You can use markdown",
+      "labelSubtitle": "Circle headline *",
       "subTitle": "Members list :",
       "tableHeader1": "Name",
       "tableHeader2": "Access",
@@ -111,6 +115,7 @@
       "buttonDelete": "Remove the circle",
       "buttonQuit": "Leave the circle",
       "buttonJoin": "Join the circle",
+      "description": "Description :",
       "subTitle": "Members :"
     }
   },

src/locales/fr.json

@@ -70,17 +70,22 @@
       "title": "Créer un cercle",
       "labelStatus": "Statut du cercle",
       "labelName": "Nom du cercle *",
-      "labelDescription": "Sous-titre du cercle *",
+      "labelSubtitle": "Sous-titre du cercle *",
+      "labelDescription": "Description du cercle",
+      "descriptionHelp": "Vous pouvez utiliser Markdown",
       "buttonSubmit": "Enregistrer"
     },
     "edit": {
       "buttonDelete": "Retirer",
       "backlink": "Retour",
       "title": "Modifie ton cercle",
-      "labelStatus": "Statut du cercle",
+      "labelStatus": "Statut du cercle *",
       "labelName": "Nom du cercle *",
       "labelOwner": "Administrateur ou administratrice *",
-      "labelDescription": "Sous-titre du cercle *",
+      "labelDescription": "Description du cercle",
+      "descriptionHelp": "Vous pouvez utiliser Markdown",
+      "labelSubtitle": "Sous-titre du cercle *",
+      "labelStatus": "Statut *",
       "subTitle": "Liste des membres :",
       "tableHeader1": "Nom",
       "tableHeader2": "Accès",
@@ -111,6 +116,7 @@
       "buttonDelete": "Supprimer le cercle",
       "buttonQuit": "Quitter le cercle",
       "buttonJoin": "Rejoindre le cercle",
+      "description": "Description :",
       "subTitle": "Membres :"
     }
   },

src/views/page-circle.pug

@@ -4,10 +4,10 @@
       solid-ac-checker.flex.space-between(permission='acl:Read', bind-resources)
         solid-display(
           bind-resources
-          fields='name, description'
+          fields='name, subtitle'
 
           class-name='h1-like'
-          class-description='h1-aside description'
+          class-subtitle='h1-aside description'
         )
         button.mobile-sidebar-button.jsMobileSidebarOpenButton.icon-arrow-left-circle(data-trans='circle.menuRight.buttonMobile')
     div.content-box__height

src/views/partials/admin/page-admin-circles-create.pug

@@ -12,25 +12,31 @@ div.content-box__info.flex
   solid-form.form.button-register(
     data-src=`${endpoints.circles || endpoints.post.circles}`
 
-    fields='status, name, description'
+    fields='line-1(status), line-2(name, subtitle), description, help'
     required-status
     required-name
-    required-description
+    required-subtitle
     loader-id='loader-circles-create'
 
-    class-status='form-label is-light is-full-width color'
-    class-name='form-label is-light is-full-width input-text-like'
+    class-status='form-label is-light is-half-width color'
+    class-name='form-label is-light is-half-width input-text-like'
+    class-subtitle='form-label is-light is-half-width input-text-like'
     class-description='form-label is-light is-full-width input-text-like'
+    class-help='is-small'
 
     label-status=''
     label-name=''
+    label-subtitle=''
     label-description=''
+    value-help=''
 
     widget-status='hubl-status'
-    
+    widget-description='solid-form-textarea-label'
+    widget-help='solid-display-value'
+
     next='circle'
 
     submit-button=''
     
-    data-trans='label-status=circle.create.labelStatus;label-name=circle.create.labelName;label-description=circle.create.labelDescription;submit-button=circle.create.buttonSubmit'
+    data-trans='label-status=circle.create.labelStatus;label-name=circle.create.labelName;label-description=circle.create.labelDescription;submit-button=circle.create.buttonSubmit;label-subtitle=circle.create.labelSubtitle;value-help=circle.create.descriptionHelp'
   )

src/views/partials/circle/page-circle-edit.pug

@@ -2,7 +2,7 @@ div.content-box__info
 
   solid-widget(name="circle-edit-members-delete")
     template
-      solid-ac-checker(permission="acl:Delete" data-src="${src}")
+      solid-ac-checker(permission="acl:Delete", data-src="${src}")
         solid-delete(
           class='button text-bold text-uppercase reversed button-secondary bordered with-icon icon-close'
           data-src="${src}"
@@ -24,25 +24,30 @@ div.content-box__info
     solid-form.form.button-register(
       bind-resources
 
-      fields='status, line-1(name, owner), description'
+      fields='line-1(name, subtitle), description, help, line-2(status, owner)'
       required-status
       required-name
       required-owner
-      required-description
+      required-subtitle
       range-owner=`${endpoints.users || endpoints.get.users}`
 
-      label-status=''
-      widget-status='hubl-status'
-
       label-name=''
       label-owner=''
       label-description=''
+      label-subtitle=''
+      label-status=''
+      value-help=''
 
       class-name='form-label is-light is-half-width input-text-like'
       class-owner='form-label is-light is-half-width member-select color'
+      class-subtitle='form-label is-light is-half-width input-text-like'
+      class-status='form-label is-light is-half-width member-select color'
       class-description='form-label is-light is-full-width input-text-like'
-      class-status='form-label is-light is-full-width member-select color'
+      class-help='is-small'
 
+      widget-status='hubl-status'
+      widget-description='solid-form-textarea-label'
+      widget-help='solid-display-value'
       widget-owner='solid-form-dropdown-autocompletion-label'
 
       partial=''
@@ -50,7 +55,7 @@ div.content-box__info
       submit-button='Enregistrer'
       next='circle-information'
 
-      data-trans='label-name=circle.edit.labelStatus;label-name=circle.edit.labelName;label-owner=circle.edit.labelOwner;label-description=circle.edit.labelDescription;submit-button=circle.edit.buttonSubmit'
+      data-trans='label-name=circle.edit.labelStatus;label-name=circle.edit.labelName;label-owner=circle.edit.labelOwner;label-description=circle.edit.labelDescription;submit-button=circle.edit.buttonSubmit;label-subtitle=circle.edit.labelSubtitle;value-help=circle.edit.descriptionHelp;label-status=circle.edit.labelStatus'
     )
 
   h2(data-trans='circle.edit.subTitle')

src/views/partials/circle/page-circle-profile.pug

@@ -35,6 +35,16 @@ solid-router(default-route='circle-profile', hidden)
         solid-ac-checker(no-permission='acl:Delete', bind-resources)
           solid-link(class='button mobile-full-width text-bold text-uppercase reversed button-primary bordered with-icon icon-pencil' next='circle-edit' bind-resources data-trans='circle.profile.buttonAdd')
 
+    solid-display.mobile-margin__bottom(
+      bind-resources
+      fields='label-description, description'
+
+      value-label-description=''
+      data-trans='value-label-description=circle.profile.description',
+      class-label-description='h2-like'
+
+      widget-description='solid-display-value-markdown'
+    )
 
     div.flex.desktop-button__end
       solid-ac-checker(permission='acl:Delete', bind-resources)