PLT-4602 Fix misaligned close button and fix Android icon rendering bug (#4492)

* PLT-4602 Fix horizontal alignment for .close__button

Reduce negative left margin to fix miscalculated center-positioning.

* PLT-4602 Fix dropdown close icon rendering bug on Android

The combination of using a unicode character and a pseudo element was
too problematic, so I added a new custom icon svg CLOSE_ICON that
renders consistently on all browsers.

* PLT-4602 Use font-family fix, remove <svg>

You were correct @hmhealey, the problem was that the unicode characters
were rendering as different fonts: Open Sans and Helvetica Neue!
Этот коммит содержится в:
Kai Faust
2016-11-09 06:40:24 -08:00
коммит произвёл Harrison Healey
родитель 13dcccc60b
Коммит 4b3eceee70
2 изменённых файлов: 38 добавлений и 27 удалений

Просмотреть файл

@@ -546,6 +546,12 @@ export default class Navbar extends React.Component {
{deleteChannelOption}
{leaveChannelOption}
{toggleFavoriteOption}
<div
className='close visible-xs-block'
onClick={() => this.refs.headerOverlay.hide()}
>
{'×'}
</div>
</ul>
</div>
</div>
@@ -671,7 +677,7 @@ export default class Navbar extends React.Component {
options={{singleline: true, mentionHighlight: false}}
/>
<div
className='close__icon visible-xs-block'
className='close visible-xs-block'
onClick={() => this.refs.headerOverlay.hide()}
>
{'×'}
@@ -721,7 +727,7 @@ export default class Navbar extends React.Component {
/>
</div>
<div
className='close__icon visible-xs-block'
className='close visible-xs-block'
onClick={() => this.refs.headerOverlay.hide()}
>
{'×'}