Infrastructure/verdaccio
0
Fork 0
mirror of https://github.com/verdaccio/verdaccio.git synced 2025-02-03 23:09:17 -05:00
Code Issues Activity

refactor: remove span tag, fill country name into alt property

Browse source
This commit is contained in:
Meeeeow 2018-02-03 20:03:40 +08:00
parent da610e562f
commit b35ccc2f28
2 changed files with 10 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/webui/src/components/Footer/footer.scss
View file

@ -20,6 +20,7 @@ footer.footer {
} }
.tooltip { .tooltip {
align-items: center;
margin-left: 5px; margin-left: 5px;
position: relative; position: relative;
margin-top: -2px; margin-top: -2px;
@ -30,6 +31,7 @@ footer.footer {
transform: scaleX(0); transform: scaleX(0);
transition: transform 0.3s cubic-bezier(.12,.76,.14,.99); transition: transform 0.3s cubic-bezier(.12,.76,.14,.99);
transform-origin: left; transform-origin: left;
&:before { &:before {
position: absolute; position: absolute;
top: 3px; top: 3px;
@ -43,7 +45,7 @@ footer.footer {
} }
span:not(:first-child) { img:not(:first-child) {
margin-left: 8px; margin-left: 8px;
} }
} }
@ -51,7 +53,7 @@ footer.footer {
// Footer Hover // Footer Hover
&.showAuthorsGeographic .tooltip, &.showAuthorsGeographic .tooltip,
&:hover .tooltip { &:hover .tooltip {
display: block; display: flex;
transform: scaleX(1); transform: scaleX(1);
} }

24
src/webui/src/components/Footer/index.js
View file

@ -38,24 +38,12 @@ export default class Footer extends React.Component {
<span>&nbsp;on</span> <span>&nbsp;on</span>
<img className={`${classes.earth} emoji`} src={earth} alt="Earth" onClick={this.handleEarthIconClick}/> <img className={`${classes.earth} emoji`} src={earth} alt="Earth" onClick={this.handleEarthIconClick}/>
<div className={classes.tooltip}> <div className={classes.tooltip}>
<span title="Brazil"> <img src={brazilFlag} alt="Brazil" title="Brazil" className="emoji"/>
<img src={brazilFlag} alt="" className="emoji"/> <img src={chinaFlag} alt="China" title="China" className="emoji"/>
</span> <img src={indiaFlag} alt="India" title="India" className="emoji"/>
<span title="China"> <img src={nicaraguaFlag} alt="Nicaragua" title="Nicaragua" className="emoji"/>
<img src={chinaFlag} alt="" className="emoji"/> <img src={pakistanFlag} alt="Pakistan" title="Pakistan" className="emoji"/>
</span> <img src={spainFlag} alt="Spain" title="Spain" className="emoji"/>
<span title="India">
<img src={indiaFlag} alt="" className="emoji"/>
</span>
<span title="Nicaragua">
<img src={nicaraguaFlag} alt="" className="emoji"/>
</span>
<span title="Pakistan">
<img src={pakistanFlag} alt="" className="emoji"/>
</span>
<span title="Spain">
<img src={spainFlag} alt="" className="emoji"/>
</span>
</div> </div>
{/* Countries are order by alphabets */} {/* Countries are order by alphabets */}