diff --git a/src/containers/UsersNameContainer/UsersNameContainer.css b/src/containers/UsersNameContainer/UsersNameContainer.css index c28d7074b..001cc26ca 100644 --- a/src/containers/UsersNameContainer/UsersNameContainer.css +++ b/src/containers/UsersNameContainer/UsersNameContainer.css @@ -1,5 +1,19 @@ .simpleName { - margin-left: 4px; - margin-right: 4px; white-space: nowrap; } + +.simpleName:after { + content: ', '; +} + +.simpleName:first-of-type { + margin-left: 2px; +} + +.simpleName:last-of-type { + margin-right: 3px; +} + +.simpleName:last-of-type:after { + content: ''; +} diff --git a/src/containers/UsersNameContainer/UsersNameContainer.js b/src/containers/UsersNameContainer/UsersNameContainer.js index 13a62e0ad..ab27d5ed1 100644 --- a/src/containers/UsersNameContainer/UsersNameContainer.js +++ b/src/containers/UsersNameContainer/UsersNameContainer.js @@ -11,6 +11,7 @@ import UsersName, { LoadingUsersName, FailedUsersName } from '../../components/Users/UsersName'; +import { LoadingIcon, FailedIcon } from '../../components/icons'; import './UsersNameContainer.css'; @@ -35,8 +36,8 @@ class UsersNameContainer extends Component { return ( } - failed={} + loading={isSimple ? : } + failed={isSimple ? : } > {user => isSimple