diff --git a/apps/files/css/files.scss b/apps/files/css/files.scss index 5d8a20d86a..05c9de43a2 100644 --- a/apps/files/css/files.scss +++ b/apps/files/css/files.scss @@ -693,9 +693,6 @@ table.dragshadow td.size { .app-files .actions .button.new { position: relative; } -.app-files .actions .button.new .icon { - margin-bottom: 2px; -} .breadcrumb .canDrop > a, #filestable tbody tr.canDrop { diff --git a/core/css/css-variables.scss b/core/css/css-variables.scss index 058e018b41..2f3e8aa648 100644 --- a/core/css/css-variables.scss +++ b/core/css/css-variables.scss @@ -35,6 +35,7 @@ --color-border-dark: $color-border-dark; --border-radius: $border-radius; --border-radius-large: $border-radius-large; + --border-radius-pill: $border-radius-pill; --font-face: $font-face; } diff --git a/core/css/guest.css b/core/css/guest.css index 70fd8706f3..ac12f17162 100644 --- a/core/css/guest.css +++ b/core/css/guest.css @@ -184,7 +184,7 @@ a.button { margin: 5px; padding: 11px 10px 9px; outline: none; - border-radius: 3px; + border-radius: 3px; /* --border-radius */ -webkit-appearance: none; } input[type='submit'], @@ -201,6 +201,7 @@ select { font-weight: bold; color: #555; border: none; + border-radius: 100px; /* --border-radius-pill */ cursor: pointer; } input[type='text'], @@ -233,13 +234,19 @@ input.update-continue { padding: 10px 20px; color: #666 !important; display: inline-block; - border-radius: 3px; + border-radius: 100px; /* --border-radius-pill */ margin: 15px 5px; } .updateAnyways a.updateAnywaysButton:hover { color: #222 !important; } +/* Get rid of the inside dotted line in Firefox */ +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; +} + input.primary, button.primary, a.primary { @@ -397,7 +404,7 @@ form .warning input[type='checkbox']+label { .two-factor-provider { display: flex; - border-radius: 3px; + border-radius: 3px; /* --border-radius */ margin: 12px 0; border: 1px solid transparent; text-align: left; @@ -432,7 +439,7 @@ form .warning input[type='checkbox']+label { width: 100%; padding: 10px; margin: 0 0 5px 0; - border-radius: 3px; + border-radius: 100px; /* --border-radius-pill */ font-size: 20px; } .two-factor-primary { @@ -489,7 +496,7 @@ form .warning input[type='checkbox']+label { box-sizing: border-box; background-color: #0082c9; color: white; - border-radius: 3px; + border-radius: 100px; /* --border-radius-pill */ } /* fixes for update page TODO should be fixed some time in a proper way */ @@ -575,7 +582,7 @@ form #selectDbType label.ui-state-active { color: #fff; text-align: left; word-wrap: break-word; - border-radius: 10px; + border-radius: 10px; /* --border-radius-large */ cursor: default; -moz-user-select: text; -webkit-user-select: text; diff --git a/core/css/header.scss b/core/css/header.scss index a80dbcc6cf..f7c3175bb7 100644 --- a/core/css/header.scss +++ b/core/css/header.scss @@ -81,7 +81,7 @@ .header-right > div > .menu { background-color: var(--color-main-background); filter: drop-shadow(0 1px 5px var(--color-box-shadow)); - border-radius: 0 0 3px 3px; + border-radius: 0 0 var(--border-radius) var(--border-radius); box-sizing: border-box; z-index: 2000; position: absolute; @@ -615,7 +615,7 @@ nav[role='navigation'] { background-color: transparent; color: var(--color-primary-text); border: 0; - border-radius: var(--border-radius); + border-radius: var(--border-radius-pill); height: 34px; width: 0; cursor: pointer; diff --git a/core/css/inputs.scss b/core/css/inputs.scss index 78857b322d..2611e1bb2f 100644 --- a/core/css/inputs.scss +++ b/core/css/inputs.scss @@ -14,7 +14,7 @@ /* Specifically override browser styles */ input, textarea, select, button, div[contenteditable=true], div[contenteditable=false] { - font-family: var(--font-face) + font-family: var(--font-face); } .select2-container-multi .select2-choices .select2-search-field input, .select2-search input, .ui-widget { font-family: var(--font-face) !important; @@ -174,7 +174,9 @@ input[type='button'], input[type='submit'], input[type='reset'] { font-weight: bold; - /* Get rid of the ugly firefox dotted line */ + border-radius: var(--border-radius-pill); + + /* Get rid of the inside dotted line in Firefox */ &::-moz-focus-inner { border: 0; } @@ -662,7 +664,7 @@ input { border: 1px solid var(--color-border-dark); cursor: pointer; position: relative; - border-radius: 3px; + border-radius: var(--border-radius); height: 34px; /* tag wrapper */ .multiselect__tags-wrap { @@ -692,7 +694,7 @@ input { border: 1px solid var(--color-border-dark); display: inline-flex; align-items: center; - border-radius: 3px; + border-radius: var(--border-radius); /* require to override the default width and force the tag to shring properly */ min-width: 0; diff --git a/core/css/publicshareauth.css b/core/css/publicshareauth.css index 2f7622ea22..2206f21dff 100644 --- a/core/css/publicshareauth.css +++ b/core/css/publicshareauth.css @@ -3,10 +3,13 @@ form fieldset { flex-direction: column; } +form fieldset > p { + position: relative; +} + #password { - margin-right: 0 !important; - border-top-right-radius: 0; - border-bottom-right-radius: 0; + margin: 5px 0; + padding-right: 45px; height: 45px; box-sizing: border-box; flex: 1 1 auto; @@ -16,13 +19,10 @@ form fieldset { input[type='submit'], input[type='submit'].icon-confirm { - width: 45px; + position: absolute; + top: 0px; + right: -5px; + width: 45px !important; height: 45px; - margin-left: 0 !important; - border-top-left-radius: 0; - border-bottom-left-radius: 0; -} - -fieldset > p { - display: inline-flex; + background-color: transparent !important; } diff --git a/core/css/variables.scss b/core/css/variables.scss index f105118ada..5a25f07bc3 100644 --- a/core/css/variables.scss +++ b/core/css/variables.scss @@ -73,7 +73,9 @@ $color-border: nc-darken($color-main-background, 7%) !default; // darker border like inputs or very visible elements $color-border-dark: nc-darken($color-main-background, 14%) !default; $border-radius: 3px !default; -$border-radius-large: 10px; +$border-radius-large: 10px !default; +// Pill-style button, value is large so big buttons also have correct roundness +$border-radius-pill: 100px !default; $font-face: 'Nunito', 'Open Sans', Frutiger, Calibri, 'Myriad Pro', Myriad, sans-serif !default;