fixes ui base components

claroline · Jan 27, 2021 · d4a9845 · d4a9845
1 parent 89334e9
commit d4a9845
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 22 deletions.
diff --git a/src/main/app/Resources/modules/action/components/toolbar.jsx b/src/main/app/Resources/modules/action/components/toolbar.jsx
@@ -16,15 +16,12 @@ import {buildToolbar} from '#/main/app/action/utils'
 
 /**
  * Creates a toolbar of actions.
- *
- * @param props
- * @constructor
  */
 const StaticToolbar = props => {
   const toolbar = buildToolbar(props.toolbar, props.actions, props.scope)
 
   return (0 !== toolbar.length &&
-    <nav role="toolbar" className={props.className} style={props.style}>
+    <nav role="toolbar" className={classes(props.className, props.name)} style={props.style}>
       {toolbar.map((group, groupIndex) => [
         0 !== groupIndex &&
           <span
@@ -33,11 +30,11 @@ const StaticToolbar = props => {
           />,
         ...group.map((action) =>
           <Button
-            {...omit(action, 'name')}
-            id={`${props.id}${action.id || action.name}`}
+            {...omit(action, 'name', 'className')}
+            id={`${props.id || props.name || ''}${action.id || action.name}`}
             key={action.id || action.name}
             disabled={props.disabled || action.disabled}
-            className={classes(`${props.className}-btn`, props.buttonName, action.className)}
+            className={classes(`${props.name || props.className}-btn`, props.buttonName, action.className)}
             tooltip={props.tooltip}
             size={props.size}
             onClick={action.onClick ? () => {

diff --git a/src/main/app/Resources/modules/action/prop-types.js b/src/main/app/Resources/modules/action/prop-types.js
@@ -83,6 +83,11 @@ const Toolbar = {
 
     /**
      * The base class of the toolbar (it's used to generate classNames which can be used for styling).
+     */
+    name: T.string,
+
+    /**
+     * The additional classes to add to the toolbar.
      *
      * @type {string}
      */

diff --git a/src/main/app/Resources/modules/api/router/mock.js b/src/main/app/Resources/modules/api/router/mock.js
diff --git a/src/main/app/Resources/modules/content/components/summary.jsx b/src/main/app/Resources/modules/content/components/summary.jsx
@@ -52,7 +52,7 @@ class SummaryLink extends Component {
 
           {(collapsible || 0 !== this.props.additional.length) &&
             <Toolbar
-              className="summary-link-actions"
+              name="summary-link-actions"
               buttonName="btn-summary"
               tooltip="bottom"
               toolbar="collapse more"

diff --git a/src/main/app/Resources/translations/actions.en.json b/src/main/app/Resources/translations/actions.en.json
@@ -9,7 +9,7 @@
   "close": "Close",
   "close-summary": "Close summary",
   "collapse": "Collapse",
-  "comment": "Leave a comment",
+  "comment": "Comment",
   "configure": "Configure",
   "copy": "Copy",
   "copy-model": "Copy as model",

diff --git a/src/main/app/Resources/translations/actions.fr.json b/src/main/app/Resources/translations/actions.fr.json
@@ -9,7 +9,7 @@
   "close": "Fermer",
   "close-summary": "Fermer le sommaire",
   "collapse": "Replier",
-  "comment": "Laisser un commentaire",
+  "comment": "Commenter",
   "configure": "Configurer",
   "copy": "Copier",
   "copy-model": "Copier comme modèle",

diff --git a/src/main/core/Resources/less/users/message.less b/src/main/core/Resources/less/users/message.less
@@ -152,6 +152,8 @@
     padding: @panel-body-padding;
 }
 
+// message variants
+
 .user-message-highlight {
     .user-message {
         border-color: @brand-primary;
@@ -164,3 +166,16 @@
         border-bottom-color: @brand-primary;
     }
 }
+
+.user-message-hidden {
+    .user-message {
+        background: @gray-lighter;
+        border: 1px solid @gray-lighter;
+        &:before {
+            border-color: transparent @gray-lighter transparent transparent;
+        }
+        &:after {
+            border-color: transparent transparent transparent @gray-lighter;
+        }
+    }
+}