feature: Apple touch icons (#24), accessibility

This commit is contained in:
jamesread 2021-11-21 01:15:37 +00:00
parent 7bdb99764c
commit 2b9e763e02
5 changed files with 8 additions and 3 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 KiB

BIN
webui/OliveTinLogo-57px.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@ -8,17 +8,21 @@
<title>OliveTin</title> <title>OliveTin</title>
<link rel = "stylesheet" type = "text/css" href = "style.css" /> <link rel = "stylesheet" type = "text/css" href = "style.css" />
<link rel = "shortcut icon" type = "image/png" href = "OliveTinLogo.png" /> <link rel = "shortcut icon" type = "image/png" href = "OliveTinLogo.png" />
<link rel = "apple-touch-icon" sizes="57x57" href="OliveTinLogo-57px.png" />
<link rel = "apple-touch-icon" sizes="120x120" href="OliveTinLogo-120px.png" />
<link rel = "apple-touch-icon" sizes="180x180" href="OliveTinLogo-180px.png" />
</head> </head>
<body> <body>
<main title = "main content"> <main title = "main content">
<fieldset id = "sectionSwitcher"> <fieldset id = "sectionSwitcher" title = "Sections">
<button id = "showActions">Actions</button> <button id = "showActions">Actions</button>
<button id = "showLogs">Logs</button> <button id = "showLogs">Logs</button>
</fieldset> </fieldset>
<section id = "contentLogs" title = "Logs" hidden> <section id = "contentLogs" title = "Logs" hidden>
<table> <table title = "Logs">
<thead> <thead>
<tr> <tr>
<th>Timestamp</th> <th>Timestamp</th>
@ -31,7 +35,7 @@
</section> </section>
<section id = "contentActions" title = "Actions" hidden > <section id = "contentActions" title = "Actions" hidden >
<fieldset id = "rootGroup"> <fieldset id = "rootGroup" title = "Dashboard of buttons">
</fieldset> </fieldset>
</section> </section>

View File

@ -15,6 +15,7 @@ class ActionButton extends window.HTMLElement {
this.updateFromJson(json) this.updateFromJson(json)
// DOM Attributes // DOM Attributes
this.setAttribute("role", "none")
this.btn.title = json.title this.btn.title = json.title
this.btn.onclick = () => { this.btn.onclick = () => {
console.log(json.arguments) console.log(json.arguments)