Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd Logo
Upload

Welcome to Scribd!

  • 31 views

    Css

    Uploaded by

    Arun Kumar
    This CSS document defines styles for a login/signup page including a loading screen, boxes for the login/signup forms, and styles for form inputs, buttons, and messages. Key elements include a #loader element for the loading screen, #box and #main elements for containing boxes, #loginform and #signupform elements for the forms, and styles for form inputs, buttons, and messages within these elements.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd

    Css

    Uploaded by

    Arun Kumar
    31 views3 pages
    This CSS document defines styles for a login/signup page including a loading screen, boxes for the login/signup forms, and styles for form inputs, buttons, and messages. Key elements include a #loader element for the loading screen, #box and #main elements for containing boxes, #loginform and #signupform elements for the forms, and styles for form inputs, buttons, and messages within these elements.

    Original Title

    css

    Copyright

    © © All Rights Reserved

    Available Formats

    TXT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    This CSS document defines styles for a login/signup page including a loading screen, boxes for the login/signup forms, and styles for form inputs, buttons, and messages. Key elements include a #loader element for the loading screen, #box and #main elements for containing boxes, #loginform and #signupform elements for the forms, and styles for form inputs, buttons, and messages within these elements.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Download as txt, pdf, or txt
    31 views3 pages

    Css

    Uploaded by

    Arun Kumar
    This CSS document defines styles for a login/signup page including a loading screen, boxes for the login/signup forms, and styles for form inputs, buttons, and messages. Key elements include a #loader element for the loading screen, #box and #main elements for containing boxes, #loginform and #signupform elements for the forms, and styles for form inputs, buttons, and messages within these elements.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Download as txt, pdf, or txt
    of 3

    html,body{

    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100vh;

    #loader{
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 1;
    overflow: visible;
    background: transparent url('trailer.gif') no-repeat center center;
    background-size: cover;
    }

    #box{
    opacity: 0.8;
    height: 200px;
    width: 1000px;
    background-color:#000000;
    background-blend-mode: lighten;
    border-radius: 5px;
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%);
    }

    #main{
    height: 350px;
    width: 450px;
    background-color:white;
    border-radius: 5px;
    position: absolute;
    top:50%;
    left: 70%;
    transform: translate(-50%,-50%);
    z-index: 99;
    }

    #loginform,#signupform{
    position: absolute;
    top:50%;
    left: 70%;
    transform: translate(-50%,-50%);
    z-index: 999;
    }

    #signupform{
    top:45%;
    left: 75%;
    visibility: hidden;
    }

    #loginform h1,#signupform h1{


    font-family: arial;
    font-size: 25px;
    color:turquoise;
    }

    #loginform input,#signupform input{


    height: 40px;
    width: 300px;
    border: 0px;
    outline: none;
    border-bottom: 1px solid black;
    margin: 5px;
    }

    #loginform button,#signupform button{


    height: 35px;
    width: 130px;
    background-color:turquoise;
    font-family: monospace;
    font-size: 16px;
    color:white;
    border: none;
    outline: none;
    border-radius: 5px;
    margin-top: 30px;
    margin-left: 175px;
    }
    #login_btn,#signup_btn{
    height: 35px;
    width: 120px;
    background-color: transparent;
    color:white;
    border:1px solid white;
    border-radius: 5px;
    outline: none;
    position: absolute;
    left: 75%;
    top:65%;
    transform: translate(-50%,-50%);
    transition: all .5s;
    }
    #signup_btn{
    left: 25%;
    }
    #login_btn:hover,#signup_btn:hover{
    background-color:white;
    color:#2d2d2d;
    cursor: pointer;
    }
    #login_msg,#signup_msg{
    font-family: arial;
    font-size: 25px;
    color:white;
    position: absolute;
    top:35%;
    left: 75%;
    transform: translate(-50%,-50%);
    z-index: 1;
    }
    #signup_msg{
    left: 25%;
    }

    You might also like