forked from AkkomaGang/akkoma-fe
Merge branch 'develop' into feat/favicon-badge
This commit is contained in:
commit
56c1d65384
15 changed files with 136 additions and 47 deletions
|
@ -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
|
||||
|
|
21
src/App.scss
21
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;
|
||||
|
|
|
@ -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 {
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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 {
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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'] : []),
|
||||
|
|
|
@ -113,7 +113,7 @@
|
|||
}
|
||||
|
||||
&.-blocked {
|
||||
pointer-events: none;
|
||||
cursor: progress;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
"hideSitename": false,
|
||||
"hideUserStats": false,
|
||||
"loginMethod": "password",
|
||||
"logo": "/static/logo.png",
|
||||
"logo": "/static/logo.svg",
|
||||
"logoMargin": ".1em",
|
||||
"logoMask": true,
|
||||
"logoLeft": false,
|
||||
|
|
BIN
static/logo.png
BIN
static/logo.png
Binary file not shown.
Before Width: | Height: | Size: 1.3 KiB |
71
static/logo.svg
Normal file
71
static/logo.svg
Normal file
|
@ -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>
|
After Width: | Height: | Size: 2.6 KiB |
|
@ -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;" />
|
||||
|
|
Loading…
Reference in a new issue