haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-18 00:00:00 +00:00
Code Issues Releases Wiki Activity

[a11y] system notification: refactored it & added support for keyboard access

Browse Source
This commit is contained in:
llj
2021-09-23 11:43:45 +08:00
parent dd1fd746e8
commit 6c5d5b8b1c
2 changed files with 12 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/components/system-notification.js
View File

@@ -41,9 +41,9 @@ class SystemNotification extends React.Component {
}
return (
<div id="info-bar">
<p id="info-bar-info"><span dangerouslySetInnerHTML={{__html: curNoteMsg}}></span></p>
<span className="close sf2-icon-x1" title={gettext('Close')} onClick={this.close}></span>
<div id="info-bar" className="d-flex justify-content-between">
<p id="info-bar-info" className="m-0" dangerouslySetInnerHTML={{__html: curNoteMsg}}></p>
<button className="close sf2-icon-x1" title={gettext('Close')} aria-label={gettext('Close')} onClick={this.close}></button>
</div>
);
}

25
frontend/src/css/system-notification.css
View File

@@ -1,22 +1,15 @@
#info-bar {
color: #1f0600;
padding: 4px 25px 4px 10px;
background: #fddaa4;
position: relative;
color: #1f0600;
padding: 4px 10px;
background: #fddaa4;
}
#info-bar .close {
position: absolute;
right: 5px;
top: 5px;
font-size: 16px;
line-height: 1;
color: #888;
cursor: pointer;
}
#info-bar-info {
margin: 0;
font-size: 16px;
line-height: 1;
color: #888;
cursor: pointer;
}
#info-bar-info a {
color: #a68558;
text-decoration: underline;
color: #a68558;
text-decoration: underline;
}