Support movie covers as avatars #1
11 changed files with 20 additions and 49 deletions
|
@ -18,7 +18,7 @@ loadInstanceInfo()
|
|||
|
||||
watch($$(currentUser), () => {
|
||||
const title = currentUser ? `@${currentUser.username}` : "Federated social network"
|
||||
document.title = `Mitra | ${title}`
|
||||
document.title = `FediMovies.rocks | ${title}`
|
||||
}, { immediate: true })
|
||||
</script>
|
||||
|
||||
|
|
|
@ -41,7 +41,7 @@ export interface InstanceInfo {
|
|||
},
|
||||
},
|
||||
login_message: string;
|
||||
blockchains: BlockchainInfo[];
|
||||
blockchains: BlockchainInfo[] | null;
|
||||
ipfs_gateway_url: string | null;
|
||||
}
|
||||
|
||||
|
|
|
@ -32,11 +32,11 @@ const avatarUrl = computed<string>(() => {
|
|||
<style scoped lang="scss">
|
||||
.avatar {
|
||||
background-color: var(--block-background-color);
|
||||
border-radius: 50%;
|
||||
//border-radius: 50%;
|
||||
box-sizing: border-box;
|
||||
|
||||
img {
|
||||
border-radius: inherit;
|
||||
//border-radius: inherit;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
|
|
|
@ -78,7 +78,7 @@ $profile-padding: calc($block-inner-padding / 2);
|
|||
flex-direction: row;
|
||||
|
||||
.avatar {
|
||||
height: $avatar-size;
|
||||
height: $avatar-size * 1.5;
|
||||
margin-right: $profile-padding;
|
||||
margin-top: calc(-1 * ($profile-padding + $avatar-size / 3));
|
||||
min-width: $avatar-size;
|
||||
|
|
|
@ -40,10 +40,10 @@
|
|||
}
|
||||
|
||||
h1.page-heading {
|
||||
font-size: 90px;
|
||||
font-size: 60px;
|
||||
font-weight: bold;
|
||||
margin: 0 0 20px;
|
||||
text-transform: uppercase;
|
||||
//text-transform: uppercase;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
|
|
|
@ -24,7 +24,7 @@ export function useInstanceInfo() {
|
|||
}
|
||||
|
||||
function getBlockchainInfo(): BlockchainInfo | null {
|
||||
return instance.value?.blockchains[0] || null
|
||||
return instance.value?.blockchains?.[0] ?? null
|
||||
}
|
||||
|
||||
return {
|
||||
|
|
|
@ -16,7 +16,7 @@ export function ethereumAddressMatch(address1: string, address2: string): boolea
|
|||
}
|
||||
|
||||
export function hasEthereumWallet(): boolean {
|
||||
return Boolean((window as any).ethereum)
|
||||
return false
|
||||
}
|
||||
|
||||
export function getWeb3Provider(): Web3Provider {
|
||||
|
|
|
@ -5,9 +5,9 @@
|
|||
<div class="description static-text" v-html="instance.description"></div>
|
||||
<details class="technical-info static-text">
|
||||
<summary>Technical Info</summary>
|
||||
mitra version: {{ getMitraVersion(instance.version) }}
|
||||
backend version: {{ getMitraVersion(instance.version) }}
|
||||
<br>
|
||||
mitra-web version: {{ APP_VERSION }}
|
||||
web version: {{ APP_VERSION }}
|
||||
</details>
|
||||
</template>
|
||||
</sidebar-layout>
|
||||
|
@ -32,7 +32,7 @@ const { currentUser } = $(useCurrentUser())
|
|||
const { instance } = $(useInstanceInfo())
|
||||
|
||||
function getMitraVersion(apiVersion: string): string {
|
||||
const match = apiVersion.match(/.+Mitra ([\d.]+)/)
|
||||
const match = apiVersion.match(/.+Reef ([\d.]+)/)
|
||||
if (match) {
|
||||
return match[1]
|
||||
} else {
|
||||
|
|
|
@ -1,15 +1,9 @@
|
|||
<template>
|
||||
<static-page class="wide">
|
||||
<template #heading>Ethereum</template>
|
||||
<template #heading>No blockchains!</template>
|
||||
<template #text>
|
||||
<p>
|
||||
You can register on this server with your <a href="https://ethereum.org/en/wallets/find-wallet/?filters=has_explore_dapps" target="_blank" rel="noopener">Ethereum wallet</a>.
|
||||
<a href="https://metamask.io/" target="_blank" rel="noopener">MetaMask</a> is a good choice for beginners.
|
||||
Your wallet address will be stored for authentication purposes and will not be exposed unless you later complete the address verification procedure.
|
||||
In that case, your address will be publicly associated with your account.
|
||||
To protect your privacy, it is recommended that you create a fresh address and don't link it to your other activities.
|
||||
This can be achieved by using an exchange <a href="http://kycnot.me/" target="_blank" rel="noopener">that doesn't require identity verification</a>.
|
||||
For general privacy recommendations, visit <a href="https://www.privacyguides.org/tools/" target="_blank" rel="noopener">PrivacyGuides</a> website.
|
||||
Don't use cryptocurrencies. Thanks!
|
||||
</p>
|
||||
</template>
|
||||
</static-page>
|
||||
|
|
|
@ -10,21 +10,6 @@
|
|||
</div>
|
||||
</div>
|
||||
<div v-if="instance" class="login-form-group">
|
||||
<div class="login-type">
|
||||
<button
|
||||
v-if="!isWalletRequired()"
|
||||
:class="{ active: loginType === 'password' }"
|
||||
@click.prevent="loginType = 'password'; loginErrorMessage = null"
|
||||
>
|
||||
Password
|
||||
</button>
|
||||
<button
|
||||
:class="{ active: loginType === 'eip4361' }"
|
||||
@click.prevent="loginType = 'eip4361'; loginErrorMessage = null"
|
||||
>
|
||||
Ethereum
|
||||
</button>
|
||||
</div>
|
||||
<form class="login-form">
|
||||
<div v-if="isLoading" class="login-form-loader">
|
||||
<loader></loader>
|
||||
|
@ -47,7 +32,7 @@
|
|||
Only lowercase letters, numbers and underscores are allowed.
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-control" v-if="loginType === 'password'">
|
||||
<div class="form-control">
|
||||
<input
|
||||
id="password"
|
||||
type="password"
|
||||
|
@ -64,10 +49,6 @@
|
|||
placeholder="Enter the invite code"
|
||||
>
|
||||
</div>
|
||||
<div class="wallet-required" v-if="loginType === 'eip4361'">
|
||||
<img src="@/assets/forkawesome/ethereum.svg">
|
||||
<router-link :to="{ name: 'ethereum' }">Ethereum Wallet</router-link> is required
|
||||
</div>
|
||||
<button
|
||||
v-if="isRegistered"
|
||||
type="submit"
|
||||
|
@ -132,12 +113,8 @@ let isLoading = $ref(false)
|
|||
let loginErrorMessage = $ref<string | null>(null)
|
||||
|
||||
function isWalletRequired(): boolean {
|
||||
if (!instance) {
|
||||
return false
|
||||
}
|
||||
const blockchain = getBlockchainInfo()
|
||||
return Boolean(blockchain?.features.gate)
|
||||
}
|
||||
|
||||
watch($$(instance), () => {
|
||||
if (hasEthereumWallet() || isWalletRequired()) {
|
||||
|
@ -302,10 +279,10 @@ $landing-text-color: #fff;
|
|||
}
|
||||
|
||||
.instance-title {
|
||||
font-size: 90px;
|
||||
font-size: 60px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20px;
|
||||
text-transform: uppercase;
|
||||
//text-transform: uppercase;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
|
|
|
@ -638,7 +638,7 @@ async function loadFollowListNextPage() {
|
|||
@import "../styles/mixins";
|
||||
@import "../styles/theme";
|
||||
|
||||
$avatar-size: 170px;
|
||||
$avatar-size: 185px;
|
||||
|
||||
.profile-block {
|
||||
@include block-btn;
|
||||
|
@ -683,7 +683,7 @@ $avatar-size: 170px;
|
|||
}
|
||||
|
||||
.avatar {
|
||||
height: $avatar-size;
|
||||
height: $avatar-size * 1.5;
|
||||
margin-right: auto;
|
||||
margin-top: calc(-1 * ($avatar-size / 2 + $block-inner-padding));
|
||||
min-width: $avatar-size;
|
||||
|
|
Loading…
Reference in a new issue