File size: 3,122 Bytes
be7c3bf
 
 
 
 
 
370e401
5f380f1
 
 
 
 
 
be7c3bf
 
 
 
 
 
ffcdab4
be7c3bf
ace5181
 
 
 
 
83ea6fc
ace5181
 
 
ffcdab4
 
 
 
 
 
 
 
 
 
 
 
 
ace5181
83ea6fc
ace5181
 
 
ffcdab4
ace5181
 
43e0d7d
ace5181
 
 
ffcdab4
 
 
 
 
 
 
 
 
 
 
 
 
ace5181
7ae1eb2
ace5181
 
 
 
062df00
ace5181
f03791c
ace5181
ffcdab4
be7c3bf
ffcdab4
be7c3bf
 
ace5181
be7c3bf
 
ffcdab4
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
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Currency Converter</title>
  <link rel="stylesheet" href="style.css">
 <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
<!-- Select2 CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0-beta.1/css/select2.min.css" rel="stylesheet">
<!-- Select2 JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0-beta.1/js/select2.min.js"></script>
  
</head>
<body>
  <div class="container">
    <header>
      <h1>Currency Converter</h1>
    </header>
    
    <form id="currencyForm">
      <!-- Amount Input -->
      <div class="form-group">
        <label for="amount">Amount</label>
        <input type="number" id="amount" placeholder="Enter amount" value="10.00" required>
      </div>

      <!-- From Currency -->
      <div class="form-group">
        <label for="fromCurrency">From</label>
        <div class="input-group">
          <select id="fromCurrency" required>
            <option value="USD" selected>USD - US Dollar</option>
            <option value="EUR">EUR - Euro</option>
            <option value="GBP">GBP - British Pound</option>
            <option value="IDR">IDR - Indonesian Rupiah</option>
            <option value="JPY">JPY - Japanese Yen</option>
            <option value="BRL">BRL - Brazilian Real</option>
            <option value="KRW">KRW - South Korean Won</option>
            <option value="AUD">AUD - Australian Dollar</option>
            <option value="CAD">CAD - Canadian Dollar</option>
          </select>
        </div>
      </div>

      <!-- Swap Button -->
      <div class="swap-group">
        <button type="button" id="swapButton" aria-label="Swap Currencies">
          <i class="fas fa-arrows-alt-v"></i>
        </button>
      </div>

      <!-- To Currency -->
      <div class="form-group">
        <label for="toCurrency">To</label>
        <div class="input-group">
          <select id="toCurrency" required>
            <option value="USD">USD - US Dollar</option>
            <option value="EUR">EUR - Euro</option>
            <option value="GBP">GBP - British Pound</option>
            <option value="IDR" selected>IDR - Indonesian Rupiah</option>
            <option value="JPY">JPY - Japanese Yen</option>
            <option value="BRL">BRL - Brazilian Real</option>
            <option value="KRW">KRW - South Korean Won</option>
            <option value="AUD">AUD - Australian Dollar</option>
            <option value="CAD">CAD - Canadian Dollar</option>
          </select>
        </div>
      </div>

      <!-- Result -->
      <div id="result" class="result-box">
        Result will appear here
      </div>

      <!-- Convert Button -->
      <button type="button" id="convertButton" class="convert-button">Convert</button>
    </form>
    
    <footer>
      <p>&copy; Copyright 2025 Teggar Eka M.S. All Rights Reserved </p>
    </footer>
  </div>

  <script src="script.js"></script>
</body>
</html>