Skip to content

[JENKINS-75444] Filter drop select input is out of style with other components #10418

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
ridemountainpig wants to merge 1 commit into from
+46 −6
Closed

[JENKINS-75444] Filter drop select input is out of style with other components #10418

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
52 changes: 46 additions & 6 deletions src/main/scss/base/_style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -208,13 +208,32 @@ pre.console {

.setting-input {
width: 100%;
border-radius: 3px;
border: 1px solid var(--input-border);
box-shadow: inset 0 1px 1px rgb(0 0 0 / 0.075);
padding: 6px;
max-width: 100%;
min-height: 38px;
padding: var(--form-input-padding);
border: var(--jenkins-border-width) solid var(--input-border);
border-radius: var(--form-input-border-radius);
box-shadow: var(--form-input-glow);
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
cursor: pointer;
display: block;
appearance: none;
transition: var(--standard-transition);

&:hover {
border-color: var(--input-border-hover);
}

&:active,
&:focus {
outline: none;
border-color: var(--focus-input-border);
box-shadow: var(--form-input-glow--focus);
}

&:disabled {
pointer-events: none;
}
}

.setting-description {
Expand All @@ -230,6 +249,27 @@ pre.console {
margin-top: 0;
}

.setting-main:has(select.setting-input) {
position: relative;
width: 100%;

&::after {
content: "";
position: absolute;
top: 0;
right: 13px;
bottom: 0;
width: 0.625rem;
background-color: currentColor;
mask-image: url("data:image/svg+xml;charset=UTF-8,%3c?xml version='1.0' encoding='UTF-8'?%3e%3csvg width='336px' height='192px' viewBox='0 0 336 192' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3ePath%3c/title%3e%3cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3e%3cg id='arrow' transform='translate(0.000000, 0.000000)' fill='%23FF0000' fill-rule='nonzero'%3e%3cpath d='M7.02943725,7.02943725 C16.3053957,-2.24652118 31.2852799,-2.34214962 40.6788451,6.74255194 L40.9705627,7.02943725 L168,134.059 L295.029437,7.02943725 C304.305396,-2.24652118 319.28528,-2.34214962 328.678845,6.74255194 L328.970563,7.02943725 C338.246521,16.3053957 338.34215,31.2852799 329.257448,40.6788451 L328.970563,40.9705627 L184.970563,184.970563 C175.694604,194.246521 160.71472,194.34215 151.321155,185.257448 L151.029437,184.970563 L7.02943725,40.9705627 C-2.34314575,31.5979797 -2.34314575,16.4020203 7.02943725,7.02943725 Z' id='Path'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e");
mask-size: contain;
mask-repeat: no-repeat;
mask-position: center;
pointer-events: none;
transition: translate var(--elastic-transition);
}
}

.expanding-input {
display: flex;
align-items: center;
Expand Down
Loading