Browse Source

CSS label / register-list Aesthetics

Occasionally depending on the page width and the operation used, the label.bmd-label-floating's wraps and covers the input - CSS to hide the wrap

On register-list, if the regex match is not a word and longer than the div, it'll over run - CSS of word-break: break-all
OllieGeek 6 years ago
parent
commit
32a91bda0a
1 changed files with 8 additions and 0 deletions
  1. 8 0
      src/web/stylesheets/components/_operation.css

+ 8 - 0
src/web/stylesheets/components/_operation.css

@@ -116,6 +116,13 @@ div.toggle-string {
     left: 12px;
 }
 
+.operation label.bmd-label-floating {
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    width: calc(100% - 13px);
+}
+
 .operation .bmd-form-group .bmd-help {
     margin-top: -17px;
 }
@@ -172,6 +179,7 @@ div.toggle-string {
     background-color: var(--fc-operation-border-colour);
     font-family: var(--fixed-width-font-family);
     padding: 10px;
+    word-break: break-all;
 }
 
 .op-icon {