Hugging Face's logo

Spaces:
Hev832
/
Encryption-Demo
Running

App Files Community
Hev832 commited on
Commit
c6925b9
·
verified ·
1 Parent(s): 6ee0af3

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +21 -106
index.html CHANGED
@@ -1,116 +1,31 @@
1
  <!DOCTYPE html>
2
- <html lang="id">
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Halaman Web Pribadi</title>
7
- <style>
8
- body {
9
- font-family: Arial, sans-serif;
10
- margin: 0;
11
- padding: 0;
12
- background-color: #f4f4f4;
13
- }
14
-
15
- header {
16
- background-color: #4CAF50;
17
- color: white;
18
- padding: 20px;
19
- text-align: center;
20
- }
21
-
22
- nav {
23
- background-color: #333;
24
- color: white;
25
- overflow: hidden;
26
- }
27
-
28
- nav a {
29
- float: left;
30
- display: block;
31
- color: white;
32
- text-align: center;
33
- padding: 14px 16px;
34
- text-decoration: none;
35
- }
36
-
37
- nav a:hover {
38
- background-color: #ddd;
39
- color: black;
40
- }
41
-
42
- .content {
43
- padding: 20px;
44
- }
45
-
46
- footer {
47
- background-color: #333;
48
- color: white;
49
- text-align: center;
50
- padding: 10px;
51
- position: fixed;
52
- width: 100%;
53
- bottom: 0;
54
- }
55
-
56
- .profile-pic {
57
- border-radius: 50%;
58
- width: 150px;
59
- height: 150px;
60
- object-fit: cover;
61
- display: block;
62
- margin: 0 auto;
63
- }
64
-
65
- .intro {
66
- text-align: center;
67
- }
68
- </style>
69
  </head>
70
  <body>
71
-
72
- <header>
73
- <h1>Nama Anda</h1>
74
- <p>Deskripsi singkat tentang diri Anda</p>
75
- </header>
76
-
77
- <nav>
78
- <a href="#about">Tentang Saya</a>
79
- <a href="#portfolio">Portofolio</a>
80
- <a href="#contact">Kontak</a>
81
- </nav>
82
-
83
- <div class="content">
84
- <section id="about">
85
- <h2>Tentang Saya</h2>
86
- <img src="profile.jpg" alt="Foto Profil" class="profile-pic">
87
- <p class="intro">Halo, saya [Nama Anda], seorang [Profesi/Keahlian]. Saya memiliki pengalaman dalam [deskripsi singkat tentang pengalaman Anda].</p>
88
- </section>
89
-
90
- <section id="portfolio">
91
- <h2>Portofolio</h2>
92
- <p>Berikut adalah beberapa proyek yang telah saya kerjakan:</p>
93
- <ul>
94
- <li><strong>Proyek 1:</strong> Deskripsi proyek.</li>
95
- <li><strong>Proyek 2:</strong> Deskripsi proyek.</li>
96
- <li><strong>Proyek 3:</strong> Deskripsi proyek.</li>
97
- </ul>
98
- </section>
99
-
100
- <section id="contact">
101
- <h2>Kontak</h2>
102
- <p>Anda dapat menghubungi saya melalui:</p>
103
- <ul>
104
- <li>Email: <a href="mailto:email@example.com">email@example.com</a></li>
105
- <li>Telepon: +62-812-3456-7890</li>
106
- <li>LinkedIn: <a href="https://www.linkedin.com/in/username" target="_blank">linkedin.com/in/username</a></li>
107
- </ul>
108
- </section>
109
  </div>
110
 
111
- <footer>
112
- <p>&copy; 2024 Nama Anda. Semua hak dilindungi.</p>
113
- </footer>
114
-
115
  </body>
116
  </html>
 
1
  <!DOCTYPE html>
2
+ <html lang="en">
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Encryption Demo</title>
7
+ <link rel="stylesheet" href="style.css">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8
  </head>
9
  <body>
10
+ <div class="container">
11
+ <h1>Encryption Demo</h1>
12
+ <textarea id="inputText" placeholder="Enter text to encrypt..."></textarea>
13
+
14
+ <div>
15
+ <label for="encryptionMethod">Select Encryption Method:</label>
16
+ <select id="encryptionMethod">
17
+ <option value="caesar">Caesar Cipher</option>
18
+ <option value="vigenere">Vigenère Cipher</option>
19
+ <option value="aes">AES Encryption</option>
20
+ </select>
21
+ </div>
22
+
23
+ <button onclick="encryptText()">Encrypt</button>
24
+
25
+ <h2>Encrypted Text:</h2>
26
+ <textarea id="outputText" readonly></textarea>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
27
  </div>
28
 
29
+ <script src="script.js"></script>
 
 
 
30
  </body>
31
  </html>