From e1cccbbaf6d6ddce920a900f75d4e619770fdd8b Mon Sep 17 00:00:00 2001
From: Linda <lifaythegoblin@googlemail.com>
Date: Wed, 12 Sep 2018 10:11:06 -0400
Subject: [PATCH] fit conventions better
---
src/components/menu-bar/menu-bar.css | 2 +-
src/components/menu-bar/menu-bar.jsx | 2 +-
src/components/menu-bar/project-title-input.css | 5 +++++
3 files changed, 7 insertions(+), 2 deletions(-)
diff --git a/src/components/menu-bar/menu-bar.css b/src/components/menu-bar/menu-bar.css
index ef463ad4c..e4ed79838 100644
--- a/src/components/menu-bar/menu-bar.css
+++ b/src/components/menu-bar/menu-bar.css
@@ -85,7 +85,7 @@
background-color: $ui-black-transparent;
}
-.growableMenuBarItem {
+.menu-bar-itam.growable {
max-width: 12rem;
flex: 1;
}
diff --git a/src/components/menu-bar/menu-bar.jsx b/src/components/menu-bar/menu-bar.jsx
index b6313cfa7..897fedc3f 100644
--- a/src/components/menu-bar/menu-bar.jsx
+++ b/src/components/menu-bar/menu-bar.jsx
@@ -393,7 +393,7 @@ class MenuBar extends React.Component {
<FormattedMessage {...ariaMessages.tutorials} />
</div>
<Divider className={classNames(styles.divider)} />
- <div className={classNames(styles.menuBarItem, styles.growableMenuBarItem)}>
+ <div className={classNames(styles.menuBarItem, styles.growable)}>
<MenuBarItemTooltip
enable
id="title-field"
diff --git a/src/components/menu-bar/project-title-input.css b/src/components/menu-bar/project-title-input.css
index 92a3599a0..0567ca766 100644
--- a/src/components/menu-bar/project-title-input.css
+++ b/src/components/menu-bar/project-title-input.css
@@ -2,6 +2,11 @@
@import "../../css/units.css";
@import "../../css/z-index.css";
+/*
+If project-title-input.jsx is part of a menu bar say menu-bar.jsx, it can have additional css classes that
+can set a width for example or what it should do in a flex box (eg. grow).
+*/
+
.title-field {
border: 1px dashed $ui-black-transparent;
border-radius: $form-radius;
--
GitLab