Dashboard Temp Share Shortlinks Frames API

HTMLify

index_socials.html
Views: 375 | Author: cody 
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Signup Example</title>
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <div class="form-wrapper">
        <div class="form-side">
            <a href="#" title="Logo">
                <img class="logo" src="assets/logo.png" alt="Logo">
            </a>
            <form class="my-form">
                <div class="login-welcome-row">
                    <h1>Create your account &#x1F44F;</h1>
                </div>
                <div class="socials-row">
                    <a href="#" title="Use Google">
                        <img src="assets/google.png" alt="Google">
                        Sign up with Google
                    </a>
                    <a href="#" title="Use Apple">
                        <img src="assets/apple.png" alt="Apple">
                        Sign up with Apple
                    </a>
                </div>
                <div class="divider">
                    <span class="divider-line"></span>
                    Or
                    <span class="divider-line"></span>
                </div>
                <div class="text-field">
                    <label for="email">Email:
                        <input type="email" id="email" name="email" autocomplete="off" placeholder="Your Email"
                            required>
                        <!-- svg icon -->
                    </label>
                </div>
                <div class="text-field">
                    <label for="password">Password:
                        <input id="password" type="password" name="password" placeholder="Your Password" title="Minimum 6 characters at 
                                                        least 1 Alphabet and 1 Number"
                            pattern="^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{6,}$" required>
                        <!-- svg icon -->
                    </label>
                </div>
                <div class="text-field">
                    <label for="confirm-password">Repeat Password:
                        <input id="confirm-password" type="password" name="password" placeholder="Repeat Password"
                            title="Minimum 6 characters at east 1 Alphabet and 1 Number"
                            pattern="^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{6,}$" required>
                        <!-- svg icon -->
                    </label>
                </div>
                <button class="my-form__button" type="submit">
                    Sign up
                </button>
                <div class="my-form__actions">
                    <div class="my-form__row">
                        <span>Did you forget your password?</span>
                        <a href="#" title="Reset Password">
                            Reset Password
                        </a>
                    </div>
                    <div class="my-form__signup">
                        <a href="#" title="Login">
                            Login
                        </a>
                    </div>
                </div>
            </form>
        </div>
        <div class="info-side">
            <img src="assets/mock.png" alt="Mock" class="mockup" />
            <div class="welcome-message">
                <h2>Navitron Maps! 👋</h2>
                <p>
                    Your ultimate guide to navigating the world
                    and discovering new places with ease.
                </p>
            </div>
        </div>
    </div>
    <script src="script.js"></script>
</body>

</html>

Share this file: