Support movie covers as avatars #1

Merged
rafaelcaricio merged 1 commit from movies-covers into main 2023-04-25 08:53:00 +00:00
11 changed files with 20 additions and 49 deletions

View file

@ -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>

View file

@ -41,7 +41,7 @@ export interface InstanceInfo {
},
},
login_message: string;
blockchains: BlockchainInfo[];
blockchains: BlockchainInfo[] | null;
ipfs_gateway_url: string | null;
}

View file

@ -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%;

View file

@ -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;

View file

@ -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;
}

View file

@ -24,7 +24,7 @@ export function useInstanceInfo() {
}
function getBlockchainInfo(): BlockchainInfo | null {
return instance.value?.blockchains[0] || null
return instance.value?.blockchains?.[0] ?? null
}
return {

View file

@ -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 {

View file

@ -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 {

View file

@ -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>

View file

@ -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,11 +113,7 @@ 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)
return false
}
watch($$(instance), () => {
@ -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;
}

View file

@ -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;