From a3fdb4aee3fc83e4de96ca5a2bc678db43b9e90c Mon Sep 17 00:00:00 2001 From: Alex Corey Date: Thu, 2 May 2019 13:38:51 -0400 Subject: [PATCH 1/3] add bottom border to tabs --- src/app.scss | 20 +++++++++++++ .../screens/Organization/Organization.jsx | 29 ++++++++++++------- 2 files changed, 39 insertions(+), 10 deletions(-) diff --git a/src/app.scss b/src/app.scss index 704f02219a..931b00520f 100644 --- a/src/app.scss +++ b/src/app.scss @@ -317,6 +317,24 @@ margin-bottom: 10px; } +.orgTabsContainer{ + display: flex +} + +.orgTabsSection{ + flex-grow: 1; + border-bottom: 1px solid #d2d2d2 +} + +.OrgsTab-closeButton { + color: black; + float: right; + position: relative; + top: 10px; + margin: 0 10px; + right: 10px; +} + .awx-c-form-action-group { float: right; display: block; @@ -398,3 +416,5 @@ .pf-m-error p.pf-c-form__helper-text { color: var(--pf-global--danger-color--100); } + + diff --git a/src/pages/Organizations/screens/Organization/Organization.jsx b/src/pages/Organizations/screens/Organization/Organization.jsx index 223bf0b60f..e46eae7569 100644 --- a/src/pages/Organizations/screens/Organization/Organization.jsx +++ b/src/pages/Organizations/screens/Organization/Organization.jsx @@ -112,8 +112,10 @@ class Organization extends Component { isAdminOfThisOrg } = this.state; - const tabsPaddingOverride = { - padding: '0', + const tabsStyle = { + paddingTop: '0px', + paddingLeft: '0px', + paddingRight: '0px', }; const canSeeNotificationsTab = me.is_system_auditor || isNotifAdmin || isAuditorOfThisOrg; @@ -141,18 +143,25 @@ class Organization extends Component { loading ? '' : ( {({ i18n }) => ( - - +
+ +
+ +
+
)} From b8b22093353dc759b5c1c0e97fed070905fe5f9a Mon Sep 17 00:00:00 2001 From: Alex Corey Date: Fri, 3 May 2019 10:20:32 -0400 Subject: [PATCH 2/3] add bottom border to org tabs --- .../OrganizationNotifications.test.jsx.snap | 2 ++ package-lock.json | 16 ++++++------ src/app.scss | 25 +++---------------- .../screens/Organization/Organization.jsx | 10 +++----- 4 files changed, 17 insertions(+), 36 deletions(-) diff --git a/__tests__/pages/Organizations/screens/Organization/__snapshots__/OrganizationNotifications.test.jsx.snap b/__tests__/pages/Organizations/screens/Organization/__snapshots__/OrganizationNotifications.test.jsx.snap index 7a4d68e761..560cc21984 100644 --- a/__tests__/pages/Organizations/screens/Organization/__snapshots__/OrganizationNotifications.test.jsx.snap +++ b/__tests__/pages/Organizations/screens/Organization/__snapshots__/OrganizationNotifications.test.jsx.snap @@ -182,6 +182,7 @@ exports[` initially renders succesfully 1`] = ` > initially renders succesfully 1`] = ` noLeftMargin={false} onCompact={null} onExpand={null} + onOpenDeleteModal={null} onSearch={[Function]} onSelectAll={null} onSort={[Function]} diff --git a/package-lock.json b/package-lock.json index 5f5b1a3d5f..35c6800410 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2616,7 +2616,7 @@ }, "readable-stream": { "version": "2.3.6", - "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz", + "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz", "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==", "dev": true, "requires": { @@ -4138,7 +4138,7 @@ }, "camelcase-keys": { "version": "2.1.0", - "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz", + "resolved": "http://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz", "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=", "dev": true, "requires": { @@ -10665,7 +10665,7 @@ }, "load-json-file": { "version": "1.1.0", - "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz", + "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz", "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=", "dev": true, "requires": { @@ -10995,7 +10995,7 @@ }, "meow": { "version": "3.7.0", - "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz", + "resolved": "http://registry.npmjs.org/meow/-/meow-3.7.0.tgz", "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs=", "dev": true, "requires": { @@ -11013,7 +11013,7 @@ "dependencies": { "minimist": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=", "dev": true } @@ -11525,7 +11525,7 @@ }, "semver": { "version": "5.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz", + "resolved": "http://registry.npmjs.org/semver/-/semver-5.3.0.tgz", "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=", "dev": true } @@ -13890,7 +13890,7 @@ }, "os-locale": { "version": "1.4.0", - "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz", + "resolved": "http://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz", "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=", "dev": true, "requires": { @@ -14666,7 +14666,7 @@ }, "readable-stream": { "version": "2.3.6", - "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz", + "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz", "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==", "dev": true, "requires": { diff --git a/src/app.scss b/src/app.scss index 931b00520f..9259f1f38d 100644 --- a/src/app.scss +++ b/src/app.scss @@ -217,7 +217,7 @@ .pf-c-card__close { position: absolute; - top: 10px; + top: 5px; right: 4px; color: var(--pf-c-button--m-plain--Color); @@ -317,34 +317,15 @@ margin-bottom: 10px; } -.orgTabsContainer{ +.awx-orgTabs-container{ display: flex } -.orgTabsSection{ +.awx-orgTabs_bottom-border{ flex-grow: 1; border-bottom: 1px solid #d2d2d2 } -.OrgsTab-closeButton { - color: black; - float: right; - position: relative; - top: 10px; - margin: 0 10px; - right: 10px; -} - -.awx-c-form-action-group { - float: right; - display: block; - - .pf-m-danger { - margin-top: 20px; - margin-right: 20px; - } -} - // // AlertModal styles // diff --git a/src/pages/Organizations/screens/Organization/Organization.jsx b/src/pages/Organizations/screens/Organization/Organization.jsx index e46eae7569..66aa36c370 100644 --- a/src/pages/Organizations/screens/Organization/Organization.jsx +++ b/src/pages/Organizations/screens/Organization/Organization.jsx @@ -148,19 +148,17 @@ class Organization extends Component { {({ i18n }) => ( -
+
+
- -
+ className="awx-orgTabs_bottom-border" + />
)} From 1200c23ebcca701b486212f8228379cedd9e52b3 Mon Sep 17 00:00:00 2001 From: Alex Corey Date: Fri, 3 May 2019 14:26:19 -0400 Subject: [PATCH 3/3] addressing PR issues --- src/app.scss | 2 +- src/pages/Organizations/screens/Organization/Organization.jsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app.scss b/src/app.scss index 9259f1f38d..afb10e771e 100644 --- a/src/app.scss +++ b/src/app.scss @@ -321,7 +321,7 @@ display: flex } -.awx-orgTabs_bottom-border{ +.awx-orgTabs__bottom-border{ flex-grow: 1; border-bottom: 1px solid #d2d2d2 } diff --git a/src/pages/Organizations/screens/Organization/Organization.jsx b/src/pages/Organizations/screens/Organization/Organization.jsx index 66aa36c370..ec65d866a6 100644 --- a/src/pages/Organizations/screens/Organization/Organization.jsx +++ b/src/pages/Organizations/screens/Organization/Organization.jsx @@ -157,7 +157,7 @@ class Organization extends Component { />