diff --git a/client/homebrew/editor/snippetbar/snippetbar.jsx b/client/homebrew/editor/snippetbar/snippetbar.jsx
index 8e643a837..7800e1e52 100644
--- a/client/homebrew/editor/snippetbar/snippetbar.jsx
+++ b/client/homebrew/editor/snippetbar/snippetbar.jsx
@@ -150,6 +150,7 @@ const Snippetbar = createClass({
renderSnippetGroups : function(){
const snippets = this.state.snippets.filter((snippetGroup)=>snippetGroup.view === this.props.view);
+ if(snippets.length === 0) return null;
return
{_.map(snippets, (snippetGroup)=>{
diff --git a/client/homebrew/editor/snippetbar/snippetbar.less b/client/homebrew/editor/snippetbar/snippetbar.less
index a4d273bbf..2cdd1568c 100644
--- a/client/homebrew/editor/snippetbar/snippetbar.less
+++ b/client/homebrew/editor/snippetbar/snippetbar.less
@@ -7,7 +7,6 @@
display : flex;
flex-wrap : wrap-reverse;
justify-content : space-between;
- min-width : 331px;
height : auto;
color : black;
background-color : #DDDDDD;
@@ -20,6 +19,10 @@
.editors {
display : flex;
justify-content : space-between;
+
+ &:only-child {
+ margin-left:auto;
+ }
>div {
display : flex;
flex : 1;
@@ -218,9 +221,21 @@
}
}
}
-
+/*text tab*/
@container editor (width < 553px) {
- .editors,.snippets { flex : 1; }
- .editors { border-bottom : 1px solid;}
- .snippetBar .editors > div.history > .dropdown { right : unset; }
+ /*This rule doesn't apply to properties editor or homepage*/
+ .snippetBar:not(:has(>*:only-child)):has(.snippets >*:nth-child(3)) {
+ .editors,.snippets { flex : 1; }
+ .editors { border-bottom : 1px solid;}
+ .editors > div.history > .dropdown { right : unset; }
+ }
+}
+/*style tab*/
+@container editor (width < 328px) {
+ /*This rule doesn't apply to properties editor or homepage*/
+ .snippetBar:not(:has(>*:only-child)) {
+ .editors,.snippets { flex : 1; }
+ .editors { border-bottom : 1px solid;}
+ .editors > div.history > .dropdown { right : unset; }
+ }
}