Main project structure #3
@ -50,6 +50,21 @@
|
|||||||
font-size: xx-small;
|
font-size: xx-small;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.login-overlay-text {
|
||||||
|
position: absolute;
|
||||||
|
margin-left: 0;
|
||||||
|
top: 5%;
|
||||||
|
left: 5%;
|
||||||
|
z-index: 1;
|
||||||
|
text-wrap: balance;
|
||||||
|
max-width: 50vw;
|
||||||
|
text-shadow: 0px 0px 8px #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-video {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.login-logo {
|
.login-logo {
|
||||||
width: 200px;
|
width: 200px;
|
||||||
|
|||||||
@ -43,8 +43,16 @@ const Login = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="login">
|
<div className="login">
|
||||||
|
<div className="login-overlay-text">
|
||||||
|
<h3>
|
||||||
|
Welcome to Picrinth Web-Admin!<br/>
|
||||||
|
Picrinth is an open source app for scrolling synchronized<br/>
|
||||||
|
feeds of pictures from different sources together with your friends<br/>
|
||||||
|
Enjoy [#]
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
<div className="login-left">
|
<div className="login-left">
|
||||||
<video className='videoTag' autoPlay loop muted>
|
<video className="login-video" autoPlay loop muted>
|
||||||
<source src={"./test.mp4"} type='video/mp4' />
|
<source src={"./test.mp4"} type='video/mp4' />
|
||||||
</video>
|
</video>
|
||||||
</div>
|
</div>
|
||||||
@ -84,9 +92,9 @@ const Login = () => {
|
|||||||
Login
|
Login
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
<h2 style={{textAlign: "center"}}>
|
<h3 style={{textAlign: "center"}}>
|
||||||
<a href="http://localhost:5173/register" className="login-link">Create account</a>
|
<a href="http://localhost:5173/register" className="login-link">Create account</a>
|
||||||
</h2>
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
<div className="login-links-block">
|
<div className="login-links-block">
|
||||||
<h2>
|
<h2>
|
||||||
|
|||||||
Reference in New Issue
Block a user