Fix: Button scoping issues (#160)

box · Jan 16, 2018 · 4ba6132 · 4ba6132
1 parent 1cb1268
commit 4ba6132
Show file tree

Hide file tree

Showing 13 changed files with 16 additions and 17 deletions.
diff --git a/package.json b/package.json
@@ -39,8 +39,9 @@
     "build": "yarn run pre-build && LANGUAGE=en-US BABEL_ENV=dev NODE_ENV=dev ./node_modules/.bin/webpack --progress --colors --config build/webpack.config.js",
     "build-ci": "LANGUAGE=en-US yarn run build-prod",
     "build-prod": "BABEL_ENV=production NODE_ENV=production node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js --config build/webpack.config.js",
-    "build-npm": "yarn run npm && yarn run copy-lib && BABEL_ENV=npm NODE_ENV=production ./node_modules/.bin/babel lib -d lib",
+    "build-npm": "yarn run npm && yarn run build-lib",
     "build-npm-source-map": "yarn run npm && yarn run copy-lib && BABEL_ENV=npm NODE_ENV=production ./node_modules/.bin/babel lib -d lib -s inline",
+    "build-lib": "yarn run copy-lib && BABEL_ENV=npm NODE_ENV=production ./node_modules/.bin/babel lib -d lib",
     "build-locales": "node ./build/props-to-es2015.js",
     "changelog": "./node_modules/.bin/conventional-changelog -i CHANGELOG.md -s -r 0",
     "clean": "rm -rf dist lib reports/* i18n/json i18n/*.js",

diff --git a/src/components/Breadcrumbs/Breadcrumb.scss b/src/components/Breadcrumbs/Breadcrumb.scss
@@ -9,7 +9,7 @@
         min-width: 64px;
     }
 
-    .btn-plain {
+    .be & .btn-plain {
         color: $sevens;
 
         &:last-child {

diff --git a/src/components/Breadcrumbs/BreadcrumbDropdown.scss b/src/components/Breadcrumbs/BreadcrumbDropdown.scss
@@ -1,6 +1,6 @@
 @import '../variables';
 
-.btn-plain.be-breadcrumbs-drop-down {
+.be .btn-plain.be-breadcrumbs-drop-down {
     color: $sevens;
     letter-spacing: 1.5px;
 

diff --git a/src/components/Breadcrumbs/InlineBreadcrumbs.scss b/src/components/Breadcrumbs/InlineBreadcrumbs.scss
@@ -15,7 +15,7 @@
             min-width: 43px;
         }
 
-        .btn-plain {
+        .be & .btn-plain {
             color: inherit;
             font-size: 11px;
         }

diff --git a/src/components/ContentExplorer/ItemList.scss b/src/components/ContentExplorer/ItemList.scss
@@ -42,7 +42,7 @@
         }
 
         .bce-item-coloumn,
-        .btn-plain {
+        .be & .btn-plain {
             color: $dark-cerulean;
         }
     }
@@ -56,7 +56,7 @@
         }
 
         .bce-item-coloumn,
-        .btn-plain {
+        .be & .btn-plain {
             color: $dark-cerulean;
         }
     }

diff --git a/src/components/ContentPicker/ItemList.scss b/src/components/ContentPicker/ItemList.scss
@@ -19,7 +19,7 @@
         background-color: $light-blue;
         border-top-color: $grey-blue;
 
-        .btn-plain,
+        .be & .btn-plain,
         .be-item-label {
             color: $dark-cerulean;
         }
@@ -82,7 +82,7 @@
             }
         }
 
-        .btn-plain,
+        .be & .btn-plain,
         .be-item-label {
             color: $dark-cerulean;
         }

diff --git a/src/components/ContentPreview/Header.scss b/src/components/ContentPreview/Header.scss
@@ -3,7 +3,7 @@
 .bcpr-btns {
     display: flex;
 
-    .btn-plain.bcpr-btn {
+    .be & .btn-plain.bcpr-btn {
         padding: 0 15px 0 5px;
 
         &:hover,

diff --git a/src/components/ContentSidebar/ContentSidebar.scss b/src/components/ContentSidebar/ContentSidebar.scss
@@ -6,7 +6,5 @@
 }
 
 .bcs-loading {
-    align-items: center;
-    display: flex;
-    height: 100%;
+    flex: 1;
 }
diff --git a/src/components/ContentSidebar/Sidebar.scss b/src/components/ContentSidebar/Sidebar.scss
@@ -16,7 +16,7 @@
         display: flex;
         flex-direction: column;
 
-        .btn-plain {
+        .be & .btn-plain {
             border-left: 2px solid transparent;
             border-radius: 0;
             height: 60px;

diff --git a/src/components/ContentSidebar/SidebarSection.scss b/src/components/ContentSidebar/SidebarSection.scss
@@ -8,7 +8,7 @@
     padding: 15px 0 5px;
 }
 
-.btn-plain.bcs-section-title {
+.be .btn-plain.bcs-section-title {
     border-bottom: 1px solid $off-white;
     padding: 5px 0 10px;
     text-align: left;

diff --git a/src/components/Keywords/Keyword.scss b/src/components/Keywords/Keyword.scss
@@ -14,7 +14,7 @@
     display: inline-block;
     margin: 0 3px 8px;
 
-    .btn-plain {
+    .be & .btn-plain {
         border: 1px solid $see-see;
         color: $sevens;
         padding: 5px 10px;

diff --git a/src/components/Timeline/Line.scss b/src/components/Timeline/Line.scss
@@ -1,6 +1,6 @@
 @import '../variables';
 
-.btn-plain.be-timeline-time {
+.be .btn-plain.be-timeline-time {
     border-radius: 6px;
     cursor: pointer;
     height: 6px;

diff --git a/test/preview.html b/test/preview.html
@@ -23,7 +23,7 @@
             window.onload = function() {
                 const { ContentExplorer } = Box;
                 const explorer = new ContentExplorer();
-                explorer.show('0', 'yBhjw4REZTCCHVnEe2GRv7zFZepBR7WN', {
+                explorer.show('0', 'pSS313sgzGYYSCwVuVKek7YCjFT2h6oY', {
                     currentFolderId: '39695871110',
                     hasPreviewSidebar: true,
                     sharedLink: 'https://app.box.com/s/sdfsdf'