From 6e80c65d995d6bb19d37ad0841acb089af5b3a61 Mon Sep 17 00:00:00 2001 From: Alex Andreev Date: Mon, 7 Jun 2021 15:15:36 +0300 Subject: [PATCH] Fix catalog table classnames (#2975) Signed-off-by: Alex Andreev --- src/renderer/components/+catalog/catalog.scss | 120 ------------------ src/renderer/components/+catalog/catalog.tsx | 21 ++- 2 files changed, 10 insertions(+), 131 deletions(-) delete mode 100644 src/renderer/components/+catalog/catalog.scss diff --git a/src/renderer/components/+catalog/catalog.scss b/src/renderer/components/+catalog/catalog.scss deleted file mode 100644 index a0afd8c08c..0000000000 --- a/src/renderer/components/+catalog/catalog.scss +++ /dev/null @@ -1,120 +0,0 @@ -/** - * Copyright (c) 2021 OpenLens Authors - * - * Permission is hereby granted, free of charge, to any person obtaining a copy of - * this software and associated documentation files (the "Software"), to deal in - * the Software without restriction, including without limitation the rights to - * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of - * the Software, and to permit persons to whom the Software is furnished to do so, - * subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS - * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR - * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER - * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN - * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. - */ - -.CatalogPage { - --width: 100%; - --height: 100%; - --nav-column-width: 200px; - - .sidebarRegion { - justify-content: flex-start; - background-color: var(--sidebarBackground); - - .sidebarHeader { - background: var(--sidebarLogoBackground); - height: var(--main-layout-header); - padding: 4px; - color: var(--textColorAccent); - font-weight: bold; - font-size: 14px; - display: flex; - align-items: center; - padding-left: 10px; - } - - > .sidebar { - width: 100%; - padding: 0; - - .sidebarTabs { - margin-top: 5px; - - .Tab { - padding: 7px 10px; - font-weight: normal; - font-size: 14px; - border-radius: 0; - height: 36px; - - &.active { - background-color: var(--blue); - color: white; - } - } - } - } - } - - .contentRegion { - > .content { - padding: 20px 20px; - } - } - - .TableCell.icon { - max-width: 40px; - display: flex; - align-items: center; - } - - .TableCell.kind { - max-width: 150px; - } - - .TableCell.source { - max-width: 100px; - } - - .TableCell.status { - max-width: 100px; - &.connected { - color: var(--colorSuccess); - } - - &.disconnected { - color: var(--halfGray); - } - } - - .TableCell.labels { - overflow-x: scroll; - text-overflow: unset; - - &::-webkit-scrollbar { - display: none; - } - - .Badge { - overflow: unset; - text-overflow: unset; - max-width: unset; - - &:not(:first-child) { - margin-left: 0.5em; - } - } - } - - .catalogIcon { - font-size: 10px; - -webkit-font-smoothing: auto; - } -} diff --git a/src/renderer/components/+catalog/catalog.tsx b/src/renderer/components/+catalog/catalog.tsx index 2059658d1f..c2d180d2e2 100644 --- a/src/renderer/components/+catalog/catalog.tsx +++ b/src/renderer/components/+catalog/catalog.tsx @@ -219,11 +219,11 @@ export class Catalog extends React.Component { (entity: CatalogEntityItem) => entity.searchFields, ]} renderTableHeader={[ - { title: "", className: "icon" }, - { title: "Name", className: "name", sortBy: sortBy.name }, - { title: "Source", className: "source", sortBy: sortBy.source }, - { title: "Labels", className: "labels" }, - { title: "Status", className: "status", sortBy: sortBy.status }, + { title: "", className: styles.iconCell }, + { title: "Name", className: styles.nameCell, sortBy: sortBy.name }, + { title: "Source", className: styles.sourceCell, sortBy: sortBy.source }, + { title: "Labels", className: styles.labelsCell }, + { title: "Status", className: styles.statusCell, sortBy: sortBy.status }, ]} renderTableContents={(item: CatalogEntityItem) => [ this.renderIcon(item), @@ -257,12 +257,11 @@ export class Catalog extends React.Component { (entity: CatalogEntityItem) => entity.searchFields, ]} renderTableHeader={[ - { title: "", className: "icon" }, - { title: "Name", className: "name", sortBy: sortBy.name }, - { title: "Kind", className: "kind", sortBy: sortBy.kind }, - { title: "Source", className: "source", sortBy: sortBy.source }, - { title: "Labels", className: "labels" }, - { title: "Status", className: "status", sortBy: sortBy.status }, + { title: "", className: styles.iconCell }, + { title: "Name", className: styles.nameCell, sortBy: sortBy.name }, + { title: "Source", className: styles.sourceCell, sortBy: sortBy.source }, + { title: "Labels", className: styles.labelsCell }, + { title: "Status", className: styles.statusCell, sortBy: sortBy.status }, ]} renderTableContents={(item: CatalogEntityItem) => [ this.renderIcon(item),