MDL-83933 theme: Update default icon width

While updating the custom icons for import/export, it was observed
that the default width for FontAwesome icons is 20px instead of
the previously assumed 16px.
This commit adjusts the default width accordingly and resolves several
styles where the width was incorrectly applied.
Additionally, the default icon color has been updated to ensure consistent
appearance across both SVG icons and FontAwesome icons.
This commit is contained in:
Sara Arjona
2024-12-10 13:01:27 +01:00
parent 6ab62a98cd
commit 28846e71c7
7 changed files with 140 additions and 116 deletions
+1 -1
View File
@@ -382,7 +382,7 @@ $blocks-plus-gutter: $blocks-column-width + ( $grid-gutter-width * 0.5 );
.pluscontainer {
border: $border-width solid $primary-light-border;
border-radius: 50%;
width: map-get($iconsizes, 5);
width: map-get($iconwidthsizes, 5);
height: map-get($iconsizes, 5);
}
&:hover {
+4 -4
View File
@@ -39,10 +39,10 @@ p.arrow_button {
}
.btn.btn-icon {
height: ($icon-width + 20px);
height: ($icon-height + 20px);
width: ($icon-width + 20px);
font-size: $icon-width;
line-height: $icon-width;
font-size: $icon-height;
line-height: $icon-height;
padding: 0;
border-radius: 50%;
flex-shrink: 0;
@@ -55,7 +55,7 @@ p.arrow_button {
@each $size, $length in $iconsizes {
&.icon-size-#{$size} {
height: ($length + 20px) !important; /* stylelint-disable-line declaration-no-important */
width: ($length + 20px) !important; /* stylelint-disable-line declaration-no-important */
width: (map-get($iconwidthsizes, $size) + 20px) !important; /* stylelint-disable-line declaration-no-important */
font-size: $length !important; /* stylelint-disable-line declaration-no-important */
line-height: $length !important; /* stylelint-disable-line declaration-no-important */
}
+3 -3
View File
@@ -197,7 +197,7 @@ $divider-hover-color: $primary !default;
.action-menu {
.btn.btn-icon {
height: map-get($iconsizes, 5);
width: map-get($iconsizes, 5);
width: map-get($iconwidthsizes, 5);
@include border-radius();
}
&.section-actions .btn.btn-icon {
@@ -433,7 +433,7 @@ $divider-hover-color: $primary !default;
justify-self: end;
.groupmode-information {
height: map-get($iconsizes, 5);
width: map-get($iconsizes, 5);
width: map-get($iconwidthsizes, 5);
@include border-radius();
}
.groupmode-icon-info {
@@ -780,7 +780,7 @@ $divider-hover-color: $primary !default;
}
.icons-collapse-expand:has(+ h4) {
height: map-get($iconsizes, 4);
width: map-get($iconsizes, 4);
width: map-get($iconwidthsizes, 4);
font-size: $font-size-sm;
}
h4 {
+32 -16
View File
@@ -2,21 +2,32 @@
// Standardize the size, padding and alignment for all icons in Moodle.
// Size of default icons.
$icon-width: 16px;
$icon-width: 20px;
$icon-height: 16px;
// Size of medium icons.
$icon-medium-width: 32px;
$icon-medium-width: 40px;
$icon-medium-height: 32px;
// Size of big icons.
$icon-big-width: 64px;
$icon-big-width: 80px;
$icon-big-height: 64px;
// Size of icon boxes.
$icon-box-width: 48px;
$icon-box-width: 60px;
$icon-box-height: 48px;
// stylelint-disable
$iconsizes: () !default;
$iconsizes: map-merge((
0: 0,
1: ($icon-height * .25),
2: ($icon-height * .5),
3: $icon-height,
4: ($icon-height * 1.5),
5: ($icon-height * 2),
6: ($icon-height * 2.5),
7: ($icon-height * 3)
), $iconsizes);
$iconwidthsizes: () !default;
$iconwidthsizes: map-merge((
0: 0,
1: ($icon-width * .25),
2: ($icon-width * .5),
@@ -25,7 +36,8 @@ $iconsizes: map-merge((
5: ($icon-width * 2),
6: ($icon-width * 2.5),
7: ($icon-width * 3)
), $iconsizes);
), $iconwidthsizes);
// stylelint-enable
// This mixin change an icon color using filters.
@@ -56,8 +68,12 @@ $iconsizes: map-merge((
filter: url($svg-url);
}
a i.icon {
color: $body-color;
}
.icon {
max-width: map-get($iconsizes, 4);
max-width: map-get($iconwidthsizes, 4);
max-height: map-get($iconsizes, 4);
margin: 0;
padding: 0;
@@ -85,14 +101,14 @@ $iconsizes: map-merge((
}
&.emoticon {
max-width: map-get($iconsizes, 3);
max-width: map-get($iconwidthsizes, 3);
max-height: map-get($iconsizes, 3);
}
}
// Force size for the SVG icons.
img.icon {
width: 16px;
width: 20px;
height: 16px;
}
@@ -144,7 +160,7 @@ img.icon {
.icon-size-#{$size} {
.icon {
height: $length !important; /* stylelint-disable-line declaration-no-important */
width: $length !important; /* stylelint-disable-line declaration-no-important */
width: map-get($iconwidthsizes, $size) !important; /* stylelint-disable-line declaration-no-important */
font-size: $length !important; /* stylelint-disable-line declaration-no-important */
}
}
@@ -191,11 +207,11 @@ img.icon {
.activityicon,
.icon {
margin: 0;
font-size: $icon-medium-width;
height: $icon-medium-width;
width: $icon-medium-height;
max-height: $icon-medium-width;
max-width: $icon-medium-height;
font-size: $icon-medium-height;
height: $icon-medium-height;
width: $icon-medium-width;
max-height: $icon-medium-height;
max-width: $icon-medium-width;
}
&.small {
width: $activity-iconcontainer-width - 10px;
@@ -205,9 +221,9 @@ img.icon {
}
&.smaller {
width: $activity-iconcontainer-width - 20px;
height: $activity-iconcontainer-width - 20px;
height: $activity-iconcontainer-height - 20px;
max-width: $activity-iconcontainer-width - 20px;
max-height: $activity-iconcontainer-width - 20px;
max-height: $activity-iconcontainer-height - 20px;
.activityicon {
width: $icon-medium-width;
height: $icon-medium-height;
+2 -2
View File
@@ -499,7 +499,7 @@ $message-day-color: color-yiq($message-app-bg) !default;
}
.btn.btn-link.btn-icon {
height: $icon-width;
height: $icon-height;
width: $icon-width;
padding: 0;
border-radius: 50%;
@@ -508,7 +508,7 @@ $message-day-color: color-yiq($message-app-bg) !default;
@each $size, $length in $iconsizes {
&.icon-size-#{$size} {
height: ($length + 20px) !important; /* stylelint-disable-line declaration-no-important */
width: ($length + 20px) !important; /* stylelint-disable-line declaration-no-important */
width: (map-get($iconwidthsizes, $size) + 20px) !important; /* stylelint-disable-line declaration-no-important */
}
}
}
+49 -45
View File
@@ -26155,8 +26155,12 @@ body.behat-site .action-menu .dropdown-subpanel-content.show {
outline: 0;
}
a i.icon {
color: #1d2125;
}
.icon {
max-width: 24px;
max-width: 30px;
max-height: 24px;
margin: 0;
padding: 0;
@@ -26168,25 +26172,25 @@ body.behat-site .action-menu .dropdown-subpanel-content.show {
}
.icon.iconsize-medium {
font-size: 32px;
width: 32px;
width: 40px;
height: 32px;
max-width: 32px;
max-width: 40px;
max-height: 32px;
}
.icon.iconsize-big {
width: 64px;
width: 80px;
height: 64px;
max-width: 64px;
max-width: 80px;
max-height: 64px;
font-size: 64px;
}
.icon.emoticon {
max-width: 16px;
max-width: 20px;
max-height: 16px;
}
img.icon {
width: 16px;
width: 20px;
height: 16px;
}
@@ -26223,7 +26227,7 @@ img.icon {
}
.icon-large > .icon {
width: 32px;
width: 40px;
height: 32px;
}
@@ -26235,43 +26239,43 @@ img.icon {
.icon-size-1 .icon {
height: 4px !important; /* stylelint-disable-line declaration-no-important */
width: 4px !important; /* stylelint-disable-line declaration-no-important */
width: 5px !important; /* stylelint-disable-line declaration-no-important */
font-size: 4px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-2 .icon {
height: 8px !important; /* stylelint-disable-line declaration-no-important */
width: 8px !important; /* stylelint-disable-line declaration-no-important */
width: 10px !important; /* stylelint-disable-line declaration-no-important */
font-size: 8px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-3 .icon {
height: 16px !important; /* stylelint-disable-line declaration-no-important */
width: 16px !important; /* stylelint-disable-line declaration-no-important */
width: 20px !important; /* stylelint-disable-line declaration-no-important */
font-size: 16px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-4 .icon {
height: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 30px !important; /* stylelint-disable-line declaration-no-important */
font-size: 24px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-5 .icon {
height: 32px !important; /* stylelint-disable-line declaration-no-important */
width: 32px !important; /* stylelint-disable-line declaration-no-important */
width: 40px !important; /* stylelint-disable-line declaration-no-important */
font-size: 32px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-6 .icon {
height: 40px !important; /* stylelint-disable-line declaration-no-important */
width: 40px !important; /* stylelint-disable-line declaration-no-important */
width: 50px !important; /* stylelint-disable-line declaration-no-important */
font-size: 40px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-7 .icon {
height: 48px !important; /* stylelint-disable-line declaration-no-important */
width: 48px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
font-size: 48px !important; /* stylelint-disable-line declaration-no-important */
}
@@ -26312,9 +26316,9 @@ img.icon {
margin: 0;
font-size: 32px;
height: 32px;
width: 32px;
width: 40px;
max-height: 32px;
max-width: 32px;
max-width: 40px;
}
.activityiconcontainer.small {
width: 42px;
@@ -26329,9 +26333,9 @@ img.icon {
max-height: 32px;
}
.activityiconcontainer.smaller .activityicon {
width: 32px;
width: 40px;
height: 32px;
max-width: 32px;
max-width: 40px;
max-height: 32px;
}
@@ -26366,7 +26370,7 @@ img.icon {
}
.icon-box {
width: 48px;
width: 60px;
height: 48px;
display: inline-flex;
justify-content: center;
@@ -26377,7 +26381,7 @@ img.icon {
}
.icon-box .icon {
margin: 0;
height: 32px;
height: 40px;
width: 32px;
}
@@ -27329,7 +27333,7 @@ aside[id^=block-region-side-] .block_recentlyaccesseditems .card:nth-of-type(n+4
.block-add .pluscontainer {
border: 1px solid #3f89cc;
border-radius: 50%;
width: 32px;
width: 40px;
height: 32px;
}
.block-add:hover {
@@ -28164,7 +28168,7 @@ table.calendartable caption {
}
.course-section .action-menu .btn.btn-icon {
height: 32px;
width: 32px;
width: 40px;
border-radius: 0.5rem;
}
.course-section .action-menu.section-actions .btn.btn-icon {
@@ -28762,7 +28766,7 @@ table.calendartable caption {
}
.activity-item .activity-groupmode-info .groupmode-information {
height: 32px;
width: 32px;
width: 40px;
border-radius: 0.5rem;
}
.activity-item .activity-groupmode-info .groupmode-icon-info {
@@ -29053,7 +29057,7 @@ table.calendartable caption {
}
.activity.subsection .section .icons-collapse-expand:has(+ h4) {
height: 24px;
width: 24px;
width: 30px;
font-size: 0.8203125rem;
}
.activity.subsection .section h4 {
@@ -29567,7 +29571,7 @@ table.calendartable caption {
#frontpage-category-combo .coursebox > .info > .coursename a {
display: block;
background-image: url([[pix:moodle|i/course]]);
background-size: 16px 16px;
background-size: 20px 16px;
background-repeat: no-repeat;
padding-left: 21px;
}
@@ -29642,7 +29646,7 @@ table.calendartable caption {
.course_category_tree .category.with_children > .info > .categoryname {
background-image: url([[pix:moodle|t/expanded]]);
background-size: 16px 16px;
background-size: 20px 16px;
background-repeat: no-repeat;
background-position: center left;
}
@@ -31466,7 +31470,7 @@ a.ygtvspacer:hover {
}
.message-app .btn.btn-link.btn-icon {
height: 16px;
width: 16px;
width: 20px;
padding: 0;
border-radius: 50%;
flex-shrink: 0;
@@ -31477,31 +31481,31 @@ a.ygtvspacer:hover {
}
.message-app .btn.btn-link.btn-icon.icon-size-1 {
height: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 25px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-2 {
height: 28px !important; /* stylelint-disable-line declaration-no-important */
width: 28px !important; /* stylelint-disable-line declaration-no-important */
width: 30px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-3 {
height: 36px !important; /* stylelint-disable-line declaration-no-important */
width: 36px !important; /* stylelint-disable-line declaration-no-important */
width: 40px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-4 {
height: 44px !important; /* stylelint-disable-line declaration-no-important */
width: 44px !important; /* stylelint-disable-line declaration-no-important */
width: 50px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-5 {
height: 52px !important; /* stylelint-disable-line declaration-no-important */
width: 52px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-6 {
height: 60px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
width: 70px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-7 {
height: 68px !important; /* stylelint-disable-line declaration-no-important */
width: 68px !important; /* stylelint-disable-line declaration-no-important */
width: 80px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .view-overview-body .section {
display: block;
@@ -34712,7 +34716,7 @@ img.userpicture {
.path-mod-feedback #feedback_edit_form [id*=_feedback_item_].feedback_itemlist .itemactions .dropdown-toggle,
.path-mod-feedback #feedback_edit_form .feedback_itemlist.sortable-list-is-dragged .itemactions .dropdown-toggle {
border-radius: 0.5rem;
width: 32px;
width: 40px;
height: 32px;
}
.path-mod-feedback #feedback_edit_form [id*=_feedback_item_].feedback_itemlist.sortable-list-current-position,
@@ -35170,7 +35174,7 @@ p.arrow_button {
.btn.btn-icon {
height: 36px;
width: 36px;
width: 40px;
font-size: 16px;
line-height: 16px;
padding: 0;
@@ -35188,43 +35192,43 @@ p.arrow_button {
}
.btn.btn-icon.icon-size-1 {
height: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 25px !important; /* stylelint-disable-line declaration-no-important */
font-size: 4px !important; /* stylelint-disable-line declaration-no-important */
line-height: 4px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-2 {
height: 28px !important; /* stylelint-disable-line declaration-no-important */
width: 28px !important; /* stylelint-disable-line declaration-no-important */
width: 30px !important; /* stylelint-disable-line declaration-no-important */
font-size: 8px !important; /* stylelint-disable-line declaration-no-important */
line-height: 8px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-3 {
height: 36px !important; /* stylelint-disable-line declaration-no-important */
width: 36px !important; /* stylelint-disable-line declaration-no-important */
width: 40px !important; /* stylelint-disable-line declaration-no-important */
font-size: 16px !important; /* stylelint-disable-line declaration-no-important */
line-height: 16px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-4 {
height: 44px !important; /* stylelint-disable-line declaration-no-important */
width: 44px !important; /* stylelint-disable-line declaration-no-important */
width: 50px !important; /* stylelint-disable-line declaration-no-important */
font-size: 24px !important; /* stylelint-disable-line declaration-no-important */
line-height: 24px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-5 {
height: 52px !important; /* stylelint-disable-line declaration-no-important */
width: 52px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
font-size: 32px !important; /* stylelint-disable-line declaration-no-important */
line-height: 32px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-6 {
height: 60px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
width: 70px !important; /* stylelint-disable-line declaration-no-important */
font-size: 40px !important; /* stylelint-disable-line declaration-no-important */
line-height: 40px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-7 {
height: 68px !important; /* stylelint-disable-line declaration-no-important */
width: 68px !important; /* stylelint-disable-line declaration-no-important */
width: 80px !important; /* stylelint-disable-line declaration-no-important */
font-size: 48px !important; /* stylelint-disable-line declaration-no-important */
line-height: 48px !important; /* stylelint-disable-line declaration-no-important */
}
@@ -37711,7 +37715,7 @@ div.editor_atto_toolbar button .icon {
}
.reportbuilder-table .action-menu .menubar .btn.btn-icon {
height: 32px;
width: 32px;
width: 40px;
border-radius: 0.5rem;
}
+49 -45
View File
@@ -26155,8 +26155,12 @@ body.behat-site .action-menu .dropdown-subpanel-content.show {
outline: 0;
}
a i.icon {
color: #1d2125;
}
.icon {
max-width: 24px;
max-width: 30px;
max-height: 24px;
margin: 0;
padding: 0;
@@ -26168,25 +26172,25 @@ body.behat-site .action-menu .dropdown-subpanel-content.show {
}
.icon.iconsize-medium {
font-size: 32px;
width: 32px;
width: 40px;
height: 32px;
max-width: 32px;
max-width: 40px;
max-height: 32px;
}
.icon.iconsize-big {
width: 64px;
width: 80px;
height: 64px;
max-width: 64px;
max-width: 80px;
max-height: 64px;
font-size: 64px;
}
.icon.emoticon {
max-width: 16px;
max-width: 20px;
max-height: 16px;
}
img.icon {
width: 16px;
width: 20px;
height: 16px;
}
@@ -26223,7 +26227,7 @@ img.icon {
}
.icon-large > .icon {
width: 32px;
width: 40px;
height: 32px;
}
@@ -26235,43 +26239,43 @@ img.icon {
.icon-size-1 .icon {
height: 4px !important; /* stylelint-disable-line declaration-no-important */
width: 4px !important; /* stylelint-disable-line declaration-no-important */
width: 5px !important; /* stylelint-disable-line declaration-no-important */
font-size: 4px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-2 .icon {
height: 8px !important; /* stylelint-disable-line declaration-no-important */
width: 8px !important; /* stylelint-disable-line declaration-no-important */
width: 10px !important; /* stylelint-disable-line declaration-no-important */
font-size: 8px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-3 .icon {
height: 16px !important; /* stylelint-disable-line declaration-no-important */
width: 16px !important; /* stylelint-disable-line declaration-no-important */
width: 20px !important; /* stylelint-disable-line declaration-no-important */
font-size: 16px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-4 .icon {
height: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 30px !important; /* stylelint-disable-line declaration-no-important */
font-size: 24px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-5 .icon {
height: 32px !important; /* stylelint-disable-line declaration-no-important */
width: 32px !important; /* stylelint-disable-line declaration-no-important */
width: 40px !important; /* stylelint-disable-line declaration-no-important */
font-size: 32px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-6 .icon {
height: 40px !important; /* stylelint-disable-line declaration-no-important */
width: 40px !important; /* stylelint-disable-line declaration-no-important */
width: 50px !important; /* stylelint-disable-line declaration-no-important */
font-size: 40px !important; /* stylelint-disable-line declaration-no-important */
}
.icon-size-7 .icon {
height: 48px !important; /* stylelint-disable-line declaration-no-important */
width: 48px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
font-size: 48px !important; /* stylelint-disable-line declaration-no-important */
}
@@ -26312,9 +26316,9 @@ img.icon {
margin: 0;
font-size: 32px;
height: 32px;
width: 32px;
width: 40px;
max-height: 32px;
max-width: 32px;
max-width: 40px;
}
.activityiconcontainer.small {
width: 42px;
@@ -26329,9 +26333,9 @@ img.icon {
max-height: 32px;
}
.activityiconcontainer.smaller .activityicon {
width: 32px;
width: 40px;
height: 32px;
max-width: 32px;
max-width: 40px;
max-height: 32px;
}
@@ -26366,7 +26370,7 @@ img.icon {
}
.icon-box {
width: 48px;
width: 60px;
height: 48px;
display: inline-flex;
justify-content: center;
@@ -26377,7 +26381,7 @@ img.icon {
}
.icon-box .icon {
margin: 0;
height: 32px;
height: 40px;
width: 32px;
}
@@ -27329,7 +27333,7 @@ aside[id^=block-region-side-] .block_recentlyaccesseditems .card:nth-of-type(n+4
.block-add .pluscontainer {
border: 1px solid #3f89cc;
border-radius: 50%;
width: 32px;
width: 40px;
height: 32px;
}
.block-add:hover {
@@ -28164,7 +28168,7 @@ table.calendartable caption {
}
.course-section .action-menu .btn.btn-icon {
height: 32px;
width: 32px;
width: 40px;
border-radius: 0.25rem;
}
.course-section .action-menu.section-actions .btn.btn-icon {
@@ -28762,7 +28766,7 @@ table.calendartable caption {
}
.activity-item .activity-groupmode-info .groupmode-information {
height: 32px;
width: 32px;
width: 40px;
border-radius: 0.25rem;
}
.activity-item .activity-groupmode-info .groupmode-icon-info {
@@ -29053,7 +29057,7 @@ table.calendartable caption {
}
.activity.subsection .section .icons-collapse-expand:has(+ h4) {
height: 24px;
width: 24px;
width: 30px;
font-size: 0.8203125rem;
}
.activity.subsection .section h4 {
@@ -29567,7 +29571,7 @@ table.calendartable caption {
#frontpage-category-combo .coursebox > .info > .coursename a {
display: block;
background-image: url([[pix:moodle|i/course]]);
background-size: 16px 16px;
background-size: 20px 16px;
background-repeat: no-repeat;
padding-left: 21px;
}
@@ -29642,7 +29646,7 @@ table.calendartable caption {
.course_category_tree .category.with_children > .info > .categoryname {
background-image: url([[pix:moodle|t/expanded]]);
background-size: 16px 16px;
background-size: 20px 16px;
background-repeat: no-repeat;
background-position: center left;
}
@@ -31466,7 +31470,7 @@ a.ygtvspacer:hover {
}
.message-app .btn.btn-link.btn-icon {
height: 16px;
width: 16px;
width: 20px;
padding: 0;
border-radius: 50%;
flex-shrink: 0;
@@ -31477,31 +31481,31 @@ a.ygtvspacer:hover {
}
.message-app .btn.btn-link.btn-icon.icon-size-1 {
height: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 25px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-2 {
height: 28px !important; /* stylelint-disable-line declaration-no-important */
width: 28px !important; /* stylelint-disable-line declaration-no-important */
width: 30px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-3 {
height: 36px !important; /* stylelint-disable-line declaration-no-important */
width: 36px !important; /* stylelint-disable-line declaration-no-important */
width: 40px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-4 {
height: 44px !important; /* stylelint-disable-line declaration-no-important */
width: 44px !important; /* stylelint-disable-line declaration-no-important */
width: 50px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-5 {
height: 52px !important; /* stylelint-disable-line declaration-no-important */
width: 52px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-6 {
height: 60px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
width: 70px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .btn.btn-link.btn-icon.icon-size-7 {
height: 68px !important; /* stylelint-disable-line declaration-no-important */
width: 68px !important; /* stylelint-disable-line declaration-no-important */
width: 80px !important; /* stylelint-disable-line declaration-no-important */
}
.message-app .view-overview-body .section {
display: block;
@@ -34712,7 +34716,7 @@ img.userpicture {
.path-mod-feedback #feedback_edit_form [id*=_feedback_item_].feedback_itemlist .itemactions .dropdown-toggle,
.path-mod-feedback #feedback_edit_form .feedback_itemlist.sortable-list-is-dragged .itemactions .dropdown-toggle {
border-radius: 0.5rem;
width: 32px;
width: 40px;
height: 32px;
}
.path-mod-feedback #feedback_edit_form [id*=_feedback_item_].feedback_itemlist.sortable-list-current-position,
@@ -35170,7 +35174,7 @@ p.arrow_button {
.btn.btn-icon {
height: 36px;
width: 36px;
width: 40px;
font-size: 16px;
line-height: 16px;
padding: 0;
@@ -35188,43 +35192,43 @@ p.arrow_button {
}
.btn.btn-icon.icon-size-1 {
height: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 24px !important; /* stylelint-disable-line declaration-no-important */
width: 25px !important; /* stylelint-disable-line declaration-no-important */
font-size: 4px !important; /* stylelint-disable-line declaration-no-important */
line-height: 4px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-2 {
height: 28px !important; /* stylelint-disable-line declaration-no-important */
width: 28px !important; /* stylelint-disable-line declaration-no-important */
width: 30px !important; /* stylelint-disable-line declaration-no-important */
font-size: 8px !important; /* stylelint-disable-line declaration-no-important */
line-height: 8px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-3 {
height: 36px !important; /* stylelint-disable-line declaration-no-important */
width: 36px !important; /* stylelint-disable-line declaration-no-important */
width: 40px !important; /* stylelint-disable-line declaration-no-important */
font-size: 16px !important; /* stylelint-disable-line declaration-no-important */
line-height: 16px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-4 {
height: 44px !important; /* stylelint-disable-line declaration-no-important */
width: 44px !important; /* stylelint-disable-line declaration-no-important */
width: 50px !important; /* stylelint-disable-line declaration-no-important */
font-size: 24px !important; /* stylelint-disable-line declaration-no-important */
line-height: 24px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-5 {
height: 52px !important; /* stylelint-disable-line declaration-no-important */
width: 52px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
font-size: 32px !important; /* stylelint-disable-line declaration-no-important */
line-height: 32px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-6 {
height: 60px !important; /* stylelint-disable-line declaration-no-important */
width: 60px !important; /* stylelint-disable-line declaration-no-important */
width: 70px !important; /* stylelint-disable-line declaration-no-important */
font-size: 40px !important; /* stylelint-disable-line declaration-no-important */
line-height: 40px !important; /* stylelint-disable-line declaration-no-important */
}
.btn.btn-icon.icon-size-7 {
height: 68px !important; /* stylelint-disable-line declaration-no-important */
width: 68px !important; /* stylelint-disable-line declaration-no-important */
width: 80px !important; /* stylelint-disable-line declaration-no-important */
font-size: 48px !important; /* stylelint-disable-line declaration-no-important */
line-height: 48px !important; /* stylelint-disable-line declaration-no-important */
}
@@ -37645,7 +37649,7 @@ div.editor_atto_toolbar button .icon {
}
.reportbuilder-table .action-menu .menubar .btn.btn-icon {
height: 32px;
width: 32px;
width: 40px;
border-radius: 0.25rem;
}