1
0
قرینه از https://github.com/matomo-org/matomo.git synced 2025-08-22 15:07:44 +00:00
Files
matomo/plugins/Morpheus/stylesheets/general/_forms.less
Ben Burgess e9b3ab180d Update notifications and info boxes styles for accessibility (#21077)
* Update notifications, alerts and info boxes to new design

* Updated demo notifications to add multiline example and comment on close button.

* Replace 89 matomo font glyphs with new icons, consolidated icon-info2 usage to icon-info, added source SVG files for new icons

* Bump stalled tests

* built vue files

* Updated Matomo font icons scale, tweak for export icon css, updated reporting actions icon

* Updated UI test screenshots for icon and notification changes

* Updated UI test screenshots after rebase

* Various notification, style and icon improvements

- Temporarily updated submodule references for testing
- Updated the 25 outstanding icons used with core, both with .svg files and updated font files
- icon-done now uses the same thin tick icon as icon-ok
- icon-plus-square and icon-minus-square now have squares again
- New icons icon-add1 and icon-remove have added
- New icons icon-chevron-right and icon-chevron-left have been added
- Updated mobile down menu, dashboard settings, site selector, fieldExandableSelect and reporting menu to use a chevron as before
- The Morpheus UI demo icons section has been tidied to only show the new icon set
- Fixed link colour on marketplace metadata sidebar
- Fixed colour on marketplace plugin tile more link
- Fixed privacy manager opt out non-standard notification
- Increased the size of the warning icon on user permissions menu
- Adjusted help notification background colour
- Reverted three UI tests from a previous commit which were not related to style changes

* Update notifications, alerts and info boxes to new design

* Replace 89 matomo font glyphs with new icons, consolidated icon-info2 usage to icon-info, added source SVG files for new icons

* Bump stalled tests

* Updated Matomo font icons scale, tweak for export icon css, updated reporting actions icon

* Updated UI test screenshots for icon and notification changes

* built vue files

* Bump stalled tests again

* Updated font with scaling tweaks

* Update UI screenshots after font change

* Update plugins/Marketplace/stylesheets/marketplace.less

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Update plugins/Marketplace/stylesheets/marketplace.less

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Fix incorrect UI test screenshots for visitor map and profile action tooltip

* Fix missing admin menu platform icon

* Password changed confirmation style updated to standard info box

* Update submodule references

* Update UI test screenshots

* update submodules

* updates expected UI test files

* update submodules

* update submodules

* use correct menu item

* built vue files

* submodule updates

* updates expected UI test files

* improve menu icon

---------

Co-authored-by: bx80 <bx80@users.noreply.github.com>
Co-authored-by: Stefan Giehl <stefan@matomo.org>
Co-authored-by: sgiehl <sgiehl@users.noreply.github.com>
2023-08-16 23:17:57 +02:00

135 خطوط
3.5 KiB
Plaintext

.form-group {
margin-bottom: 20px;
margin-top: 20px;
label.siteSelectorLabel {
position: relative;
top: -7px;
left: 0;
font-size: 13px;
}
label.fieldRadioTitle {
padding-bottom: 10px;
display: inline-block;
color: #9e9e9e;
font-size: 13px;
}
> h3 {
padding-bottom: 16px !important;
}
.form-help {
background-color: #f0f0f0;
color: #505050;
padding: 20px 20px 20px 20px;
border: 1px solid rgba(0, 0, 0, 0);
border-radius: 2px;
font-size: 14px;
position: relative;
}
label {
color: #76838f;
.form-description {
font-size: 90%;
font-style: italic;
&::before {
content: '(';
}
&::after {
content: ')';
}
}
}
.inline-help .inline-help-node {
display: block;
}
}
.inline-help-node {
display: none;
}
.input-field .prefix {
color: @theme-color-text-lighter;
}
input.browser-default {
box-sizing: border-box;
margin: 0;
height: auto;
}
.progress .determinate {
background-color: @theme-color-brand !important;
}
[type="checkbox"]:checked + span:not(.lever):before,
[type="checkbox"]:checked + label::before {
border-right-color: @theme-color-brand;
border-bottom-color: @theme-color-brand;
}
nav.blue-grey.darken-3 {
background-color: @theme-color-header-background !important;
}
[type="radio"]:checked + label::after,
[type="radio"].with-gap:checked + label::after,
[type="radio"]:checked + span::after {
background-color: @theme-color-brand;
border-color: @theme-color-brand;
}
input:not([type]):focus:not([readonly]),
input[type=text]:not(.browser-default):focus:not([readonly]),
input[type=password]:not(.browser-default):focus:not([readonly]),
input[type=email]:not(.browser-default):focus:not([readonly]),
input[type=url]:not(.browser-default):focus:not([readonly]),
input[type=time]:not(.browser-default):focus:not([readonly]),
input[type=date]:not(.browser-default):focus:not([readonly]),
input[type=datetime]:not(.browser-default):focus:not([readonly]),
input[type=datetime-local]:not(.browser-default):focus:not([readonly]),
input[type=tel]:not(.browser-default):focus:not([readonly]),
input[type=number]:not(.browser-default):focus:not([readonly]),
input[type=search]:not(.browser-default):focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
border-bottom-color: @theme-color-brand;
box-shadow: 0 1px 0 0 @theme-color-brand;
}
input:not([type]):focus:not([readonly]) + label,
input[type=text]:not(.browser-default):focus:not([readonly]) + label,
input[type=password]:not(.browser-default):focus:not([readonly]) + label,
input[type=email]:not(.browser-default):focus:not([readonly]) + label,
input[type=url]:not(.browser-default):focus:not([readonly]) + label,
input[type=time]:not(.browser-default):focus:not([readonly]) + label,
input[type=date]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime-local]:not(.browser-default):focus:not([readonly]) + label,
input[type=tel]:not(.browser-default):focus:not([readonly]) + label,
input[type=number]:not(.browser-default):focus:not([readonly]) + label,
input[type=search]:not(.browser-default):focus:not([readonly]) + label,
textarea.materialize-textarea:focus:not([readonly]) + label {
color: @theme-color-brand;
}
abbr[title] {
border-bottom: 1px dotted;
text-decoration: none;
}
.select-wrapper input.select-dropdown:focus {
border-bottom-color: @theme-color-brand;
}
textarea.materialize-textarea {
min-height: 100px;
}