forked from cybrespace/mastodon
7db0f8dcb2
* Fix #2102 - Implement hotkeys Hotkeys on status list: - r to reply - m to mention author - f to favourite - b to boost - enter to open status - p to open author's profile - up or k to move up in the list - down or j to move down in the list - 1-9 to focus a status in one of the columns - n to focus the compose textarea - alt+n to start a brand new toot - backspace to navigate back * Add navigational hotkeys The key g followed by: - s: start - h: home - n: notifications - l: local timeline - t: federated timeline - f: favourites - u: own profile - p: pinned toots - b: blocked users - m: muted users * Add hotkey for focusing search, make escape un-focus compose/search * Fix focusing notifications column, fix hotkeys in compose textarea
105 lines
2.2 KiB
SCSS
105 lines
2.2 KiB
SCSS
body {
|
|
font-family: 'mastodon-font-sans-serif', sans-serif;
|
|
background: $ui-base-color;
|
|
background-size: cover;
|
|
background-attachment: fixed;
|
|
font-size: 13px;
|
|
line-height: 18px;
|
|
font-weight: 400;
|
|
color: $primary-text-color;
|
|
padding-bottom: 20px;
|
|
text-rendering: optimizelegibility;
|
|
font-feature-settings: "kern";
|
|
text-size-adjust: none;
|
|
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
|
-webkit-tap-highlight-color: transparent;
|
|
|
|
&.system-font {
|
|
// system-ui => standard property (Chrome/Android WebView 56+, Opera 43+, Safari 11+)
|
|
// -apple-system => Safari <11 specific
|
|
// BlinkMacSystemFont => Chrome <56 on macOS specific
|
|
// Segoe UI => Windows 7/8/10
|
|
// Oxygen => KDE
|
|
// Ubuntu => Unity/Ubuntu
|
|
// Cantarell => GNOME
|
|
// Fira Sans => Firefox OS
|
|
// Droid Sans => Older Androids (<4.0)
|
|
// Helvetica Neue => Older macOS <10.11
|
|
// mastodon-font-sans-serif => web-font (Roboto) fallback and newer Androids (>=4.0)
|
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", mastodon-font-sans-serif, sans-serif;
|
|
}
|
|
|
|
&.app-body {
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
padding: 0;
|
|
background: $ui-base-color;
|
|
}
|
|
|
|
&.about-body {
|
|
background: darken($ui-base-color, 8%);
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
&.embed {
|
|
background: transparent;
|
|
margin: 0;
|
|
padding-bottom: 0;
|
|
|
|
.container {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
&.admin {
|
|
background: darken($ui-base-color, 4%);
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
padding: 0;
|
|
}
|
|
|
|
&.error {
|
|
text-align: center;
|
|
color: $ui-primary-color;
|
|
padding: 20px;
|
|
|
|
.dialog img {
|
|
display: block;
|
|
margin: 0 auto;
|
|
max-width: 470px;
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
|
|
.dialog h1 {
|
|
font-size: 20px;
|
|
line-height: 28px;
|
|
font-weight: 400;
|
|
}
|
|
}
|
|
}
|
|
|
|
button {
|
|
font-family: inherit;
|
|
cursor: pointer;
|
|
|
|
&:focus {
|
|
outline: none;
|
|
}
|
|
}
|
|
|
|
.app-holder {
|
|
&,
|
|
& > div {
|
|
display: flex;
|
|
width: 100%;
|
|
height: 100%;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
}
|