Hugging Face's logo

Spaces:
GarGerry
/
CurrencyConverterBaru
Running

App Files Community
1
GarGerry commited on
Commit
e177352
·
verified ·
1 Parent(s): 3b31bc2

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +37 -32
index.html CHANGED
@@ -4,26 +4,32 @@
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Currency Converter</title>
7
- <link rel="stylesheet" href="style.css">
8
  </head>
9
  <body>
10
- <div class="navbar">
11
- <img src="logo.png" alt="Logo" class="logo"> <!-- Ganti logo.png dengan gambar logo yang Anda inginkan -->
12
- </div>
13
-
14
- <div class="headline">
15
- <h1>Currency Converter</h1>
16
- <p>Convert your currency easily</p>
17
- </div>
 
18
 
19
- <div class="container">
20
- <div class="converter">
21
- <label for="amount">Amount:</label>
22
- <input type="number" id="amount" placeholder="Enter amount" required>
 
23
 
24
- <label for="from-currency">From:</label>
 
 
 
25
  <select id="from-currency">
26
  <option value="USD">🇺🇸 USD - United States Dollar</option>
 
27
  <option value="BND">🇧🇳 BND - Brunei Dollar</option>
28
  <option value="KHR">🇰🇭 KHR - Cambodian Riel</option>
29
  <option value="IDR">🇮🇩 IDR - Indonesian Rupiah</option>
@@ -34,7 +40,6 @@
34
  <option value="SGD">🇸🇬 SGD - Singapore Dollar</option>
35
  <option value="THB">🇹🇭 THB - Thai Baht</option>
36
  <option value="VND">🇻🇳 VND - Vietnamese Dong</option>
37
- <option value="EUR">🇪🇺 EUR - Euro</option>
38
  <option value="GBP">🇬🇧 GBP - British Pound</option>
39
  <option value="CHF">🇨🇭 CHF - Swiss Franc</option>
40
  <option value="RUB">🇷🇺 RUB - Russian Ruble</option>
@@ -49,8 +54,7 @@
49
  <option value="KPW">🇰🇵 KPW - North Korean Won</option>
50
  <option value="HKD">🇭🇰 HKD - Hong Kong Dollar</option>
51
  </select>
52
-
53
- <label for="to-currency">To:</label>
54
  <select id="to-currency">
55
  <option value="EUR">🇪🇺 EUR - Euro</option>
56
  <option value="USD">🇺🇸 USD - United States Dollar</option>
@@ -78,31 +82,32 @@
78
  <option value="KPW">🇰🇵 KPW - North Korean Won</option>
79
  <option value="HKD">🇭🇰 HKD - Hong Kong Dollar</option>
80
  </select>
81
-
82
- <button id="convert-btn" onclick="convertCurrency()">Convert</button>
83
- <p id="result"></p>
84
  </div>
85
- </div>
 
86
 
87
- <div class="steps">
88
- <h2>How to Use</h2>
 
89
  <div class="step-box">
90
- <h3>1. Enter the Amount</h3>
91
  <p>Simply type the amount you want to convert in the input box.</p>
92
  </div>
93
  <div class="step-box">
94
- <h3>2. Select Your Currencies</h3>
95
- <p>Click the dropdown menu to choose USD as the currency you want to convert from, and EUR as the currency you want to convert to.</p>
96
  </div>
97
  <div class="step-box">
98
- <h3>3. That's It</h3>
99
- <p>Our currency converter will show you the current exchange rate and how it has changed over time.</p>
100
  </div>
101
- </div>
102
 
103
- <div class="footer">
104
- <p>About Us | Social Media | Copyright © 2025</p>
105
- </div>
 
106
 
107
  <script src="script.js"></script>
108
  </body>
 
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Currency Converter</title>
7
+ <link rel="stylesheet" href="styles.css">
8
  </head>
9
  <body>
10
+ <!-- Navbar -->
11
+ <nav class="navbar">
12
+ <div class="logo">
13
+ <img src="logo.png" alt="Logo">
14
+ </div>
15
+ <div class="brand-name">
16
+ <h1>Your Brand Name</h1>
17
+ </div>
18
+ </nav>
19
 
20
+ <!-- Headline Section -->
21
+ <section class="headline">
22
+ <h2>Currency Converter</h2>
23
+ <p>Convert your currencies easily and quickly.</p>
24
+ </section>
25
 
26
+ <!-- Converter Section -->
27
+ <section class="converter">
28
+ <div>
29
+ <input type="number" id="amount" placeholder="Enter amount" />
30
  <select id="from-currency">
31
  <option value="USD">🇺🇸 USD - United States Dollar</option>
32
+ <option value="EUR">🇪🇺 EUR - Euro</option>
33
  <option value="BND">🇧🇳 BND - Brunei Dollar</option>
34
  <option value="KHR">🇰🇭 KHR - Cambodian Riel</option>
35
  <option value="IDR">🇮🇩 IDR - Indonesian Rupiah</option>
 
40
  <option value="SGD">🇸🇬 SGD - Singapore Dollar</option>
41
  <option value="THB">🇹🇭 THB - Thai Baht</option>
42
  <option value="VND">🇻🇳 VND - Vietnamese Dong</option>
 
43
  <option value="GBP">🇬🇧 GBP - British Pound</option>
44
  <option value="CHF">🇨🇭 CHF - Swiss Franc</option>
45
  <option value="RUB">🇷🇺 RUB - Russian Ruble</option>
 
54
  <option value="KPW">🇰🇵 KPW - North Korean Won</option>
55
  <option value="HKD">🇭🇰 HKD - Hong Kong Dollar</option>
56
  </select>
57
+ <span>to</span>
 
58
  <select id="to-currency">
59
  <option value="EUR">🇪🇺 EUR - Euro</option>
60
  <option value="USD">🇺🇸 USD - United States Dollar</option>
 
82
  <option value="KPW">🇰🇵 KPW - North Korean Won</option>
83
  <option value="HKD">🇭🇰 HKD - Hong Kong Dollar</option>
84
  </select>
85
+ <button id="convert-btn">Convert</button>
 
 
86
  </div>
87
+ <div id="result"></div>
88
+ </section>
89
 
90
+ <!-- How to Use Section -->
91
+ <section class="steps">
92
+ <h3>How to Convert</h3>
93
  <div class="step-box">
94
+ <p><strong>1. Enter the Amount</strong></p>
95
  <p>Simply type the amount you want to convert in the input box.</p>
96
  </div>
97
  <div class="step-box">
98
+ <p><strong>2. Select Your Currencies</strong></p>
99
+ <p>Choose the currency you want to convert from and to.</p>
100
  </div>
101
  <div class="step-box">
102
+ <p><strong>3. That's It!</strong></p>
103
+ <p>Your conversion result will appear below.</p>
104
  </div>
105
+ </section>
106
 
107
+ <!-- Footer -->
108
+ <footer class="footer">
109
+ <p>© 2025 Your Brand Name. All Rights Reserved.</p>
110
+ </footer>
111
 
112
  <script src="script.js"></script>
113
  </body>