Eaglesoft Open Source: html

Showing posts with label html. Show all posts

Sunday, March 21, 2021

Website desing by Eaglesoft source code

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Welcome to Eaglesoft</title>
</head>
<body>
    
    <table  width="900px" height="100px" align="center">
        <tr>
            <td align="center" width="150px">
                <a href="index.html">
                <img src="logo.png" width="150px" height="100px">
            </a>
            </td>
            <td align="center" width="150px">
                <a href="index.html">Home</a>
            </td>
            <td align="center" width="150px">
                <a href="product.html">Products</a>
            </td>
            <td align="center" width="150px">
                <a href="outteam.html">Our Team</a>
            </td>
            <td align="center" width="150px">
                <a href="contact.html">Contact Us</a>
            </td>
            <td align="center" width="150px">
                <a href="about.html">About</a>
            </td>
        </tr>
    </table>

    <table border="1px" bgcolor="gray" width="900px" height="400px" align="center">
        <tr>
            <td align="center" width="450px">
                <h1>Best Laptop</h1>
                <h3>For Study</h3>
                <p>Shop our wide selection of laptops from top brands like Dell, Acer, HP, Apple or Asus and enjoy free shipping if you're in Pakistan. Grab the best deals today.</p>
            </td>
            <td align="center" width="450px">
                <img src="laptop.jpg" width="450px" height="300px">
            </td>
        </tr>
    </table>

    <table border="1px" width="900px" height="600px" align="center">
        <tr>
            <td align="center" width="700px" valign="top">
                <img src="laptop2.jpg" width="700px" height="250px">
                <h1>HP LAPTOPS ARE BEST IN THE WORLD</h1>
                <P>
                    Buy Hp, Acer, Lenovo, Dell, Sony Vaio Laptops With Best Laptop Prices In Pakistan From The Largest Online Store At HomeShopping.pk.Buy Hp, Acer, Lenovo, Dell, Sony Vaio Laptops With Best Laptop Prices In Pakistan From The Largest Online Store At HomeShopping.pk.Buy Hp, Acer, Lenovo, Dell, Sony Vaio Laptops With Best Laptop Prices In Pakistan From The Largest Online Store At HomeShopping.pk.Buy Hp, Acer, Lenovo, Dell, Sony Vaio Laptops With Best Laptop Prices In Pakistan From The Largest Online Store At HomeShopping.pk.Buy Hp, Acer, Lenovo, Dell, Sony Vaio Laptops With Best Laptop Prices In Pakistan From The Largest Online Store At HomeShopping.pk.
                </P>
            </td>
            <td align="center" valign="top" width="200px">

                <table border="1px" valign="top" width="187px">
                    <tr>
                        <td align="center" width="187px" bgcolor="yellow"><h1>LIKE US</h1></td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">
                            <a href="https://www.facebook.com/eaglesoft.pk">Facebook</a>
                        </td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">Insagram</td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">Twitter</td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">Linkeding</td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">youtube</td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">Qura</td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">Stackoverflow</td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">W3school</td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">Github</td>
                    </tr>
                    <tr>
                        <td align="center" width="187px">Eaglesoft</td>
                    </tr>
                    <tr>
                        <td align="center" width="187px"></td>
                    </tr>
                    <tr>
                        <td align="center" width="187px" height="112px">
                            <img src="add1.png" width="185" height="112px">
                        </td>
                    </tr>
                    <tr>
                        <td align="center" width="187px" height="112px">
                            <img src="add2.png" width="185" height="112px">
                        </td>
                    </tr>
                    
                
                </table>

            </td>
        </tr>
    </table>

    <table border="1px" bgcolor="green" width="900px" height="50px" align="center">
        <tr>
            <td align="center">Designed by Eaglesoft</td>
        </tr>
    </table>

</body>
</html>

Saturday, January 23, 2021

Login Form Eaglesoft Web development class.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Welcome to Eaglesoft</title>
    <style>
        *{
            margin: 0px;
            padding: 0px;
        }
        #main
        {
            background-image: url("https://wallpapercave.com/wp/u9AVLry.jpg");
            background-image: url("https://i.pinimg.com/originals/20/c4/ed/20c4ed904c96d955c7baed21e22d47e0.jpg");
            background-size: cover;
            width: 100vw;
            height: 100vh;
            position:absolute;
        }
        #login
        {
            background-color: blanchedalmond;
            border-radius: 20px;
            width: 20vw;
            height: 50vh;
            margin-top: 200px;
            margin-left:530px;
        }
        #h1
        {
            background-color: white;
            background-image: url("https://c2.staticflickr.com/2/1544/24128500842_485dea1a4c_o.png");
            background-size:cover;
            border-radius: 90px;
            width: 100px;
            height: 100px;
            position:absolute;
            margin-top: 5px;
            margin-left: 85px;
        }
        #username
        {
            margin-top: 120px;
            margin-left: 45px;
            margin: center;
            padding: 5px;
            border-radius: 30px;
        }
        #password
        {
            margin-top: 20px;
            margin-left: 45px;
            margin: center;
            padding: 5px;
            border-radius: 30px;
        }
        #submit
        {
            background-color:blue;
            color:white;
            font-weight: bolder;
            margin-top: 10px;
            margin-left: 90px;
            margin: center;
            padding: 5px;
            border-radius: 30px;
            width: 90px;
        }
        #forget
        {
            position:absolute;
            margin-left: 50px;
            margin-top: 20px;
            color:blue;
        }
    </style>
</head>
<body>
    <div id="main">
        <div id="login">
            <div id="h1"></div>
            <form>
            <input type="text" id="username" name="username" placeholder="Username" aligin="center">
            <input type="password" id="password" name="password" placeholder="password">
            <input type="submit" id="submit" name="submit" value="Login">
            <br>
            <i id="forget">Forget Password? Regiser</i>
          </form>
        </div>
    </div>
</body>
</html>

Friday, January 15, 2021

Login Form with Eaglesoft Programmers

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *
        {
            margin: 0px;
            padding: 0px;
        }
        body
        {
            background-image: 
            url("https://cutt.ly/7jRFJGq");
            background-repeat: no-repeat;
            background-size:cover;        }

        #main
        {
            background-color: rgb(24, 9, 224);
            border-radius: 50px 5px 50px 5px;
            box-shadow:4px 4px 8px rgb(97, 81, 81);
            width: 20vw;
            height: 50vh;
            margin: auto;
            margin-top: 100px;
            margin-left: 650px;
            position:absolute;
        }
        #main:hover
        {
            box-shadow:6px 6px 10px rgb(97, 81, 81);
        }
        #loginnow
        {
            color:rgb(238, 226, 54);
            font-weight: bold;
            font-size: 28px;
            text-shadow: greenyellow;
            text-align: center;
            margin-top: 60px;
            text-shadow: 2px 2px rgb(236, 57, 57);
        }
        .input
        {
            margin-left: 80px;
            margin-top:4px;
            width: 180px;
            height: 20px;
            color: white;
        }
        #button
        {
            background-color:yellow;
            margin-left: 135px;
            margin-top: 10px;
            width: 60px;
            height: 30px;
            color:brown;
            font-weight: bold;
            border-radius: 5px;
        }
        #button:hover
        {
            box-shadow: 1px 1px 1px 2px white;
            width: 62px;
            height: 32px;
        }
    </style>
</head>
<body>
    <div id="main">
        <H3 id="loginnow">Login Now</H3>
        <b class="input">User Name</b>
        <input type="text" placeholder="Username" class="input">
        <b class="input">Password</b>
        <input type="password" placeholder="Password" class="input">
        <br>
        <button id="button">Login</button>
    </div>
</body>
</html>

Thursday, January 14, 2021

Signup form for restaurant management system

To run this from on your system perform the following steps carefully:

1.Copy CSS code and save in a file with the name of eaglesoft.css ;

2.Copy HTML code and save in a file with the name of index.html ;

3.For view open your index file in you favourite web browser ;

CSS CODE:

body

{

    margin: 0;

    padding: 0;

    background: #efefef;

    font-size: 16px;

    color: #777;

    font-family: sans-serif;

    font-weight: 300;

}

#login-box

{

    position: relative;

    margin: 5% auto;

    height: 400px;

    width: 600px;

    background: #fff;

    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);

}

footer {

    background-color: #555;

    color: #fff;

    font-size: 14px;

    bottom: 0;

    position: fixed;

    left: 0;

    right: 0;

    text-align: center;

    z-index: 999;

}

footer p {

    margin: 10px 0;

    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida  Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;

}

footer a {

    color: #ff6f61;

    text-decoration: none;

  margin-right:5px;

}

.left-box

{

    position: absolute;

    top: 0;

    left: 0;

    box-sizing: border-box;

    padding: 40px;

    width: 300px;

    height: 400px;    

}

h1

{

    margin: 0 0 20px 0;

    font-weight: 300;

    font-size: 28px;

}

input[type="text"],

input[type="password"]

{

    display: block;

    box-sizing: border-box;

    margin-bottom: 20px;

    padding: 4px;

    width: 220px;

    height: 32px;

    border: none;

    outline: none;

    border-bottom: 1px solid #aaa;

    font-family: sans-serif;

    font-weight: 400;

    font-size: 15px;

    transition: 0.2s ease;

}

input[type="submit"]

{

    margin-bottom: 28px;

    width: 120px;

    height: 32px;

    background: #ff0080;

    border: none;

    border-radius: 2px;

    color: #fff;

    font-family: sans-serif;

    font-weight: 500;

    text-transform: uppercase;

    transition: 0.2s ease;

    cursor: pointer;

}

input[type="submit"]:hover,

input[type="submit"]:focus

{

    background: #ff0000;

    transition: 0.2s ease;

}

.right-box

{

    position: absolute;

    top: 0;

    right: 0;

    box-sizing: border-box;

    padding: 40px;

    width: 300px;

    height: 400px;

    background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjf9rU1c1b16h1kGfop1zYDGgE6KPiSVGG9rAzDBwcnOTMbQ_kN9n0_VrmpPee9hy7jLFUJvNO0HnSnQ_EJEN4f-ogcuDUvDvRrtdKB88pu4L-6Pd9SWnmDmTZaLHOkkjx0wCHN35MuNSCO/s2048/image1.jpeg);

    background-size: cover;

    background-position: center;

}

.or

{

    position: absolute;

    top: 180px;

    left: 280px;

    width: 40px;

    height: 40px;

    background: #efefef;

    border-radius: 50%;

    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);

    line-height: 40px;

    text-align: center;

}

.right-box .signinwith

{

    display: block;

    margin-bottom: 40px;

    font-size: 28px;

    color: #fff;

    text-align: center;

    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);

}

button.social

{

    margin-bottom: 20px;

    width: 220px;

    height: 36px;

    border: none;

    border-radius: 2px;

    color: #fff;

    font-family: sans-serif;

    font-weight: 500;

    transition: 0.2s ease;

    cursor: pointer;

}

.facebook

{

    background: #32508e;

}

.twitter

{

    background: #55acee;

}

.google

{

    background: #dd4b39;

}

HTML CODE:

<html>

<head>

<title>Signup Now</title>   

    <link rel="stylesheet" type="text/css" href="eaglesoft.css">

</head>

<body style="background-image: url(https://www.discoverlosangeles.com/sites/default/files/styles/hero/public/images/2019-01/lower-patio.jpg?itok=KGYP49fO)">

    <div id="login-box">

      <div class="left-box">

        <h1> Sign Up</h1>

          <input type="text" name="username" placeholder="Username"/>

          <input type="text" name="email" placeholder="Email"/>

          <input type="password" name="password" placeholder="Password"/>

          <input type="password" name="password2" placeholder="Retype password"/>

          <input type="submit" name="signup-button" value="Sign Up"/>

        </div>

        <div class="right-box">

          <span class="signinwith">Sign in with<br/>Social Network     </span>

        <button class="social facebook">Log in with Facebook</button>    

        <button class="social twitter">Log in with Twitter</button> 

        <button class="social google">Log in with Google+</button> 

        </div>

        <div class="or">OR</div>

    </div>

    <footer>

    <p>

    Developed by

    <a target="_blank" href="http://eaglesoft.com.pk/">Eaglesoft</a>

      </p>

</footer>

</body>    

</html>

Pages