diff --git a/CHANGELOG.md b/CHANGELOG.md index 997889fe..22880e1d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -27,6 +27,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/). - Icons changed from fontello (FontAwesome 4 + others) to FontAwesome 5 due to problems with fontello. - Some icons changed for better accessibility (lock, globe) - Logo is now clickable +- Changed default logo to SVG version ## [2.1.1] - 2020-09-08 ### Changed diff --git a/src/App.scss b/src/App.scss index 1800d816..ca7d33cd 100644 --- a/src/App.scss +++ b/src/App.scss @@ -603,19 +603,24 @@ nav { flex-grow: 0; } } + .badge { + box-sizing: border-box; display: inline-block; border-radius: 99px; - min-width: 22px; - max-width: 22px; - min-height: 22px; - max-height: 22px; - font-size: 15px; - line-height: 22px; - text-align: center; + max-width: 10em; + min-width: 1.7em; + height: 1.3em; + padding: 0.15em 0.15em; vertical-align: middle; + font-weight: normal; + font-style: normal; + font-size: 0.9em; + line-height: 1; + text-align: center; white-space: nowrap; - padding: 0; + overflow: hidden; + text-overflow: ellipsis; &.badge-notification { background-color: $fallback--cRed; diff --git a/src/components/chat/chat.scss b/src/components/chat/chat.scss index 787514c8..aef58495 100644 --- a/src/components/chat/chat.scss +++ b/src/components/chat/chat.scss @@ -138,11 +138,21 @@ } .chat-view-heading { + box-sizing: border-box; position: static; z-index: 9999; top: 0; margin-top: 0; border-radius: 0; + + /* This practically overlays the panel heading color over panel background + * color. This is needed because we allow transparent panel background and + * it doesn't work well in this "disjointed panel header" case + */ + background: + linear-gradient(to top, var(--panel), var(--panel)), + linear-gradient(to top, var(--bg), var(--bg)); + height: 50px; } .scrollable-message-list { diff --git a/src/components/chat_list_item/chat_list_item.vue b/src/components/chat_list_item/chat_list_item.vue index 1f8ecdf6..cd3f436e 100644 --- a/src/components/chat_list_item/chat_list_item.vue +++ b/src/components/chat_list_item/chat_list_item.vue @@ -21,6 +21,12 @@ /> +
+ +
-
- -
diff --git a/src/components/mobile_nav/mobile_nav.vue b/src/components/mobile_nav/mobile_nav.vue index 6651fc8e..5304a500 100644 --- a/src/components/mobile_nav/mobile_nav.vue +++ b/src/components/mobile_nav/mobile_nav.vue @@ -110,12 +110,23 @@ } .mobile-nav-button { + display: inline-block; text-align: center; - margin: 0 1em; + padding: 0 1em; position: relative; cursor: pointer; } + .site-name { + padding: 0 .3em; + display: inline-block; + } + + .item { + /* moslty just to get rid of extra whitespaces */ + display: flex; + } + .alert-dot { border-radius: 100%; height: 8px; diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue index 0f02a681..0c83d0fe 100644 --- a/src/components/nav_panel/nav_panel.vue +++ b/src/components/nav_panel/nav_panel.vue @@ -27,7 +27,7 @@
{{ unreadChatCount }}
@@ -47,7 +47,7 @@ />{{ $t("nav.friend_requests") }} @@ -84,12 +84,6 @@ padding: 0; } - .follow-request-count { - vertical-align: baseline; - background-color: $fallback--bg; - background-color: var(--input, $fallback--faint); - } - li { position: relative; border-bottom: 1px solid; @@ -156,21 +150,10 @@ margin-right: 0.8em; } - .unread-chat-count { - font-size: 0.9em; - font-weight: bolder; - font-style: normal; + .badge { position: absolute; right: 0.6rem; top: 1.25em; - padding: 0 0.3em; - min-width: 1.3rem; - min-height: 1.3rem; - max-height: 1.3rem; - line-height: 1.3rem; - max-width: 10em; - overflow: hidden; - text-overflow: ellipsis; } } diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue index ed1ccb7d..28c888fe 100644 --- a/src/components/side_drawer/side_drawer.vue +++ b/src/components/side_drawer/side_drawer.vue @@ -70,7 +70,7 @@ /> {{ $t("nav.chats") }} {{ unreadChatCount }} @@ -99,7 +99,7 @@ /> {{ $t("nav.friend_requests") }} @@ -272,12 +272,11 @@ --lightText: var(--popoverLightText, $fallback--lightText); --icon: var(--popoverIcon, $fallback--icon); - .follow-request-count { - vertical-align: baseline; - background-color: $fallback--bg; - background-color: var(--input, $fallback--faint); + .badge { + position: absolute; + right: 0.7rem; + top: 1em; } - } .side-drawer-logo-wrapper { diff --git a/src/components/status/status.scss b/src/components/status/status.scss index 0a395086..0a94de32 100644 --- a/src/components/status/status.scss +++ b/src/components/status/status.scss @@ -59,6 +59,15 @@ $status-margin: 0.75em; justify-content: flex-end; } + ._misclick-prevention & { + pointer-events: none; + + .attachments { + pointer-events: initial; + cursor: initial; + } + } + .left-side { margin-right: $status-margin; } diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js index 368ee81b..cba46daf 100644 --- a/src/components/timeline/timeline.js +++ b/src/components/timeline/timeline.js @@ -72,7 +72,7 @@ const Timeline = { }, classes () { let rootClasses = !this.embedded ? ['panel', 'panel-default'] : [] - if (this.blockingClicks) rootClasses = rootClasses.concat(['-blocked']) + if (this.blockingClicks) rootClasses = rootClasses.concat(['-blocked', '_misclick-prevention']) return { root: rootClasses, header: ['timeline-heading'].concat(!this.embedded ? ['panel-heading'] : []), diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue index 373b946f..04859852 100644 --- a/src/components/timeline/timeline.vue +++ b/src/components/timeline/timeline.vue @@ -113,7 +113,7 @@ } &.-blocked { - pointer-events: none; + cursor: progress; } } diff --git a/src/modules/instance.js b/src/modules/instance.js index 0c35f5d6..5f7bf0ec 100644 --- a/src/modules/instance.js +++ b/src/modules/instance.js @@ -27,7 +27,7 @@ const defaultState = { hideSitename: false, hideUserStats: false, loginMethod: 'password', - logo: '/static/logo.png', + logo: '/static/logo.svg', logoMargin: '.2em', logoMask: true, logoLeft: false, diff --git a/static/config.json b/static/config.json index 4b70aea5..f59e645a 100644 --- a/static/config.json +++ b/static/config.json @@ -10,7 +10,7 @@ "hideSitename": false, "hideUserStats": false, "loginMethod": "password", - "logo": "/static/logo.png", + "logo": "/static/logo.svg", "logoMargin": ".1em", "logoMask": true, "logoLeft": false, diff --git a/static/logo.png b/static/logo.png deleted file mode 100644 index 7744b1ac..00000000 Binary files a/static/logo.png and /dev/null differ diff --git a/static/logo.svg b/static/logo.svg new file mode 100644 index 00000000..68e647e6 --- /dev/null +++ b/static/logo.svg @@ -0,0 +1,71 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + + diff --git a/static/terms-of-service.html b/static/terms-of-service.html index 3b6bbb36..2b7bf769 100644 --- a/static/terms-of-service.html +++ b/static/terms-of-service.html @@ -6,4 +6,4 @@ Pleroma install containing the real ToS for your instance.

See the Pleroma documentation for more information.


- +