From 45662b39b035ca21f3ec7673b11b0346c854a81c Mon Sep 17 00:00:00 2001 From: djmaze Date: Fri, 27 Aug 2021 16:30:42 +0200 Subject: [PATCH] Improved and cleanup CSS and language selectors --- dev/Styles/Admin/General.less | 15 ----- dev/Styles/Login.less | 12 +--- dev/Styles/User/SettingsGeneral.less | 15 ----- .../Views/Admin/AdminSettingsGeneral.html | 17 ++---- .../templates/Views/User/SettingsGeneral.html | 6 +- vendors/bootstrap/less/forms.less | 15 ++--- vendors/bootstrap/less/variables.less | 57 +------------------ vendors/bootstrap/less/wells.less | 10 ---- 8 files changed, 14 insertions(+), 133 deletions(-) diff --git a/dev/Styles/Admin/General.less b/dev/Styles/Admin/General.less index 8a90bc85e..1a3704eb6 100644 --- a/dev/Styles/Admin/General.less +++ b/dev/Styles/Admin/General.less @@ -1,20 +1,5 @@ .b-admin-general { - .flag-selector { - padding-top: 5px; - } - - .flag-name { - - border-bottom: 1px dashed #555; - cursor: pointer; - padding: 2px 0; - - &:focus { - outline: 1px; - outline-style: dotted; - } - } } diff --git a/dev/Styles/Login.less b/dev/Styles/Login.less index f1fbe591f..405d130a9 100644 --- a/dev/Styles/Login.less +++ b/dev/Styles/Login.less @@ -82,7 +82,6 @@ .input-block-level { font-size: 18px; height: 40px; - line-height: 20px; padding-left: 12px; } .inputIcon { @@ -90,20 +89,15 @@ } input, .btn { - border: 1px solid none; background: none !important; - text-shadow: none; - box-shadow: none; - + border: 1px solid @glass-m-color; color: @glass-color; - border-color: @glass-m-color; } input { &:placeholder { color: @glass-color; - text-shadow: none; } &:focus, &:hover { @@ -158,10 +152,6 @@ opacity: 0; } - .flag-selector { - margin-bottom: 0; - } - .language-buttons { margin-top: 5px; } diff --git a/dev/Styles/User/SettingsGeneral.less b/dev/Styles/User/SettingsGeneral.less index a5f891dae..ff695dbe1 100644 --- a/dev/Styles/User/SettingsGeneral.less +++ b/dev/Styles/User/SettingsGeneral.less @@ -1,19 +1,4 @@ .b-settings-general { - .flag-selector { - padding-top: 5px; - } - - .flag-name { - - border-bottom: 1px dashed #555; - cursor: pointer; - padding: 2px 0; - - &:focus { - outline: 1px; - outline-style: dotted; - } - } } diff --git a/snappymail/v/0.0.0/app/templates/Views/Admin/AdminSettingsGeneral.html b/snappymail/v/0.0.0/app/templates/Views/Admin/AdminSettingsGeneral.html index 973f7fb7f..82dfd2e1f 100644 --- a/snappymail/v/0.0.0/app/templates/Views/Admin/AdminSettingsGeneral.html +++ b/snappymail/v/0.0.0/app/templates/Views/Admin/AdminSettingsGeneral.html @@ -21,22 +21,15 @@
-
- - -
+ +
-
- - - - - -
+ +
@@ -109,7 +102,7 @@

- + PHP:   diff --git a/snappymail/v/0.0.0/app/templates/Views/User/SettingsGeneral.html b/snappymail/v/0.0.0/app/templates/Views/User/SettingsGeneral.html index 02f169b0c..e1669a602 100644 --- a/snappymail/v/0.0.0/app/templates/Views/User/SettingsGeneral.html +++ b/snappymail/v/0.0.0/app/templates/Views/User/SettingsGeneral.html @@ -13,10 +13,8 @@
-
- - -
+ +
diff --git a/vendors/bootstrap/less/forms.less b/vendors/bootstrap/less/forms.less index 4b57af11b..131b9e2df 100644 --- a/vendors/bootstrap/less/forms.less +++ b/vendors/bootstrap/less/forms.less @@ -45,6 +45,7 @@ button, input, optgroup, select, +.select, textarea { font-family: inherit; font-size: @baseFontSize; @@ -58,6 +59,7 @@ textarea { // Shared size and type resets select, +.select, textarea, input { box-sizing: border-box; @@ -112,7 +114,7 @@ input[type="checkbox"] { } // Make select elements obey height by applying a border -select { +select, .select { appearance: none; background: @inputBackground url("data:image/svg+xml,▾") right center/1em no-repeat border-box; border: 1px solid @inputBorder; @@ -123,6 +125,7 @@ select { // Focus for select, file, radio, and checkbox select:focus, +.select:focus, input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus { @@ -130,16 +133,6 @@ input[type="checkbox"]:focus { } -// Placeholder -// ------------------------- - -// Placeholder text gets special styles; can't be bundled together though for some reason -input::placeholder, -textarea::placeholder { - color: @placeholderText; -} - - // INPUT SIZES // ----------- diff --git a/vendors/bootstrap/less/variables.less b/vendors/bootstrap/less/variables.less index b8197ae42..af6d98500 100644 --- a/vendors/bootstrap/less/variables.less +++ b/vendors/bootstrap/less/variables.less @@ -10,7 +10,6 @@ // Grays // ------------------------- @black: #000; -@grayDarker: #222; @grayDark: #333; @gray: #555; @grayLight: #999; @@ -18,21 +17,8 @@ @white: #fff; -// Accent colors -// ------------------------- -@blue: #049cdb; -@blueDark: #0064cd; -@green: #46a546; -@red: #9d261d; -@yellow: #ffc40d; -@orange: #f89406; -@pink: #c3325f; -@purple: #7a43b6; - - // Scaffolding // ------------------------- -@bodyBackground: @white; @textColor: @grayDark; @@ -70,15 +56,12 @@ @btnSuccessBackground: #84AB04; @btnSuccessBackgroundHighlight: #51a351; -@btnWarningBackground: lighten(@orange, 15%); -@btnWarningBackgroundHighlight: @orange; +@btnWarningBackground: lighten(#f89406, 15%); +@btnWarningBackgroundHighlight: #f89406; @btnDangerBackground: #ee5f5b; @btnDangerBackgroundHighlight: #bd362f; -@btnInverseBackground: #444; -@btnInverseBackgroundHighlight: @grayDarker; - // Forms // ------------------------- @@ -119,11 +102,6 @@ @zindexModal: 1101; -// Input placeholder text color -// ------------------------- -@placeholderText: @grayLight; - - // Hr border color // ------------------------- @hrBorder: @grayLighter; @@ -134,13 +112,6 @@ @wellBackground: #f5f5f5; -// Pagination -// ------------------------- -@paginationBackground: #fff; -@paginationBorder: #ddd; -@paginationActiveBackground: #f5f5f5; - - // Form states and alerts // ------------------------- @warningText: #c09853; @@ -170,27 +141,3 @@ @gridColumnWidth: 60px; @gridGutterWidth: 20px; @gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); - -// 1200px min -@gridColumnWidth1200: 70px; -@gridGutterWidth1200: 30px; -@gridRowWidth1200: (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1)); - -// 768px-979px -@gridColumnWidth768: 42px; -@gridGutterWidth768: 20px; -@gridRowWidth768: (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1)); - - -// Fluid grid -// ------------------------- -@fluidGridColumnWidth: percentage(@gridColumnWidth/@gridRowWidth); -@fluidGridGutterWidth: percentage(@gridGutterWidth/@gridRowWidth); - -// 1200px min -@fluidGridColumnWidth1200: percentage(@gridColumnWidth1200/@gridRowWidth1200); -@fluidGridGutterWidth1200: percentage(@gridGutterWidth1200/@gridRowWidth1200); - -// 768px-979px -@fluidGridColumnWidth768: percentage(@gridColumnWidth768/@gridRowWidth768); -@fluidGridGutterWidth768: percentage(@gridGutterWidth768/@gridRowWidth768); diff --git a/vendors/bootstrap/less/wells.less b/vendors/bootstrap/less/wells.less index 5e37961d1..0f0894963 100644 --- a/vendors/bootstrap/less/wells.less +++ b/vendors/bootstrap/less/wells.less @@ -5,18 +5,8 @@ // Base class .well { - min-height: 20px; - padding: 19px; - margin-bottom: 20px; background-color: @wellBackground; border: 1px solid darken(@wellBackground, 7%); border-radius: 4px; - box-shadow: inset 0 1px 1px rgba(0,0,0,.05); - display: inline-block; -} - -// Sizes -.well-small { padding: 9px; - border-radius: 3px; }