I've tried to make QMenu and QComboBox item's corners rounded. And i have a result. But i can't force only first and last items become rounded. So, it should look like this:
But with this code below i can only round all items.
I've tried to call QListView::item:first
and QListView::item:last
, but it didn't help.
css
/* ======= QMenu ======= */
QMenu {
background-color: #FFFFFF;
border: 2px solid #CCCCCC;
border-radius: 7px;
padding: 0px;
}
QMenu::item {
padding: 5px;
border-radius: 4px;
}
QMenu::item:selected {
background-color: #D3E3ED;
color: #3B3B3B;
}
/* ======= QComboBox ======= */
QComboBox {
combobox-popup: 0;
border: 2px solid #CCCCCC;
border-radius: 7px;
min-width: 6em;
padding: 7px;
}
QComboBox:on{
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
background-color: #D3E3ED;
}
QComboBox::drop-down{
border: 0px;
}
QComboBox::down-arrow {
image: url(:/icons/arrow_down.svg);
width: 10px;
height: 10px;
margin-right: 10px;
}
QComboBox::down-arrow:on {
image: url(:/icons/arrow_up.svg);
}
QComboBox QListView{
top: 2px;
border: 2px solid #CCCCCC;
border-bottom-left-radius: 7px;
border-bottom-right-radius: 7px;
background: #FFFFFF;
padding:0px;
}
QListView::item:hover{
background: #D3E3ED;
color: #3B3B3B
}
QListView::item{
background: transparent;
color: #3B3B3B;
padding: 5px;
outline: 0;
border-radius: 4px;
}
QListView{
outline: 0;
}
Is it possible to make it with clear css?