From 7945982eeee522e9f606305386c645454b417e75 Mon Sep 17 00:00:00 2001 From: Martin Ruiz Date: Thu, 18 Apr 2024 15:01:17 -0700 Subject: [PATCH] [UI] Add new themes to User pages (#9914) * [UI] Add new themes to User pages --- src/Bootstrap/dist/css/bootstrap-theme.css | 38 +++++-- src/Bootstrap/dist/css/bootstrap.css | 106 ++++++++++++++---- src/Bootstrap/less/buttons.less | 2 + src/Bootstrap/less/forms.less | 23 ++-- src/Bootstrap/less/theme/base.less | 12 ++ .../less/theme/page-admin-index.less | 2 +- src/Bootstrap/less/theme/page-api-keys.less | 10 +- .../less/theme/page-delete-package.less | 2 +- src/Bootstrap/less/theme/page-downloads.less | 2 +- .../less/theme/page-manage-owners.less | 2 +- .../less/theme/page-manage-packages.less | 2 +- src/Bootstrap/less/theme/page-sign-in.less | 2 +- src/Bootstrap/less/theme/themes.less | 4 + src/Bootstrap/less/variables.less | 2 +- src/NuGetGallery/ExtensionMethods.cs | 27 +++-- .../Views/Packages/ReportMyPackage.cshtml | 2 +- src/NuGetGallery/Views/Pages/Contact.cshtml | 12 +- .../Views/Pages/_Enable2FA.cshtml | 8 +- .../Views/Pages/_TransformOrLink.cshtml | 4 +- .../Views/Shared/ListPackages.cshtml | 11 +- src/NuGetGallery/Views/Users/ApiKeys.cshtml | 51 +++++---- .../Views/Users/Organizations.cshtml | 2 +- src/NuGetGallery/Views/Users/Packages.cshtml | 6 +- .../Views/Users/ResetPassword.cshtml | 6 +- .../Users/TransformToOrganization.cshtml | 6 +- ...UserAccountChangeExternalCredential.cshtml | 6 +- .../Users/_UserAccountChangePassword.cshtml | 16 +-- .../_UserAccountLinkExternalCredential.cshtml | 4 +- 28 files changed, 239 insertions(+), 131 deletions(-) diff --git a/src/Bootstrap/dist/css/bootstrap-theme.css b/src/Bootstrap/dist/css/bootstrap-theme.css index 7eb8b202b1..8c5378a93a 100644 --- a/src/Bootstrap/dist/css/bootstrap-theme.css +++ b/src/Bootstrap/dist/css/bootstrap-theme.css @@ -487,6 +487,16 @@ img.reserved-indicator-icon { color: red; content: " *"; } +.sign-in-link a, +.sign-in-link a:hover, +.sign-in-link a:focus, +.sign-in-link a:active { + color: var(--brandForegroundLinkRest); +} +.sign-in-link a:hover, +.sign-in-link a:focus { + text-decoration: underline; +} @media (max-width: 767.9px) { .hidden-xs { display: none !important; @@ -1216,7 +1226,7 @@ p.frameworktableinfo-text { } .page-admin-index h2 .ms-Icon { font-size: 2.4rem; - top: 2px; + top: 1px; } .page-admin-index p { margin-bottom: 16px; @@ -1284,7 +1294,7 @@ p.frameworktableinfo-text { margin-bottom: 0; } .page-api-keys .upsert-api-key .available-packages .panel-body { - padding-top: 0; + padding-top: 2px; padding-bottom: 0; } @media (max-width: 768px) { @@ -1355,7 +1365,7 @@ p.frameworktableinfo-text { } } .page-api-keys .upsert-api-key .required:after { - color: red; + color: var(--statusDangerStroke2Rest); content: " *"; } .page-api-keys .add-api-key { @@ -1374,7 +1384,7 @@ p.frameworktableinfo-text { top: 2px; } .page-api-keys .api-key-details .icon-details { - color: #666666; + color: var(--neutralForeground1Rest); margin: 10px 0; } .page-api-keys .api-key-details .icon-details li { @@ -1383,7 +1393,7 @@ p.frameworktableinfo-text { .page-api-keys .api-key-details .icon-details li + li { margin-left: 10px; padding-left: 10px; - border-left: 1px solid #dbdbdb; + border-left: 1px solid var(--neutralForeground1Rest); } .page-api-keys .api-key-details .package-list li { overflow-y: visible; @@ -1392,7 +1402,7 @@ p.frameworktableinfo-text { border-top: 1px solid #dbdbdb; } .page-api-keys .revoke-api-key { - color: #df001e; + color: var(--statusDangerStroke2Rest); } .page-blog { margin-top: 33px; @@ -2033,7 +2043,7 @@ p.frameworktableinfo-text { display: none; } .page-downloads .older-versions-dropdown p { - color: #e50000; + color: var(--statusDangerForeground3Rest); font-size: 14px; display: none; } @@ -2631,7 +2641,7 @@ p.frameworktableinfo-text { margin-bottom: 10px; } .page-manage-owners .current-owner .remove-owner a { - color: #df001e; + color: var(--statusDangerForeground3Rest); } .page-manage-owners .current-owner .remove-owner a .ms-Icon { position: relative; @@ -2646,7 +2656,7 @@ p.frameworktableinfo-text { } .page-manage-owners .current-owner .remove-owner a:hover, .page-manage-owners .current-owner .remove-owner a:active { - color: #ac0017; + color: #960b18; } .page-manage-owners .current-owner .remove-owner-disabled a:hover, .page-manage-owners .current-owner .remove-owner-disabled a:active { @@ -2694,7 +2704,7 @@ p.frameworktableinfo-text { } .page-manage-packages .manage-package-listing .ms-Icon { position: relative; - top: 2px; + top: 1px; } .page-manage-packages .manage-package-listing .package-controls form { display: inline-block; @@ -2723,7 +2733,7 @@ p.frameworktableinfo-text { display: inline-block; } .page-delete-package #show-delete-package { - color: #df001e; + color: var(--statusDangerForeground3Rest); } .page-profile .profile-title { margin-top: 50px; @@ -2873,7 +2883,7 @@ p.frameworktableinfo-text { margin: 20px; } .page-sign-in .required:after { - color: red; + color: var(--statusDangerForeground3Rest); content: " *"; } .page-statistics-most-downloaded .show-all-packages-toggle { @@ -3498,6 +3508,8 @@ p.frameworktableinfo-text { --statusAwayBackground3Rest: var(--marigoldPrimary, #eaa300); --statusDangerBackground1Rest: var(--cranberryTint60, #fdf3f4); --statusDangerBackground3Rest: var(--cranberryPrimary, #c50f1f); + --statusDangerBackground3Hover: #b10e1c; + --statusDangerBackground3Pressed: #960b18; --statusDangerForeground1Rest: var(--cranberryShade10, #b10e1c); --statusDangerForeground3Rest: var(--cranberryPrimary, #c50f1f); --statusDangerStroke1Rest: var(--cranberryTint40, #eeacb2); @@ -3840,6 +3852,8 @@ p.frameworktableinfo-text { --statusAwayBackground3Rest: var(--marigoldPrimary, #eaa300); --statusDangerBackground1Rest: var(--cranberryShade40, #3b0509); --statusDangerBackground3Rest: var(--cranberryPrimary, #c50f1f); + --statusDangerBackground3Hover: #b10e1c; + --statusDangerBackground3Pressed: #960b18; --statusDangerForeground1Rest: var(--cranberryTint40, #eeacb2); --statusDangerForeground3Rest: var(--cranberryTint30, #dc626d); --statusDangerStroke1Rest: var(--cranberryPrimary, #c50f1f); diff --git a/src/Bootstrap/dist/css/bootstrap.css b/src/Bootstrap/dist/css/bootstrap.css index 9db1ba33c6..2ef5e92642 100644 --- a/src/Bootstrap/dist/css/bootstrap.css +++ b/src/Bootstrap/dist/css/bootstrap.css @@ -1835,7 +1835,7 @@ input[type="search"] { appearance: none; } .brand-radio { - color: var(--neutralForeground3Rest); + color: var(--neutralForeground1Rest); padding-right: 8px; display: -webkit-box; display: -webkit-flex; @@ -1855,7 +1855,7 @@ input[type="search"] { cursor: pointer; width: 16px; height: 16px; - border-radius: 50%; + border-radius: 50% !important; border: 1px solid var(--neutralStrokeAccessibleRest); margin: 8px; } @@ -1874,7 +1874,7 @@ input[type="search"] { } .brand-radio:hover input[type="radio"]:not(:checked) { border-color: var(--neutralStrokeAccessibleHover); - color: var(--neutra2Foreground1Rest); + color: var(--neutralForeground1Rest); } .brand-radio:active input[type="radio"]:checked { background: -webkit-radial-gradient(var(--brandStrokeCompoundPressed) 0%, var(--brandStrokeCompoundPressed) 40%, transparent 50%, transparent); @@ -1911,7 +1911,7 @@ input[type="checkbox"].brand-checkbox { width: 16px; height: 16px; border: 1px solid var(--neutralStrokeAccessibleRest); - border-radius: 2px; + border-radius: 2px !important; position: relative !important; } input[type="checkbox"].brand-checkbox:checked::after { @@ -1965,7 +1965,7 @@ input[type="checkbox"].brand-checkbox:focus { border-radius: 1px; } .brand-checkbox { - color: var(--neutralForeground2Rest); + color: var(--neutralForeground1Rest); padding-right: 8px; display: -webkit-box; display: -webkit-flex; @@ -1985,7 +1985,7 @@ input[type="checkbox"].brand-checkbox:focus { width: 16px; height: 16px; border: 1px solid var(--neutralStrokeAccessibleRest); - border-radius: 2px; + border-radius: 2px !important; margin: 8px !important; position: relative !important; } @@ -2346,6 +2346,68 @@ textarea.textarea-brand::-webkit-input-placeholder, input.input-brand::-webkit-input-placeholder { color: var(--neutralForeground4Rest); } +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter { + color: var(--neutralForeground1Rest); + background-color: var(--neutralBackground1Rest); + border-radius: 4px; + border: 1px solid var(--neutralStroke1Rest); + border-bottom: 2px solid var(--neutralStrokeAccessibleRest); + outline: none !important; + -webkit-box-shadow: none !important; + box-shadow: none !important; +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter:hover { + border: 1px solid var(--neutralStroke1Hover); + border-bottom: 2px solid var(--neutralStrokeAccessibleHover); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter:focus, +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter:focus-within, +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter:focus-visible { + border: 1px solid var(--neutralStroke1Rest); + border-bottom: 2px solid var(--brandStrokeCompoundRest); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter[aria-invalid='true'] { + border-color: var(--statusDangerStroke2Rest); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter[disabled] { + background-color: transparent; + color: var(--neutralForegroundDisabledRest); + border-color: var(--neutralStrokeDisabledRest); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter[disabled]::-moz-placeholder { + color: var(--neutralForegroundDisabledRest); + opacity: 1; +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter[disabled]:-ms-input-placeholder { + color: var(--neutralForegroundDisabledRest); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter[disabled]::-webkit-input-placeholder { + color: var(--neutralForegroundDisabledRest); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter[readonly] { + background-color: transparent; + border-color: var(--neutralStrokeDisabledRest); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter[readonly]::-moz-placeholder { + color: var(--neutralForeground1Rest); + opacity: 1; +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter[readonly]:-ms-input-placeholder { + color: var(--neutralForeground1Rest); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter[readonly]::-webkit-input-placeholder { + color: var(--neutralForeground1Rest); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter::-moz-placeholder { + color: var(--neutralForeground4Rest); + opacity: 1; +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter:-ms-input-placeholder { + color: var(--neutralForeground4Rest); +} +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter::-webkit-input-placeholder { + color: var(--neutralForeground4Rest); +} @media screen and (-webkit-min-device-pixel-ratio: 0) { input[type="date"].form-control, input[type="time"].form-control, @@ -3110,26 +3172,26 @@ fieldset[disabled] .btn-warning.focus { } .btn-danger { color: #fff; - background-color: #df001e; - border-color: #c6001b; + background-color: #c50f1f; + border-color: #ad0d1b; } .btn-danger:focus, .btn-danger.focus { color: #fff; - border-color: #460009; + border-color: #370409; } .btn-danger:hover { color: #fff; - background-color: #ac0017; - border-color: #880012; + background-color: #960b18; + border-color: #740912; } .btn-danger:active, .btn-danger.active, .open > .dropdown-toggle.btn-danger { color: #fff; - background-color: #ac0017; + background-color: #960b18; background-image: none; - border-color: #880012; + border-color: #740912; } .btn-danger:active:hover, .btn-danger.active:hover, @@ -3141,8 +3203,8 @@ fieldset[disabled] .btn-warning.focus { .btn-danger.active.focus, .open > .dropdown-toggle.btn-danger.focus { color: #fff; - background-color: #880012; - border-color: #460009; + background-color: #740912; + border-color: #370409; } .btn-danger.disabled:hover, .btn-danger[disabled]:hover, @@ -3153,11 +3215,11 @@ fieldset[disabled] .btn-danger:focus, .btn-danger.disabled.focus, .btn-danger[disabled].focus, fieldset[disabled] .btn-danger.focus { - background-color: #df001e; - border-color: #c6001b; + background-color: #c50f1f; + border-color: #ad0d1b; } .btn-danger .badge { - color: #df001e; + color: #c50f1f; background-color: #fff; } .btn-brand { @@ -3301,10 +3363,12 @@ fieldset[disabled] .btn-danger.focus { .btn-brand-danger:hover, .btn-brand-danger:focus:hover { color: var(--neutralForegroundStaticInvertedRest); + background-color: var(--statusDangerBackground3Hover); } .btn-brand-danger:active, .btn-brand-danger:active:focus { color: var(--neutralForegroundStaticInvertedRest); + background-color: var(--statusDangerBackground3Pressed); } .btn-brand-danger:focus-within, .btn-brand-danger:focus-visible, @@ -4807,11 +4871,11 @@ a.label:focus { background-color: #bc6d00; } .label-danger { - background-color: #df001e; + background-color: #c50f1f; } .label-danger[href]:hover, .label-danger[href]:focus { - background-color: #ac0017; + background-color: #960b18; } .badge { display: inline-block; @@ -5154,7 +5218,7 @@ a.thumbnail.active { background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); } .progress-bar-danger { - background-color: #df001e; + background-color: #c50f1f; } .progress-striped .progress-bar-danger { background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); diff --git a/src/Bootstrap/less/buttons.less b/src/Bootstrap/less/buttons.less index c25c8a3029..aad3da5d91 100644 --- a/src/Bootstrap/less/buttons.less +++ b/src/Bootstrap/less/buttons.less @@ -227,11 +227,13 @@ &:hover, &:focus:hover { color: var(--neutralForegroundStaticInvertedRest); + background-color: var(--statusDangerBackground3Hover); } &:active, &:active:focus { color: var(--neutralForegroundStaticInvertedRest); + background-color: var(--statusDangerBackground3Pressed); } &:focus-within, diff --git a/src/Bootstrap/less/forms.less b/src/Bootstrap/less/forms.less index 4b10950d53..e535e2dcd4 100644 --- a/src/Bootstrap/less/forms.less +++ b/src/Bootstrap/less/forms.less @@ -60,7 +60,7 @@ input[type="search"] { } .brand-radio { - color: var(--neutralForeground3Rest); + color: var(--neutralForeground1Rest); padding-right: 8px; display: flex; cursor: pointer; @@ -78,7 +78,7 @@ input[type="search"] { width: 16px; height: 16px; - border-radius: 50%; + border-radius: 50% !important; border: 1px solid var(--neutralStrokeAccessibleRest); margin: 8px; } @@ -89,25 +89,25 @@ input[type="search"] { } &:hover { - input[type="radio"]:checked{ + input[type="radio"]:checked { background: radial-gradient(var(--brandForegroundCompoundHover) 0%, var(--brandForegroundCompoundHover) 40%, transparent 50%, transparent); border-color: var(--brandForegroundCompoundHover); color: var(--neutralForeground1Rest); } - input[type="radio"]:not(:checked){ + input[type="radio"]:not(:checked) { border-color: var(--neutralStrokeAccessibleHover); - color: var(--neutra2Foreground1Rest); + color: var(--neutralForeground1Rest); } } &:active { - input[type="radio"]:checked{ + input[type="radio"]:checked { background: radial-gradient(var(--brandStrokeCompoundPressed) 0%, var(--brandStrokeCompoundPressed) 40%, transparent 50%, transparent); border-color: var(--brandStrokeCompoundPressed); } - input[type="radio"]:not(:checked){ + input[type="radio"]:not(:checked) { color: var(--neutralForeground1Rest); border-color: var(--neutralStrokeAccessiblePressed); } @@ -137,7 +137,7 @@ input[type="checkbox"].brand-checkbox { width: 16px; height: 16px; border: 1px solid var(--neutralStrokeAccessibleRest); - border-radius: 2px; + border-radius: 2px !important; position: relative !important; } @@ -194,7 +194,7 @@ input[type="checkbox"].brand-checkbox:focus { } .brand-checkbox { - color: var(--neutralForeground2Rest); + color: var(--neutralForeground1Rest); padding-right: 8px; display: flex; cursor: pointer; @@ -211,7 +211,7 @@ input[type="checkbox"].brand-checkbox:focus { width: 16px; height: 16px; border: 1px solid var(--neutralStrokeAccessibleRest); - border-radius: 2px; + border-radius: 2px !important; margin: 8px !important; position: relative !important; } @@ -475,6 +475,9 @@ textarea.textarea-brand, input.input-brand { .input-base-class(); } +.multi-select-dropdown .dropdown-content .dropdown-selector .dropdown-filter { + .input-base-class(); +} // Special styles for iOS temporal inputs // diff --git a/src/Bootstrap/less/theme/base.less b/src/Bootstrap/less/theme/base.less index be2464985d..25212eb8bc 100644 --- a/src/Bootstrap/less/theme/base.less +++ b/src/Bootstrap/less/theme/base.less @@ -590,6 +590,18 @@ img.reserved-indicator-icon { content: " *"; } +.sign-in-link a, +.sign-in-link a:hover, +.sign-in-link a:focus, +.sign-in-link a:active { + color: var(--brandForegroundLinkRest); +} + +.sign-in-link a:hover, +.sign-in-link a:focus { + text-decoration: underline; +} + // Workaround. See https://github.com/NuGet/NuGetGallery/issues/8264 @media (max-width: 767.9px) { .hidden-xs { diff --git a/src/Bootstrap/less/theme/page-admin-index.less b/src/Bootstrap/less/theme/page-admin-index.less index 37bafde1f1..bc6ef78811 100644 --- a/src/Bootstrap/less/theme/page-admin-index.less +++ b/src/Bootstrap/less/theme/page-admin-index.less @@ -7,7 +7,7 @@ .ms-Icon { font-size: 2.4rem; - top: 2px; + top: 1px; } } diff --git a/src/Bootstrap/less/theme/page-api-keys.less b/src/Bootstrap/less/theme/page-api-keys.less index 02a48590e1..4ec63e39b7 100644 --- a/src/Bootstrap/less/theme/page-api-keys.less +++ b/src/Bootstrap/less/theme/page-api-keys.less @@ -41,7 +41,7 @@ .available-packages { .panel-body { - padding-top: 0; + padding-top: 2px; padding-bottom: 0; @media (max-width: @screen-sm-min) { height: 200px; @@ -95,7 +95,7 @@ } .required:after { - color: red; + color: var(--statusDangerStroke2Rest); content: " *"; } } @@ -119,7 +119,7 @@ } .icon-details { - color: @gray-light; + color: var(--neutralForeground1Rest); margin: @padding-large-vertical 0; li { @@ -129,7 +129,7 @@ li + li { margin-left: @padding-small-horizontal; padding-left: @padding-small-horizontal; - border-left: 1px solid @gray-lighter; + border-left: 1px solid var(--neutralForeground1Rest); } } .package-list { @@ -145,6 +145,6 @@ } .revoke-api-key { - color: @brand-danger + color: var(--statusDangerStroke2Rest); } } diff --git a/src/Bootstrap/less/theme/page-delete-package.less b/src/Bootstrap/less/theme/page-delete-package.less index 893142e644..3ebbf2da61 100644 --- a/src/Bootstrap/less/theme/page-delete-package.less +++ b/src/Bootstrap/less/theme/page-delete-package.less @@ -6,6 +6,6 @@ } #show-delete-package { - color: @brand-danger; + color: var(--statusDangerForeground3Rest); } } \ No newline at end of file diff --git a/src/Bootstrap/less/theme/page-downloads.less b/src/Bootstrap/less/theme/page-downloads.less index 3e0b009a43..138ce5bca5 100644 --- a/src/Bootstrap/less/theme/page-downloads.less +++ b/src/Bootstrap/less/theme/page-downloads.less @@ -27,7 +27,7 @@ } p { - color: #e50000; + color: var(--statusDangerForeground3Rest); font-size: 14px; display: none; } diff --git a/src/Bootstrap/less/theme/page-manage-owners.less b/src/Bootstrap/less/theme/page-manage-owners.less index a05ce9f675..a2b384ccbd 100644 --- a/src/Bootstrap/less/theme/page-manage-owners.less +++ b/src/Bootstrap/less/theme/page-manage-owners.less @@ -13,7 +13,7 @@ margin-bottom: @padding-large-vertical; .remove-owner a { - color: @brand-danger; + color: var(--statusDangerForeground3Rest); .ms-Icon { position: relative; diff --git a/src/Bootstrap/less/theme/page-manage-packages.less b/src/Bootstrap/less/theme/page-manage-packages.less index 27fb38c9a2..47c7035e19 100644 --- a/src/Bootstrap/less/theme/page-manage-packages.less +++ b/src/Bootstrap/less/theme/page-manage-packages.less @@ -48,7 +48,7 @@ .manage-package-listing { .ms-Icon { position: relative; - top: 2px; + top: 1px; } .package-controls { diff --git a/src/Bootstrap/less/theme/page-sign-in.less b/src/Bootstrap/less/theme/page-sign-in.less index 879285cc8f..7a7d492337 100644 --- a/src/Bootstrap/less/theme/page-sign-in.less +++ b/src/Bootstrap/less/theme/page-sign-in.less @@ -29,7 +29,7 @@ } .required:after{ - color: red; + color: var(--statusDangerForeground3Rest); content: " *"; } } diff --git a/src/Bootstrap/less/theme/themes.less b/src/Bootstrap/less/theme/themes.less index 5d2a2d1b99..85d0ecd711 100644 --- a/src/Bootstrap/less/theme/themes.less +++ b/src/Bootstrap/less/theme/themes.less @@ -291,6 +291,8 @@ --statusAwayBackground3Rest: var(--marigoldPrimary, #eaa300); --statusDangerBackground1Rest: var(--cranberryTint60, #fdf3f4); --statusDangerBackground3Rest: var(--cranberryPrimary, #c50f1f); + --statusDangerBackground3Hover: #b10e1c; + --statusDangerBackground3Pressed: #960b18; --statusDangerForeground1Rest: var(--cranberryShade10, #b10e1c); --statusDangerForeground3Rest: var(--cranberryPrimary, #c50f1f); --statusDangerStroke1Rest: var(--cranberryTint40, #eeacb2); @@ -699,6 +701,8 @@ --statusAwayBackground3Rest: var(--marigoldPrimary, #eaa300); --statusDangerBackground1Rest: var(--cranberryShade40, #3b0509); --statusDangerBackground3Rest: var(--cranberryPrimary, #c50f1f); + --statusDangerBackground3Hover: #b10e1c; + --statusDangerBackground3Pressed: #960b18; --statusDangerForeground1Rest: var(--cranberryTint40, #eeacb2); --statusDangerForeground3Rest: var(--cranberryTint30, #dc626d); --statusDangerStroke1Rest: var(--cranberryPrimary, #c50f1f); diff --git a/src/Bootstrap/less/variables.less b/src/Bootstrap/less/variables.less index 138bfd4208..1a23ff9131 100644 --- a/src/Bootstrap/less/variables.less +++ b/src/Bootstrap/less/variables.less @@ -20,7 +20,7 @@ @brand-success: #5cb85c; @brand-info: #5bc0de; @brand-warning: #ef8b00; -@brand-danger: #df001e; +@brand-danger: #c50f1f; @verified-color: #068918; diff --git a/src/NuGetGallery/ExtensionMethods.cs b/src/NuGetGallery/ExtensionMethods.cs index 524830aabd..0d6590a273 100644 --- a/src/NuGetGallery/ExtensionMethods.cs +++ b/src/NuGetGallery/ExtensionMethods.cs @@ -197,28 +197,35 @@ public static HtmlString ShowTextAreaFor(this HtmlHelper(this HtmlHelper html, Expression> expression, int rows, int columns, string customClass = "") + { + var htmlAttributes = GetHtmlAttributes(html, expression, customClass: customClass); + return html.TextAreaFor(expression, rows, columns, htmlAttributes); + } + public static MvcHtmlString ShowEnumDropDownListFor( this HtmlHelper html, Expression> expression, + IEnumerable values, string emptyItemText) where TEnum : struct { - var values = Enum - .GetValues(typeof(TEnum)) - .Cast(); - - return ShowEnumDropDownListFor(html, expression, values, emptyItemText); + var htmlAttributes = GetHtmlAttributes(html, expression); + return html.EnumDropDownListFor(expression, values, emptyItemText, htmlAttributes); } public static MvcHtmlString ShowEnumDropDownListFor( this HtmlHelper html, Expression> expression, - IEnumerable values, - string emptyItemText) + string emptyItemText, + string customClass = "") where TEnum : struct { - var htmlAttributes = GetHtmlAttributes(html, expression); - return html.EnumDropDownListFor(expression, values, emptyItemText, htmlAttributes); + var values = Enum + .GetValues(typeof(TEnum)) + .Cast(); + + return ShowEnumDropDownListFor(html, expression, values, emptyItemText, customClass); } public static MvcHtmlString ShowEnumDropDownListFor( @@ -226,7 +233,7 @@ public static MvcHtmlString ShowEnumDropDownListFor( Expression> expression, IEnumerable values, string emptyItemText, - string customClass) + string customClass = "") where TEnum : struct { var htmlAttributes = GetHtmlAttributes(html, expression, customClass: customClass); diff --git a/src/NuGetGallery/Views/Packages/ReportMyPackage.cshtml b/src/NuGetGallery/Views/Packages/ReportMyPackage.cshtml index c064a3376d..d44ab8cbe1 100644 --- a/src/NuGetGallery/Views/Packages/ReportMyPackage.cshtml +++ b/src/NuGetGallery/Views/Packages/ReportMyPackage.cshtml @@ -27,7 +27,7 @@