fix(client): make language dropdown as wide as the nav (#43991)
Co-authored-by: arun elanthamil <arun.elanthamil@superops.ai>pull/44031/head
parent
21b7a9ee4f
commit
1ca335794c
|
@ -189,7 +189,7 @@ export class NavLinks extends Component<NavLinksProps, {}> {
|
|||
{t('footer.language')}
|
||||
</div>
|
||||
|
||||
<div className='nav-link' key='language-dropdown'>
|
||||
<div className='nav-link dropdown-nav-link' key='language-dropdown'>
|
||||
<select
|
||||
className='nav-link-lang-dropdown'
|
||||
onChange={this.handleLanguageChange}
|
||||
|
|
|
@ -109,6 +109,16 @@
|
|||
border: none;
|
||||
}
|
||||
|
||||
.dropdown-nav-link {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.dropdown-nav-link:hover .nav-link-lang-dropdown,
|
||||
.dropdown-nav-link:active .nav-link-lang-dropdown {
|
||||
background-image: url('data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2212%22%20viewBox%3D%220%200%2012%2012%22%3E%3Ctitle%3Edown-arrow%3C%2Ftitle%3E%3Cg%20fill%3D%22%23000000%22%3E%3Cpath%20d%3D%22M10.293%2C3.293%2C6%2C7.586%2C1.707%2C3.293A1%2C1%2C0%2C0%2C0%2C.293%2C4.707l5%2C5a1%2C1%2C0%2C0%2C0%2C1.414%2C0l5-5a1%2C1%2C0%2C1%2C0-1.414-1.414Z%22%20fill%3D%22%23000000%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E');
|
||||
}
|
||||
|
||||
.nav-link:hover,
|
||||
.nav-link:active {
|
||||
color: var(--theme-color);
|
||||
|
@ -143,11 +153,21 @@
|
|||
}
|
||||
|
||||
.nav-link-lang-dropdown {
|
||||
padding: 0 15px;
|
||||
color: var(--gray-00);
|
||||
background-color: var(--gray-90);
|
||||
width: 100%;
|
||||
border: none;
|
||||
position: relative;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
background-image: url('data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2212%22%20viewBox%3D%220%200%2012%2012%22%3E%3Ctitle%3Edown-arrow%3C%2Ftitle%3E%3Cg%20fill%3D%22%23ffffff%22%3E%3Cpath%20d%3D%22M10.293%2C3.293%2C6%2C7.586%2C1.707%2C3.293A1%2C1%2C0%2C0%2C0%2C.293%2C4.707l5%2C5a1%2C1%2C0%2C0%2C0%2C1.414%2C0l5-5a1%2C1%2C0%2C1%2C0-1.414-1.414Z%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E');
|
||||
background-size: 10px;
|
||||
background-position: calc(100% - 15px) center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.nav-link-lang-dropdown:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue