- {this.renderCollectionName()}
+
+ {addMode && this.renderIsInCollectionStatus()}
+ {this.renderCollectionName()}
+
|
{format(new Date(collection.createdAt), 'MMM D, YYYY')} |
{format(new Date(collection.updatedAt), 'MMM D, YYYY')} |
@@ -234,7 +264,10 @@ CollectionListRowBase.propTypes = {
removeFromCollection: PropTypes.func.isRequired,
collection: PropTypes.shape({
id: PropTypes.string.isRequired,
- name: PropTypes.string.isRequired
+ name: PropTypes.string.isRequired,
+ owner: PropTypes.shape({
+ username: PropTypes.string.isRequired,
+ }).isRequired,
}).isRequired,
addMode: PropTypes.bool.isRequired,
project: PropTypes.shape({
diff --git a/client/styles/components/_sketch-list.scss b/client/styles/components/_sketch-list.scss
index 00a13e1a..9e75a999 100644
--- a/client/styles/components/_sketch-list.scss
+++ b/client/styles/components/_sketch-list.scss
@@ -95,6 +95,10 @@
font-weight: normal;
}
+.sketches-table__row--is-add-mode {
+ cursor: pointer;
+}
+
.sketch-list__dropdown-button {
width:#{25 / $base-font-size}rem;
height:#{25 / $base-font-size}rem;
@@ -105,6 +109,29 @@
}
}
+.sketches-table__name {
+ display: flex;
+ align-items: center;
+}
+
+.sketch-list__check-icon {
+ display: inline-block;
+ margin-right:#{10 / $base-font-size}rem;
+ width:#{25 / $base-font-size}rem;
+ height:#{25 / $base-font-size}rem;
+ @include icon();
+ @include themify() {
+ & path {
+ fill: getThemifyVariable('dropdown-color');
+ }
+
+ & svg {
+ width:#{25 / $base-font-size}rem;
+ height:#{25 / $base-font-size}rem;
+ }
+ }
+}
+
.sketch-list__action-dialogue {
@extend %dropdown-open-right;
top: 63%;