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 ( return (
<div id="info-bar"> <div id="info-bar" className="d-flex justify-content-between">
<p id="info-bar-info"><span dangerouslySetInnerHTML={{__html: curNoteMsg}}></span></p> <p id="info-bar-info" className="m-0" dangerouslySetInnerHTML={{__html: curNoteMsg}}></p>
<span className="close sf2-icon-x1" title={gettext('Close')} onClick={this.close}></span> <button className="close sf2-icon-x1" title={gettext('Close')} aria-label={gettext('Close')} onClick={this.close}></button>
</div> </div>
); );
} }

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

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