Additional frame in search field
I started to learn DevTools for Thunderbird, because I want to fully customize my TB. And I'm stuck with such thing. I want this: <Picture 1> Both search boxes are blue.
For the upper search box is this code snippet responsible:
input {
position: absolute; inset: 0; width: 100%; height: 100%; font-size: 1rem; border: 1px solid var(--color-gray-40); border-radius: var(--button-border-radius); padding-inline: var(--padding-block) var(--search-icon-clearance); background-color: var(--layout-background-0);
}
So I change it to:
input {
position: relative; inset: 0; width: 100%; height: 100%; font-size: 1rem; border: 1px solid #82D6FF !important; border-radius: var(--button-border-radius); padding-inline: var(--padding-block) var(--search-icon-clearance); background-color: var(--layout-background-0);
}
And then I have this <Picture 2>
So I get additional frame. But I don't want it. And I can't understand, why I see this additional frame in this place?
Can someone explain me this please?
I started to learn DevTools for Thunderbird, because I want to fully customize my TB. And I'm stuck with such thing.
I want this: <Picture 1>
Both search boxes are blue.
For the upper search box is this code snippet responsible:
input {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
font-size: 1rem;
border: 1px solid var(--color-gray-40);
border-radius: var(--button-border-radius);
padding-inline: var(--padding-block) var(--search-icon-clearance);
background-color: var(--layout-background-0);
}
So I change it to:
input {
position: relative;
inset: 0;
width: 100%;
height: 100%;
font-size: 1rem;
border: 1px solid #82D6FF !important;
border-radius: var(--button-border-radius);
padding-inline: var(--padding-block) var(--search-icon-clearance);
background-color: var(--layout-background-0);
}
And then I have this <Picture 2>
So I get additional frame. But I don't want it. And I can't understand, why I see this additional frame in this place?
Can someone explain me this please?
