Blockchain code Metaverse VR

SmartContract×VR×Crypto(599)

スポンサーリンク

//tips

//smart contract

きちんとアンカー機能を導入できたので、メッセージを押した際にアンカー場所に移動させるように設定していく。

{ninja[0].text&&
ninja[0].text.map((item,index) => (
<div item key={index} >
<Link href="#comments"><a>
<div className={classes.titleback} onClick={()=>{setDetails(">>"+index+" ")}}>

<h2>{index} &nbsp; ◆{item.username}◆{Date(Date.now())}</h2>
<Typography sx={{ fontSize: 40 }} >{item.chat}</Typography>

</div>
</a></Link>

こうすることで上部のテキストを押すとコメント入力欄が見える位置まで下がってくる。

ただ、アンカーリンクの独自の表記となり、かなりみにくいのでこの形式は削除したい。

<Link href="#comments" sx={{ textDecoration: 'none' }}><a>

こちらでは効果がなかった。

style={{ textDecoration 'none' }}をaに適用すると下線が消えた。

<Link href="#comments" ><a style={{ textDecoration: 'none' }}>

色も黒に統一。

<Link href="#comments" ><a style={{ color: 'black',textDecoration: 'none' }}>

Textfield内の入力文字が確認しづらかったので、文字を大きく調整。inputPropsの形で実現可能だった。

https://www.web-dev-qa-db-ja.com/ja/css/%E3%83%9E%E3%83%86%E3%83%AA%E3%82%A2%E3%83%ABui%E3%81%AE%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88%E3%83%95%E3%82%A3%E3%83%BC%E3%83%AB%E3%83%89%E3%81%AE%E3%83%95%E3%82%A9%E3%83%B3%E3%83%88%E3%82%B5%E3%82%A4%E3%82%BA%E3%82%92%E5%A4%89%E6%9B%B4%E3%81%A7%E3%81%8D%E3%81%BE%E3%81%9B%E3%82%93/838570247/

素晴らしい。

<TextField
onChange={(e)=>setDetails(e.target.value)}
variant="outlined"
color="secondary"
fullWidth
required
value={details}

inputProps={{
style: {fontSize: 50}
}}

/>

また、複数行記入を可能にするため、

multiline
rows={4}

を追加。

これでBoard[id]の方は一通り良いか。BoardのUIの修正に戻る前に、自身のアバタームービをeditページに追加していく。

なぜか自身の動画を見れず、下記にてなんとか見ることができた。editページにも追加。

BoardのUIはコメント全部を見せるのではなく、最初の人のタイトルおよび詳細と一定の長さからはホワイトアウトさせていく形にするか。

コメント数で上位のものを決め、あとはスレッド形式で表示させる方がいいかもしれない。

人気の記事

1

コロナによる需要変化 コロナパンデミックの影響で、人々は外に出られなくなり、自宅で過ごす時間が増えました。 この自粛ムードの中、下記のようなビジネスの需要変化が引き起こされています。 【利用者減少】 ...

2

米国レストランの決済時に毎日お世話になっていた「Square」のビジネスモデルについて本日はふれていきたいと思います。 「Square」とは、ネットにつながったモバイル端末と専用のカードリーダーを用意 ...

3

無料でネットショップを開けるアプリとして多くの人に驚きを与えたBASE株式会社が、2019年10月25日東証マザーズに上場しました。2020年2月時点で90万店を超えるショップを抱えるまでに成長してい ...

4

2011年にサービスを開始してから圧倒的な成長率を誇るインテリア通販サイト 【FLYMEe/フライミー】を皆さんご存じでしょうか。 「自分のイメージするインテリア、本当に欲しいインテリアがどこにあるの ...

5

ナイキのSNKRSが、なぜこれほどまでに人気なのか?調べてみました。 きっかけは米国での友達との会話。彼は自分のシューズをみせて、「これ20万円もしたんだぜ。」と語ってくれました。 あまり靴に興味がな ...

-Blockchain, code, Metaverse, VR
-, ,

Copyright© BUSINESS HUNTER , 2022 All Rights Reserved Powered by AFFINGER5.