alyssa
/
bloat
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add keyboard shortcuts

This commit is contained in:
r 2020-10-19 06:06:41 +00:00
parent a23fd4afaf
commit ef41ff32e2
5 changed files with 125 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
static/style.css
View File

@ -505,6 +505,22 @@ img.emoji {
margin: 8px 0 16px 0;
}
.keyboard-shortcuts {
margin-top: 12px;
}
.keyboard-shortcuts td {
padding: 2px 4px;
}
kbd {
border-radius: 3px;
padding: 1px 4px;
border: 1px solid #444444;
background-color: #eeeeee;
font-size: 10pt;
}
.dark {
background-color: #222222;
background-image: none;
@ -548,3 +564,9 @@ img.emoji {
background-color: #222222;
border-color: #444444;
}
.dark kbd {
background-color: #333333;
border-color: #444444;
color: #eaeaea;
}

84
templates/about.tmpl
View File

@ -1,7 +1,7 @@
{{with .Data}}
{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
<div class="page-title"> About </div>
<div class="page-title"> About </div>
<div>
<p>
A web client for <a href="https://pleroma.social" target="_blank">Mastodon Network</a>.
@ -14,6 +14,88 @@
</P>
</div>
<div class="page-title"> Keyboard shortcuts </div>
<div>
<table class="keyboard-shortcuts">
<tr>
<td> User profile </td>
<td> <kbd>0</kbd> </td>
</tr>
<tr>
<td> Home timeline </td>
<td> <kbd>1</kbd> </td>
</tr>
<tr>
<td> Direct timeline </td>
<td> <kbd>2</kbd> </td>
</tr>
<tr>
<td> Local timeline </td>
<td> <kbd>3</kbd> </td>
</tr>
<tr>
<td> The Whole Known Network </td>
<td> <kbd>4</kbd> </td>
</tr>
<tr>
<td> Search </td>
<td> <kbd>5</kbd> </td>
</tr>
<tr>
<td> About </td>
<td> <kbd>6</kbd> </td>
</tr>
<tr>
<td> Settings </td>
<td> <kbd>7</kbd> </td>
</tr>
<tr>
<td> Signout </td>
<td> <kbd>8</kbd> </td>
</tr>
<tr>
<td> Emoji list </td>
<td> <kbd>L</kbd> </td>
</tr>
<tr>
<td> Edit post </td>
<td> <kbd>E</kbd> </td>
</tr>
<tr>
<td> Post format </td>
<td> <kbd>F</kbd> </td>
</tr>
<tr>
<td> Post scope </td>
<td> <kbd>S</kbd> </td>
</tr>
<tr>
<td> Post NSFW </td>
<td> <kbd>N</kbd> </td>
</tr>
<tr>
<td> Post attachments </td>
<td> <kbd>A</kbd> </td>
</tr>
<tr>
<td> Submit post </td>
<td> <kbd>P</kbd> </td>
</tr>
<tr>
<td> Refresh notifications </td>
<td> <kbd>R</kbd> </td>
</tr>
<tr>
<td> Read notifications </td>
<td> <kbd>C</kbd> </td>
</tr>
</table>
<p>
You can activate the shortcuts by pressing the associated key with your browser's <a href="https://en.wikipedia.org/wiki/Access_key#Access_in_different_browsers" target="_blank">accesskey modifier</a>,
which is generally <kbd>Alt</kbd> + <kbd>Shift</kbd>.
</p>
</div>
{{template "footer.tmpl"}}
{{end}}

20
templates/nav.tmpl
View File

@ -2,30 +2,30 @@
{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
<div class="user-info">
<div class="user-info-img-container">
<a class="img-link" href="/timeline/home" title="home">
<a class="img-link" href="/timeline/home" title="Home (1)">
<img class="user-info-img" src="{{.User.AvatarStatic}}" alt="profile-avatar" height="64" />
</a>
</div>
<div class="user-info-details-container">
<div class="user-info-details-name">
<span class="status-dname"> {{EmojiFilter .User.DisplayName .User.Emojis}} </span>
<a class="nav-link" href="/user/{{.User.ID}}">
<a class="nav-link" href="/user/{{.User.ID}}" accesskey="0" title="User profile (0)">
<span class="status-uname"> @{{.User.Acct}} </span>
</a>
</div>
<div class="user-info-details-nav">
<a class="nav-link" href="/timeline/home">home</a>
<a class="nav-link" href="/timeline/direct">direct</a>
<a class="nav-link" href="/timeline/local">local</a>
<a class="nav-link" href="/timeline/twkn">twkn</a>
<a class="nav-link" href="/search">search</a>
<a class="nav-link" href="/about">about</a>
<a class="nav-link" href="/timeline/home" accesskey="1" title="Home timeline (1)">home</a>
<a class="nav-link" href="/timeline/direct" accesskey="2" title="Direct timeline (2)">direct</a>
<a class="nav-link" href="/timeline/local" accesskey="3" title="Local timeline (3)">local</a>
<a class="nav-link" href="/timeline/twkn" accesskey="4" title="The Whole Known Netwwork (4)">twkn</a>
<a class="nav-link" href="/search" accesskey="5" title="Search (5)">search</a>
<a class="nav-link" href="/about" accesskey="6" title="About (6)">about</a>
</div>
<div>
<a class="nav-link" href="/settings" target="_top">settings</a>
<a class="nav-link" href="/settings" target="_top" accesskey="7" title="Settings (7)">settings</a>
<form class="signout" action="/signout" method="post" target="_top">
<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
<input type="submit" value="signout" class="btn-link nav-link">
<input type="submit" value="signout" class="btn-link nav-link" accesskey="8" title="Signout (8)">
</form>
</div>
</div>

4
templates/notification.tmpl
View File

@ -7,11 +7,11 @@
({{.UnreadCount }})
{{end}}
</div>
<a class="notification-refresh" href="/notifications" target="_self">refresh</a>
<a class="notification-refresh" href="/notifications" target="_self" accesskey="R" title="Refresh (R)">refresh</a>
{{if .ReadID}}
<form action="/notifications/read?max_id={{.ReadID}}" method="post" target="_self">
<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
<input type="submit" value="read" class="btn-link">
<input type="submit" value="read" class="btn-link" accesskey="C" title="Clear unread notifications (C)">
</form>
{{end}}
</div>

19
templates/postform.tmpl
View File

@ -7,24 +7,22 @@
{{else}}
<label for="post-content" class="post-form-title"> New post </label>
{{end}}
<a class="post-form-emoji-link" href="/emojis" target="_blank" title="emoji list">
<a class="post-form-emoji-link" href="/emojis" target="_blank" title="Emoji list (L)" accesskey="L">
emoji list
</a>
<div class="post-form-content-container">
<textarea id="post-content" name="content" class="post-content" cols="34" rows="5">{{if .ReplyContext}}{{.ReplyContext.ReplyContent}}{{end}}</textarea>
<textarea id="post-content" name="content" class="post-content" cols="34" rows="5" accesskey="E" title="Edit post (E)">{{if .ReplyContext}}{{.ReplyContext.ReplyContent}}{{end}}</textarea>
</div>
<div>
{{if gt (len .Formats) 0}}
<span class="post-form-field">
<label for="post-format"> Format </label>
<select id="post-format" name="format">
<select id="post-format" name="format" accesskey="F" title="Format (F)">
{{range .Formats}} <option value="{{.Type}}">{{.Name}}</option> {{end}}
</select>
</span>
{{end}}
<span class="post-form-field">
<label for="post-visilibity"> Scope </label>
<select id="post-visilibity" name="visibility" {{if .ReplyContext}}{{if .ReplyContext.ForceVisibility}}disabled{{end}}{{end}}>
<select id="post-visilibity" name="visibility" {{if .ReplyContext}}{{if .ReplyContext.ForceVisibility}}disabled{{end}}{{end}} accesskey="S" title="Scope (S)">
<option value="public" {{if eq .DefaultVisibility "public"}}selected{{end}}>Public</option>
<option value="unlisted" {{if eq .DefaultVisibility "unlisted"}}selected{{end}}>Unlisted</option>
<option value="private" {{if eq .DefaultVisibility "private"}}selected{{end}}>Private</option>
@ -32,17 +30,16 @@
</select>
</span>
<span class="post-form-field">
<input type="checkbox" id="nsfw-checkbox" name="is_nsfw" value="on">
<label for="nsfw-checkbox"> Is NSFW </label>
<input type="checkbox" id="nsfw-checkbox" name="is_nsfw" value="on" accesskey="N" title="NSFW (N)">
<label for="nsfw-checkbox"> NSFW </label>
</span>
</div>
<div>
<span class="post-form-field">
<label for ="post-file-picker"> Attachments </label>
<input id="post-file-picker" type="file" name="attachments" multiple>
<input id="post-file-picker" type="file" name="attachments" multiple accesskey="A" title="Attachments (A)">
</span>
</div>
<button type="submit"> Post </button>
<button type="submit" accesskey="P" title="Post (P)"> Post </button>
</form>
{{end}}