diff --git a/client/homebrew/editor/snippetbar/snippetbar.less b/client/homebrew/editor/snippetbar/snippetbar.less index 780ae7a2c..b766e7fe1 100644 --- a/client/homebrew/editor/snippetbar/snippetbar.less +++ b/client/homebrew/editor/snippetbar/snippetbar.less @@ -4,33 +4,31 @@ .snippetBar { @menuHeight : 25px; position : relative; + display : flex; + flex-wrap : wrap-reverse; + justify-content : space-between; min-width : 331px; height : auto; color : black; background-color : #DDDDDD; - display: flex; - justify-content: space-between; - flex-wrap:wrap-reverse; .snippets { display : flex; - justify-content : space-between; + justify-content : space-evenly; } .editors { display : flex; justify-content : space-between; >div { - display:flex; - justify-content: space-around; - flex:1; - border-left:1px solid; + display : flex; + flex : 1; + justify-content : space-around; - &:first-child { - border-left: none; - } + &:first-child { border-left : none; } & > div { + position : relative; width : @menuHeight; height : @menuHeight; line-height : @menuHeight; @@ -70,18 +68,14 @@ } &.history { .tooltipLeft('History'); + position : relative; font-size : 0.75em; color : grey; - position : relative; - border:none; - &.active { - color : inherit; - } - &>.dropdown{ + border : none; + &.active { color : inherit; } + & > .dropdown { right : -1px; - &>.snippet{ - padding-right : 10px; - } + & > .snippet { padding-right : 10px; } } } &.editorTheme { @@ -121,8 +115,8 @@ font-weight : 800; line-height : @menuHeight; text-transform : uppercase; + text-wrap : nowrap; cursor : pointer; - text-wrap: nowrap; &:hover, &.selected { background-color : #999999; } i { margin-right : 3px; @@ -138,7 +132,6 @@ .tooltipLeft('Edit Brew Properties'); } .snippetGroup { - border-right : 1px solid currentColor; &:hover { & > .dropdown { visibility : visible; } @@ -198,7 +191,7 @@ } } .name { margin-right : auto; } - .disabled { text-decoration: line-through; } + .disabled { text-decoration : line-through; } .beta { align-self : center; padding : 4px 6px; @@ -226,16 +219,10 @@ } } -@container editor (width < 568px) { +@container editor (width < 553px) { - .editors,.snippets { - width:332.59px; - } - .editors { - border-right:1px solid; - } - .snippetBar .editors>div.history>.dropdown { - right:unset; - } + .editors,.snippets { flex:1; } + .editors { border-bottom:1px solid} + .snippetBar .editors > div.history > .dropdown { right : unset; } }