aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--CHANGELOG.md1
-rw-r--r--src/App.scss21
-rw-r--r--src/components/chat/chat.scss10
-rw-r--r--src/components/chat_list_item/chat_list_item.vue12
-rw-r--r--src/components/mobile_nav/mobile_nav.vue13
-rw-r--r--src/components/nav_panel/nav_panel.vue23
-rw-r--r--src/components/side_drawer/side_drawer.vue13
-rw-r--r--src/components/status/status.scss9
-rw-r--r--src/components/timeline/timeline.js2
-rw-r--r--src/components/timeline/timeline.vue2
-rw-r--r--src/modules/instance.js2
-rw-r--r--static/config.json2
-rw-r--r--static/logo.pngbin1304 -> 0 bytes
-rw-r--r--static/logo.svg71
-rw-r--r--static/terms-of-service.html2
15 files changed, 136 insertions, 47 deletions
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 @@
/>
</span>
<span class="heading-right" />
+ <div class="time-wrapper">
+ <Timeago
+ :time="chat.updated_at"
+ :auto-update="60"
+ />
+ </div>
</div>
<div class="chat-preview">
<StatusContent
@@ -35,12 +41,6 @@
</div>
</div>
</div>
- <div class="time-wrapper">
- <Timeago
- :time="chat.updated_at"
- :auto-update="60"
- />
- </div>
</div>
</template>
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 @@
<router-link :to="{ name: 'chats', params: { username: currentUser.screen_name } }">
<div
v-if="unreadChatCount"
- class="badge badge-notification unread-chat-count"
+ class="badge badge-notification"
>
{{ unreadChatCount }}
</div>
@@ -47,7 +47,7 @@
/>{{ $t("nav.friend_requests") }}
<span
v-if="followRequestCount > 0"
- class="badge follow-request-count"
+ class="badge badge-notification"
>
{{ followRequestCount }}
</span>
@@ -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;
}
}
</style>
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") }}
<span
v-if="unreadChatCount"
- class="badge badge-notification unread-chat-count"
+ class="badge badge-notification"
>
{{ unreadChatCount }}
</span>
@@ -99,7 +99,7 @@
/> {{ $t("nav.friend_requests") }}
<span
v-if="followRequestCount > 0"
- class="badge follow-request-count"
+ class="badge badge-notification"
>
{{ followRequestCount }}
</span>
@@ -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
--- a/static/logo.png
+++ /dev/null
Binary files 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 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ version="1.1"
+ id="svg4485"
+ width="512"
+ height="512"
+ viewBox="0 0 512 512"
+ sodipodi:docname="logo.svg"
+ inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)">
+ <metadata
+ id="metadata4491">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ <dc:title />
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs4489" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="1274"
+ inkscape:window-height="1410"
+ id="namedview4487"
+ showgrid="false"
+ inkscape:zoom="1.2636719"
+ inkscape:cx="305.99333"
+ inkscape:cy="304.30809"
+ inkscape:window-x="1280"
+ inkscape:window-y="22"
+ inkscape:window-maximized="0"
+ inkscape:current-layer="g4612"
+ inkscape:document-rotation="0" />
+ <g
+ id="g4612">
+ <g
+ id="g850"
+ transform="matrix(0.99659595,0,0,0.99659595,0.37313949,0.87143746)">
+ <path
+ style="opacity:1;fill:#fba457;fill-opacity:1;stroke:#009bff;stroke-width:0;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.175879"
+ d="m 194.75841,124.65165 a 20.449443,20.449443 0 0 0 -20.44944,20.44945 v 242.24725 h 65.28091 v -262.6967 z"
+ id="path4497" />
+ <path
+ style="fill:#fba457;fill-opacity:1;stroke:#000000;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+ d="M 272.6236,124.65165 V 256 h 45.61799 a 20.449443,20.449443 0 0 0 20.44944,-20.44945 v -110.8989 z"
+ id="path4516" />
+ <path
+ style="opacity:1;fill:#fba457;fill-opacity:1;stroke:#000000;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+ d="m 272.6236,322.06744 v 65.28091 h 45.61799 a 20.449443,20.449443 0 0 0 20.44944,-20.44945 v -44.83146 z"
+ id="path4516-5" />
+ </g>
+ </g>
+</svg>
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.</p>
<p>See the <a href='https://docs.pleroma.social/backend/configuration/static_dir/'>Pleroma documentation</a> for more information.</p>
<br>
-<img src="/static/logo.png" style="display: block; margin: auto; max-width: 100%; height: 50px; object-fit: contain;" />
+<img src="/static/logo.svg" style="display: block; margin: auto; max-width: 100%; height: 50px; object-fit: contain;" />