diff --git a/customize.dist/src/less/toolbar.less b/customize.dist/src/less/toolbar.less index a199730cd..d3aed088c 100644 --- a/customize.dist/src/less/toolbar.less +++ b/customize.dist/src/less/toolbar.less @@ -42,6 +42,7 @@ } button { + font-size: @toolbar-button-font-size; &#shareButton, &.buttonSuccess { // Bootstrap 4 colors color: #fff; diff --git a/customize.dist/src/less/variables.less b/customize.dist/src/less/variables.less index 8a0b4222e..097c76536 100644 --- a/customize.dist/src/less/variables.less +++ b/customize.dist/src/less/variables.less @@ -72,6 +72,7 @@ @toolbar-gradient-start: #f5f5f5; @toolbar-gradient-end: #DDDDDD; +@toolbar-button-font-size: 14px; @topbar-back: #fff; @topbar-color: #000; diff --git a/customize.dist/toolbar.css b/customize.dist/toolbar.css index d2385dfc1..96c401534 100644 --- a/customize.dist/toolbar.css +++ b/customize.dist/toolbar.css @@ -118,6 +118,7 @@ float: right; } .cryptpad-toolbar button { + font-size: 14px; border: 1px solid transparent; border-radius: .25rem; color: #292b2c; diff --git a/www/drive/file.css b/www/drive/file.css index 7ef0adc5e..32ad48108 100644 --- a/www/drive/file.css +++ b/www/drive/file.css @@ -450,7 +450,7 @@ span.fa-folder-open { #driveToolbar { background: #ddd; color: #555; - height: 40px; + height: 30px; display: flex; flex-flow: row; border-top: 1px solid #ccc; @@ -458,6 +458,7 @@ span.fa-folder-open { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); z-index: 100; box-sizing: content-box; + padding: 0 6px; /* The container
- needed to position the dropdown content */ } #driveToolbar .newPadContainer { @@ -465,24 +466,25 @@ span.fa-folder-open { height: 100%; } #driveToolbar button { - height: 26px; + height: 24px; + font-size: 14px; } #driveToolbar button.element { border-radius: 2px; background: #888; color: #eee; - font-size: 16px; - border: none; + font-size: 14px; + border: 1px solid #888; font-weight: bold; } #driveToolbar button.element:hover { - box-shadow: 0px 0px 2px #000; + background: #777; } #driveToolbar button.new { padding: 0 5px; } #driveToolbar .dropdown-bar { - margin: 5px 5px; + margin: 2px 2px; line-height: 1em; position: relative; display: inline-block; @@ -516,7 +518,7 @@ span.fa-folder-open { #driveToolbar .path { display: inline-block; height: 100%; - line-height: 40px; + line-height: 30px; cursor: default; width: auto; overflow: hidden; diff --git a/www/drive/file.less b/www/drive/file.less index 825d465b4..a09f02981 100644 --- a/www/drive/file.less +++ b/www/drive/file.less @@ -17,10 +17,14 @@ @toolbar-fg: #555; @toolbar-border-col: #ccc; @toolbar-button-bg: #888; +@toolbar-button-border: #888; +@toolbar-button-bg-hover: #777; @toolbar-button-fg: #eee; @toolbar-path-bg: #fff; @toolbar-path-border: #888; +@button-font-size: 14px; + @size-mobile: 600px; /* PAGE */ @@ -515,7 +519,7 @@ span { #driveToolbar { background: @toolbar-bg; color: @toolbar-fg; - height: 40px; + height: 30px; display: flex; flex-flow: row; border-top: 1px solid @toolbar-border-col; @@ -523,6 +527,7 @@ span { box-shadow: 0 2px 4px rgba(0,0,0,0.2); z-index: 100; box-sizing: content-box; + padding: 0 6px; .newPadContainer { display: inline-block; @@ -530,16 +535,17 @@ span { } button { - height: 26px; + height: 24px; + font-size: @button-font-size; &.element { border-radius: 2px; background: @toolbar-button-bg; color: @toolbar-button-fg; - font-size: 16px; - border: none; + font-size: 14px; + border: 1px solid @toolbar-button-border; font-weight: bold; &:hover { - box-shadow: 0px 0px 2px #000; + background: @toolbar-button-bg-hover; } } &.new { @@ -548,7 +554,7 @@ span { } /* The container
- needed to position the dropdown content */ .dropdown-bar { - margin: 5px 5px; + margin: 2px 2px; line-height: 1em; position: relative; display: inline-block; @@ -583,7 +589,7 @@ span { .path { display: inline-block; height: 100%; - line-height: 40px; + line-height: 30px; cursor: default; width: auto; overflow: hidden;