hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Fix long name layout in Cluster Settings (#3854)

Browse Source 
* Fix long name layout in Cluster Settings

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Clean up

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2021-09-22 07:42:05 +03:00 committed by Jim Ehrismann
parent 0485b74cf0
commit 2ef331e28d
2 changed files with 13 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/renderer/components/+entity-settings/entity-settings.scss → src/renderer/components/+entity-settings/entity-settings.module.css
View File

@ -19,26 +19,12 @@
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/ */
.EntitySettings { .entityName {
$spacing: $padding * 3; @apply font-bold overflow-hidden;
word-break: break-word;
color: var(--textColorAccent);
// TODO: move sub-component styles to separate files display: -webkit-box;
.admin-note { /* Simulate text-overflow:ellipsis styles but for multiple text lines */
font-size: small; -webkit-line-clamp: 3;
opacity: 0.5; -webkit-box-orient: vertical;
margin-left: $margin; }
}
.button-area {
margin-top: $margin * 2;
}
.file-loader {
margin-top: $margin * 2;
}
.Input, .Select {
margin-top: $padding;
}
}

7
src/renderer/components/+entity-settings/entity-settings.tsx
View File

@ -19,7 +19,7 @@
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/ */
import "./entity-settings.scss"; import styles from "./entity-settings.module.css";
import React from "react"; import React from "react";
import { observable, makeObservable } from "mobx"; import { observable, makeObservable } from "mobx";
@ -98,7 +98,9 @@ export class EntitySettings extends React.Component<Props> {
source={this.entity.metadata.source} source={this.entity.metadata.source}
src={this.entity.spec.icon?.src} src={this.entity.spec.icon?.src}
/> />
<h2>{this.entity.metadata.name}</h2> <div className={styles.entityName}>
{this.entity.metadata.name}
</div>
</div> </div>
<Tabs className="flex column" scrollable={false} onChange={this.onTabChange} value={this.activeTab}> <Tabs className="flex column" scrollable={false} onChange={this.onTabChange} value={this.activeTab}>
{ groups.map((group, groupIndex) => ( { groups.map((group, groupIndex) => (
@ -138,7 +140,6 @@ export class EntitySettings extends React.Component<Props> {
return ( return (
<SettingLayout <SettingLayout
className="CatalogEntitySettings"
navigation={this.renderNavigation()} navigation={this.renderNavigation()}
contentGaps={false} contentGaps={false}
> >