cv-maker/index.html at main · prchapagain/cv-maker · GitHub

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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<!DOCTYPE html>
<html lang="en">
<head>
    <div class="topnav">
        <a class="active" href="/">Home</a>
        <a href="/tabs/blog/">News</a>
        <a href="/tabs/projects.html">Projects</a>
        <a href="/tabs/links.html">Links</a>
    </div>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <title>CV Maker</title>
</head>
<body>
    <div class="container">
        <div class="logotext">
            <h6>CV Maker</h6>
            <h6>Fill out all the fields in the form, click 'Generate CV,' and download it as a PDF.</h6>
        </div>
        <div class="content">
            <div class="form-container">
                <form id="cv-form">
                    <h2>Personal Information</h2>
                    <label for="name">Name:</label>
                    <input type="text" id="name" placeholder="Enter your name" required>
                    <label for="address">Address:</label>
                    <input type="text" id="address" placeholder="Enter your address" required>
                    <label for="phone">Phone:</label>
                    <input type="tel" id="phone" placeholder="Enter your phone number" required>
                    <label for="email">Email:</label>
                    <input type="email" id="email" placeholder="Enter your email" required>
                    <label for="photo">Upload Photo:</label>
                    <input type="file" id="photo" accept="image/*" required>

                    <h2>Personal Details</h2>
                    <label for="dob">Date of Birth:</label>
                    <input type="date" id="dob" required>
                    <label for="sex">Sex:</label>
                    <input type="text" id="sex" placeholder="Enter your sex" required>
                    <label for="nationality">Nationality:</label>
                    <input type="text" id="nationality" placeholder="Enter your nationality" required>
                    <label for="citizenship-no">Citizenship No:</label>
                    <input type="text" id="citizenship-no" placeholder="Enter your citizenship number" required>
                    <label for="marital-status">Marital Status:</label>
                    <input type="text" id="marital-status" placeholder="Enter your marital status" required>
                    <label for="contact-address">Contact Address:</label>
                    <input type="text" id="contact-address" placeholder="Enter your contact address" required>

                    <h2>Objective</h2>
                    <textarea id="objective" rows="4" placeholder="Enter your career objective if you need"></textarea>

                    <h2>Academic Qualification</h2>
                    <div id="education-section">
                        <div class="education-entry">
                            <label for="degree">Education:</label>
                            <input type="text" class="degree" placeholder="Enter degree" required>
                            <label for="institution">Institution:</label>
                            <input type="text" class="institution" placeholder="Enter institution name" required>
                            <label for="year">Year:</label>
                            <input type="text" class="year" placeholder="Enter graduation year" required>
                        </div>
                    </div>
                    <button type="button" id="add-education">Add More Education</button>

                    <h2>Languages Proficiency</h2>
                    <div id="languages-section">
                        <div class="language-entry">
                            <label for="language">Language:</label>
                            <input type="text" class="language" placeholder="Enter language" required>
                        </div>
                    </div>
                    <button type="button" id="add-language">Add More Language</button>

                    <h2>Work Experience</h2>
                    <div id="work-section">
                        <div class="work-entry">
                            <label for="company">Company:</label>
                            <input type="text" class="company" placeholder="Enter company name" required>
                            <label for="role">Role:</label>
                            <input type="text" class="role" placeholder="Enter role" required>
                            <label for="duration">Duration:</label>
                            <input type="text" class="duration" placeholder="Enter duration" required>
                        </div>
                    </div>
                    <button type="button" id="add-work">Add More Work Experience</button>

                    <button type="submit">Generate CV</button>
                </form>
            </div>
            <div class="cv-preview-container">
                <div id="cv-output"></div>
                <button id="download-pdf">Download as PDF</button>
            </div>
        </div>
    </div>
    <div class="footer">

        Made with ♥ by PR chapagain
            <c class="alert"><img src="https://res.cloudinary.com/djcw5veb6/image/upload/v1719727590/about-xxl_ybbg2a.png" alt="about"></c>

            <script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
            <script>
                let custom_button = document.querySelector(".alert");
                custom_button.addEventListener('click', function () {
                    Swal.fire({
                        title: "<strong>Nepali Radio Player</strong>",
                        icon: "info",
                        html: `this player is created by PR CHAPAGAIN<br>
                            <a href="prchapagain.github.io">prchapagain.github.io</a><br>
                            <br>
                            visit project link <a href="https://github.com/prchapagain.github.io/nepali-radio-player"><b>here</b></a> for suggestions or help to improve player.`,
                        showCloseButton: true,
                        focusConfirm: false,
                        confirmButtonText: "close",
                    });
                });
            </script>
        </div>
    <script src="script.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.9.2/html2pdf.bundle.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>
</body>
</html>