* Improve username styling

* Minor fixes
This commit is contained in:
styppo 2023-01-14 16:42:50 +00:00
parent 666c2faaeb
commit f471ffe011
No known key found for this signature in database
GPG Key ID: 3AAA685C50724C28
9 changed files with 32 additions and 10 deletions

View File

@ -48,7 +48,8 @@ export default {
opacity: .9;
}
&-value {
font-weight: 600;
font-weight: 500;
font-size: 0.9em;
}
}
</style>

View File

@ -7,7 +7,7 @@
<div class="menu-profile-items">
<div class="profile-info">
<p>
<UserName :pubkey="pubkey" two-line show-verified />
<UserName :pubkey="pubkey" two-line wrap show-verified />
</p>
</div>
<div class="more">
@ -119,6 +119,8 @@ export default {
justify-content: space-between;
.profile-info {
user-select: none;
max-width: 125px;
overflow: hidden;
p {
margin: 0;
& + p {
@ -134,7 +136,7 @@ export default {
width: 2rem;
height: 2rem;
svg {
width: 100%;
width: inherit;
fill: #fff;
display: block;
}

View File

@ -122,7 +122,7 @@ export default {
padding-bottom: 1rem;
&-author {
display: flex;
flex-direction: row;
align-items: center;
padding: 0 1rem;
&-name {
margin-top: 1rem;

View File

@ -128,6 +128,9 @@ export default {
display: flex;
transition: 100ms ease background-color;
border-bottom: $border-dark;
&:last-child {
border-bottom: 0;
}
&.clickable {
cursor: pointer;
&:hover {
@ -203,7 +206,7 @@ export default {
}
&-body {
color: #fff;
margin-bottom: 1rem;
margin-bottom: .5rem;
}
&-actions {
display: flex;

View File

@ -34,6 +34,7 @@ export default {
<style lang="scss" scoped>
.user-card {
display: flex;
align-items: center;
margin: 1rem;
* + * {
margin-left: 1rem;

View File

@ -1,7 +1,7 @@
<template>
<span
class="username"
:class="{'two-line': twoLine, clickable, header}"
:class="{'two-line': twoLine, clickable, header, wrap}"
>
<span class="name">
<a @click="clickable && goToProfile(pubkey)">
@ -42,6 +42,10 @@ export default {
type: Boolean,
default: false
},
wrap: {
type: Boolean,
default: false,
},
header: {
type: Boolean,
default: false,
@ -86,6 +90,17 @@ export default {
}
&.two-line {
display: block;
&.wrap {
.name {
flex-wrap: wrap;
.verified-badge {
margin-left: 0;
}
}
a {
margin-right: 4px;
}
}
}
&.clickable {
cursor: pointer;
@ -103,7 +118,7 @@ export default {
@media screen and (max-width: $phone-lg) {
.username.two-line {
.name {
display: block;
flex-wrap: wrap;
.verified-badge {
margin-left: 0;
}

View File

@ -14,7 +14,7 @@
$primary : #ee517d;
$secondary : #26A69A;
$accent : #9C27B0;
$accent : #ee517d;
$dark : #1D1D1D;
$dark-page : #121212;

View File

@ -148,7 +148,7 @@ export default class ReplayPool extends Observable {
}
onOpen(relay) {
console.log(`Connected to ${relay}`, relay)
console.log(`[RELAY] Connected to ${relay}`)
for (const subId of Object.keys(this.subs)) {
const sub = this.subs[subId]

View File

@ -11,7 +11,7 @@ export default class Nip05 {
const json = await res.json()
return json.names[user]
} catch (e) {
console.error(`Failed to fetch NIP05 data for ${nip05Id}`, e)
console.warn(`Failed to fetch NIP05 data for ${nip05Id}`, e)
}
}