Fix arrow placement on QToolButton.

Fixes issues between the arrow placement in the `menu-arrow` and `menu-indicator` of a QToolButton, which was inconsistent between Qt5 and Qt6. Using `subcontrol-origin: content;` and then adjusting `padding-right: -1.11em;` fixes the issue.

Fixes #36.
main
Alex Huszagh 2022-04-28 15:18:43 -05:00
parent 836febe922
commit 90f679d600
6 changed files with 4010 additions and 3953 deletions

File diff suppressed because it is too large Load Diff

View File

@ -1633,15 +1633,33 @@ QToolButton[autoRaise="false"]:hover
border: 0.04em solid #3daee9; border: 0.04em solid #3daee9;
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: #3daee9;
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-indicator QToolButton[autoRaise="false"]::menu-indicator
{ {
border-image: none; border-image: none;
image: url(dark:down_arrow.svg); image: url(dark:down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
top: -0.7ex;
left: -0.09em; left: -0.09em;
padding-right: 0.09em; /* -1.2em + 0.09em */
padding-right: -1.11em;
/**
* Qt5 and Qt6 differ if the subcontrol-origin is set to
* the default, AKA, padding. Setting it to the content,
* which we adjust the padding to, makes it uniform between
* both.
*/
subcontrol-origin: content;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-arrow QToolButton[autoRaise="false"]::menu-arrow
@ -1650,7 +1668,8 @@ QToolButton[autoRaise="false"]::menu-arrow
image: url(dark:down_arrow.svg); image: url(dark:down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
subcontrol-position: bottom right; padding-right: 0.09em;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button QToolButton[autoRaise="false"]::menu-button
@ -1666,7 +1685,7 @@ QToolButton[autoRaise="false"]::menu-button
QToolButton[autoRaise="false"]::menu-button::menu-arrow QToolButton[autoRaise="false"]::menu-button::menu-arrow
{ {
left: -0.09em; left: -0.09em;
subcontrol-position: bottom right; subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button:hover QToolButton[autoRaise="false"]::menu-button:hover
@ -1674,16 +1693,6 @@ QToolButton[autoRaise="false"]::menu-button:hover
background-color: transparent; background-color: transparent;
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: #3daee9;
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-button:pressed QToolButton[autoRaise="false"]::menu-button:pressed
{ {
background-color: transparent; background-color: transparent;

View File

@ -1633,15 +1633,33 @@ QToolButton[autoRaise="false"]:hover
border: 0.04em solid rgba(51, 164, 223, 0.5); border: 0.04em solid rgba(51, 164, 223, 0.5);
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: rgba(51, 164, 223, 0.5);
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-indicator QToolButton[autoRaise="false"]::menu-indicator
{ {
border-image: none; border-image: none;
image: url(light:down_arrow.svg); image: url(light:down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
top: -0.7ex;
left: -0.09em; left: -0.09em;
padding-right: 0.09em; /* -1.2em + 0.09em */
padding-right: -1.11em;
/**
* Qt5 and Qt6 differ if the subcontrol-origin is set to
* the default, AKA, padding. Setting it to the content,
* which we adjust the padding to, makes it uniform between
* both.
*/
subcontrol-origin: content;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-arrow QToolButton[autoRaise="false"]::menu-arrow
@ -1650,7 +1668,8 @@ QToolButton[autoRaise="false"]::menu-arrow
image: url(light:down_arrow.svg); image: url(light:down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
subcontrol-position: bottom right; padding-right: 0.09em;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button QToolButton[autoRaise="false"]::menu-button
@ -1666,7 +1685,7 @@ QToolButton[autoRaise="false"]::menu-button
QToolButton[autoRaise="false"]::menu-button::menu-arrow QToolButton[autoRaise="false"]::menu-button::menu-arrow
{ {
left: -0.09em; left: -0.09em;
subcontrol-position: bottom right; subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button:hover QToolButton[autoRaise="false"]::menu-button:hover
@ -1674,16 +1693,6 @@ QToolButton[autoRaise="false"]::menu-button:hover
background-color: transparent; background-color: transparent;
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: rgba(51, 164, 223, 0.5);
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-button:pressed QToolButton[autoRaise="false"]::menu-button:pressed
{ {
background-color: transparent; background-color: transparent;

View File

@ -1633,15 +1633,33 @@ QToolButton[autoRaise="false"]:hover
border: 0.04em solid #3daee9; border: 0.04em solid #3daee9;
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: #3daee9;
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-indicator QToolButton[autoRaise="false"]::menu-indicator
{ {
border-image: none; border-image: none;
image: url(:/dark/down_arrow.svg); image: url(:/dark/down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
top: -0.7ex;
left: -0.09em; left: -0.09em;
padding-right: 0.09em; /* -1.2em + 0.09em */
padding-right: -1.11em;
/**
* Qt5 and Qt6 differ if the subcontrol-origin is set to
* the default, AKA, padding. Setting it to the content,
* which we adjust the padding to, makes it uniform between
* both.
*/
subcontrol-origin: content;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-arrow QToolButton[autoRaise="false"]::menu-arrow
@ -1650,7 +1668,8 @@ QToolButton[autoRaise="false"]::menu-arrow
image: url(:/dark/down_arrow.svg); image: url(:/dark/down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
subcontrol-position: bottom right; padding-right: 0.09em;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button QToolButton[autoRaise="false"]::menu-button
@ -1666,7 +1685,7 @@ QToolButton[autoRaise="false"]::menu-button
QToolButton[autoRaise="false"]::menu-button::menu-arrow QToolButton[autoRaise="false"]::menu-button::menu-arrow
{ {
left: -0.09em; left: -0.09em;
subcontrol-position: bottom right; subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button:hover QToolButton[autoRaise="false"]::menu-button:hover
@ -1674,16 +1693,6 @@ QToolButton[autoRaise="false"]::menu-button:hover
background-color: transparent; background-color: transparent;
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: #3daee9;
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-button:pressed QToolButton[autoRaise="false"]::menu-button:pressed
{ {
background-color: transparent; background-color: transparent;

View File

@ -1633,15 +1633,33 @@ QToolButton[autoRaise="false"]:hover
border: 0.04em solid rgba(51, 164, 223, 0.5); border: 0.04em solid rgba(51, 164, 223, 0.5);
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: rgba(51, 164, 223, 0.5);
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-indicator QToolButton[autoRaise="false"]::menu-indicator
{ {
border-image: none; border-image: none;
image: url(:/light/down_arrow.svg); image: url(:/light/down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
top: -0.7ex;
left: -0.09em; left: -0.09em;
padding-right: 0.09em; /* -1.2em + 0.09em */
padding-right: -1.11em;
/**
* Qt5 and Qt6 differ if the subcontrol-origin is set to
* the default, AKA, padding. Setting it to the content,
* which we adjust the padding to, makes it uniform between
* both.
*/
subcontrol-origin: content;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-arrow QToolButton[autoRaise="false"]::menu-arrow
@ -1650,7 +1668,8 @@ QToolButton[autoRaise="false"]::menu-arrow
image: url(:/light/down_arrow.svg); image: url(:/light/down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
subcontrol-position: bottom right; padding-right: 0.09em;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button QToolButton[autoRaise="false"]::menu-button
@ -1666,7 +1685,7 @@ QToolButton[autoRaise="false"]::menu-button
QToolButton[autoRaise="false"]::menu-button::menu-arrow QToolButton[autoRaise="false"]::menu-button::menu-arrow
{ {
left: -0.09em; left: -0.09em;
subcontrol-position: bottom right; subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button:hover QToolButton[autoRaise="false"]::menu-button:hover
@ -1674,16 +1693,6 @@ QToolButton[autoRaise="false"]::menu-button:hover
background-color: transparent; background-color: transparent;
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: rgba(51, 164, 223, 0.5);
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-button:pressed QToolButton[autoRaise="false"]::menu-button:pressed
{ {
background-color: transparent; background-color: transparent;

View File

@ -1633,15 +1633,33 @@ QToolButton[autoRaise="false"]:hover
border: 0.04em solid ^highlight^; border: 0.04em solid ^highlight^;
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: ^highlight^;
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-indicator QToolButton[autoRaise="false"]::menu-indicator
{ {
border-image: none; border-image: none;
image: url(^style^down_arrow.svg); image: url(^style^down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
top: -0.7ex;
left: -0.09em; left: -0.09em;
padding-right: 0.09em; /* -1.2em + 0.09em */
padding-right: -1.11em;
/**
* Qt5 and Qt6 differ if the subcontrol-origin is set to
* the default, AKA, padding. Setting it to the content,
* which we adjust the padding to, makes it uniform between
* both.
*/
subcontrol-origin: content;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-arrow QToolButton[autoRaise="false"]::menu-arrow
@ -1650,7 +1668,8 @@ QToolButton[autoRaise="false"]::menu-arrow
image: url(^style^down_arrow.svg); image: url(^style^down_arrow.svg);
width: 0.8em; width: 0.8em;
height: 0.5em; height: 0.5em;
subcontrol-position: bottom right; padding-right: 0.09em;
subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button QToolButton[autoRaise="false"]::menu-button
@ -1666,7 +1685,7 @@ QToolButton[autoRaise="false"]::menu-button
QToolButton[autoRaise="false"]::menu-button::menu-arrow QToolButton[autoRaise="false"]::menu-button::menu-arrow
{ {
left: -0.09em; left: -0.09em;
subcontrol-position: bottom right; subcontrol-position: right;
} }
QToolButton[autoRaise="false"]::menu-button:hover QToolButton[autoRaise="false"]::menu-button:hover
@ -1674,16 +1693,6 @@ QToolButton[autoRaise="false"]::menu-button:hover
background-color: transparent; background-color: transparent;
} }
QToolButton[autoRaise="false"]:checked,
QToolButton[autoRaise="false"]:pressed
{
background-color: ^highlight^;
padding: 0.23em;
padding-right: 1.2em;
min-height: 1.3em;
outline: none;
}
QToolButton[autoRaise="false"]::menu-button:pressed QToolButton[autoRaise="false"]::menu-button:pressed
{ {
background-color: transparent; background-color: transparent;