From 3dc88d55eab1a796eda5964d0684c529710b1bfa Mon Sep 17 00:00:00 2001 From: Sundeep Chand Date: Fri, 14 Aug 2020 13:34:00 +0530 Subject: [PATCH 1/4] Changed color of popup stripe --- client/styles/abstracts/_variables.scss | 3 +++ client/styles/components/_quick-add.scss | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/client/styles/abstracts/_variables.scss b/client/styles/abstracts/_variables.scss index 80c924b1..46a8e434 100644 --- a/client/styles/abstracts/_variables.scss +++ b/client/styles/abstracts/_variables.scss @@ -88,6 +88,7 @@ $themes: ( nav-border-color: $middle-light, error-color: $p5js-pink, table-row-stripe-color: $medium-light, + quick-add-row-stripe-color: $medium-light, codefold-icon-open: url(../images/triangle-arrow-down.svg?byUrl), codefold-icon-closed: url(../images/triangle-arrow-right.svg?byUrl), @@ -163,6 +164,7 @@ $themes: ( nav-border-color: $middle-dark, error-color: $p5js-pink, table-row-stripe-color: $dark, + quick-add-row-stripe-color: $darker, codefold-icon-open: url(../images/triangle-arrow-down-white.svg?byUrl), codefold-icon-closed: url(../images/triangle-arrow-right-white.svg?byUrl), @@ -236,6 +238,7 @@ $themes: ( nav-border-color: $middle-dark, error-color: $p5-contrast-pink, table-row-stripe-color: $dark, + quick-add-row-stripe-color: $darker, codefold-icon-open: url(../images/triangle-arrow-down-white.svg?byUrl), codefold-icon-closed: url(../images/triangle-arrow-right-white.svg?byUrl), diff --git a/client/styles/components/_quick-add.scss b/client/styles/components/_quick-add.scss index 838a1d65..d51b99d5 100644 --- a/client/styles/components/_quick-add.scss +++ b/client/styles/components/_quick-add.scss @@ -23,7 +23,7 @@ .quick-add__item:nth-child(odd) { @include themify() { - background: getThemifyVariable('table-row-stripe-color'); + background: getThemifyVariable('quick-add-row-stripe-color'); } } From a5a390d1340615d7e19323fededa0bcdfde2356b Mon Sep 17 00:00:00 2001 From: Sundeep Chand Date: Tue, 18 Aug 2020 23:24:21 +0530 Subject: [PATCH 2/4] Changed variable naming --- client/styles/abstracts/_variables.scss | 6 +++--- client/styles/components/_quick-add.scss | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/client/styles/abstracts/_variables.scss b/client/styles/abstracts/_variables.scss index 46a8e434..d0f62b27 100644 --- a/client/styles/abstracts/_variables.scss +++ b/client/styles/abstracts/_variables.scss @@ -88,7 +88,7 @@ $themes: ( nav-border-color: $middle-light, error-color: $p5js-pink, table-row-stripe-color: $medium-light, - quick-add-row-stripe-color: $medium-light, + table-row-stripe-color-alternate: $medium-light, codefold-icon-open: url(../images/triangle-arrow-down.svg?byUrl), codefold-icon-closed: url(../images/triangle-arrow-right.svg?byUrl), @@ -164,7 +164,7 @@ $themes: ( nav-border-color: $middle-dark, error-color: $p5js-pink, table-row-stripe-color: $dark, - quick-add-row-stripe-color: $darker, + table-row-stripe-color-alternate: $darker, codefold-icon-open: url(../images/triangle-arrow-down-white.svg?byUrl), codefold-icon-closed: url(../images/triangle-arrow-right-white.svg?byUrl), @@ -238,7 +238,7 @@ $themes: ( nav-border-color: $middle-dark, error-color: $p5-contrast-pink, table-row-stripe-color: $dark, - quick-add-row-stripe-color: $darker, + table-row-stripe-color-alternate: $darker, codefold-icon-open: url(../images/triangle-arrow-down-white.svg?byUrl), codefold-icon-closed: url(../images/triangle-arrow-right-white.svg?byUrl), diff --git a/client/styles/components/_quick-add.scss b/client/styles/components/_quick-add.scss index d51b99d5..95b09baf 100644 --- a/client/styles/components/_quick-add.scss +++ b/client/styles/components/_quick-add.scss @@ -23,7 +23,7 @@ .quick-add__item:nth-child(odd) { @include themify() { - background: getThemifyVariable('quick-add-row-stripe-color'); + background: getThemifyVariable('table-row-stripe-color-alternate'); } } From 5aa65029c6fdc1a401b0b74751028d0cdf701615 Mon Sep 17 00:00:00 2001 From: Cassie Tarakajian Date: Wed, 19 Aug 2020 15:50:26 -0400 Subject: [PATCH 3/4] Add border to QuickAdd table --- client/styles/components/_quick-add.scss | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/client/styles/components/_quick-add.scss b/client/styles/components/_quick-add.scss index 95b09baf..75f93773 100644 --- a/client/styles/components/_quick-add.scss +++ b/client/styles/components/_quick-add.scss @@ -1,11 +1,16 @@ .quick-add-wrapper { min-width: #{600 / $base-font-size}rem; - overflow-y: scroll; + padding: #{24 / $base-font-size}rem; + height: 100%; } .quick-add { width: auto; - padding: #{24 / $base-font-size}rem; + overflow-y: scroll; + height: 100%; + @include themify() { + border: 1px solid getThemifyVariable('modal-border-color'); + } } .quick-add__item { From 4c65e6580c4e4b9eca41d25804ec551265bfd26c Mon Sep 17 00:00:00 2001 From: Cassie Tarakajian Date: Wed, 19 Aug 2020 16:40:59 -0400 Subject: [PATCH 4/4] Fix scrolling for QuickAdd list --- .../modules/IDE/components/AddToCollectionList.jsx | 14 ++++++++------ .../IDE/components/AddToCollectionSketchList.jsx | 12 +++++++----- .../components/CollectionList/CollectionList.jsx | 10 ++++------ client/modules/User/components/Collection.jsx | 7 ++++--- 4 files changed, 23 insertions(+), 20 deletions(-) diff --git a/client/modules/IDE/components/AddToCollectionList.jsx b/client/modules/IDE/components/AddToCollectionList.jsx index e9417d3b..e003a896 100644 --- a/client/modules/IDE/components/AddToCollectionList.jsx +++ b/client/modules/IDE/components/AddToCollectionList.jsx @@ -14,7 +14,7 @@ import Loader from '../../App/components/loader'; import QuickAddList from './QuickAddList'; const projectInCollection = (project, collection) => - collection.items.find(item => item.project.id === project.id) != null; + collection.items.find(item => item.projectId === project.id) != null; class CollectionList extends React.Component { constructor(props) { @@ -81,12 +81,14 @@ class CollectionList extends React.Component { } return ( -
- - {this.getTitle()} - +
+
+ + {this.getTitle()} + - {content} + {content} +
); } diff --git a/client/modules/IDE/components/AddToCollectionSketchList.jsx b/client/modules/IDE/components/AddToCollectionSketchList.jsx index d4173b4b..6abb9aad 100644 --- a/client/modules/IDE/components/AddToCollectionSketchList.jsx +++ b/client/modules/IDE/components/AddToCollectionSketchList.jsx @@ -72,11 +72,13 @@ class SketchList extends React.Component { } return ( -
- - {this.getSketchesTitle()} - - {content} +
+
+ + {this.getSketchesTitle()} + + {content} +
); } diff --git a/client/modules/IDE/components/CollectionList/CollectionList.jsx b/client/modules/IDE/components/CollectionList/CollectionList.jsx index 1007ca97..3d4e1aa6 100644 --- a/client/modules/IDE/components/CollectionList/CollectionList.jsx +++ b/client/modules/IDE/components/CollectionList/CollectionList.jsx @@ -170,12 +170,10 @@ class CollectionList extends React.Component { closeOverlay={this.hideAddSketches} isFixedHeight > -
- -
+ ) } diff --git a/client/modules/User/components/Collection.jsx b/client/modules/User/components/Collection.jsx index 54e87518..abcd9ce5 100644 --- a/client/modules/User/components/Collection.jsx +++ b/client/modules/User/components/Collection.jsx @@ -398,9 +398,10 @@ class Collection extends React.Component { closeOverlay={this.hideAddSketches} isFixedHeight > -
- -
+ ) }