Skip to content

Commit c6c243a

Browse files
sahandghavidelsahandghavidel
committed
update currency converter project
1 parent ea47391 commit c6c243a

File tree

4 files changed

+35
-158
lines changed

4 files changed

+35
-158
lines changed

‎projects/currency-converter/index.html‎

Lines changed: 12 additions & 107 deletions
Original file line numberDiff line numberDiff line change
@@ -4,139 +4,44 @@
44
<meta charset="UTF-8">
55
<meta http-equiv="X-UA-Compatible" content="IE=edge">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
<title>Currency_Converter_in_Javascript</title>
7+
<title>Currency Converter</title>
88
<link rel="stylesheet" href="style.css" />
99
</head>
1010
<body>
11-
<h1>Currency Converter</h1>
1211
<div class="main-box">
13-
<div class="second-box">
12+
<h1>Currency Converter</h1>
1413

15-
<p><h3>Welcome! Please Enter the values</h3></p>
16-
17-
<div class="container">
18-
<div class="currency">
14+
<div class="currency">
1915
<select id="curr-first">
20-
<option value="AED">AED</option>
21-
<option value="ARS">ARS</option>
2216
<option value="AUD">AUD</option>
23-
<option value="BGN">BGN</option>
24-
<option value="BRL">BRL</option>
25-
<option value="BSD">BSD</option>
2617
<option value="CAD">CAD</option>
27-
<option value="CHF">CHF</option>
28-
<option value="CLP">CLP</option>
29-
<option value="CNY">CNY</option>
30-
<option value="COP">COP</option>
31-
<option value="CZK">CZK</option>
32-
<option value="DKK">DKK</option>
33-
<option value="DOP">DOP</option>
34-
<option value="EGP">EGP</option>
3518
<option value="EUR">EUR</option>
36-
<option value="FJD">FJD</option>
3719
<option value="GBP">GBP</option>
38-
<option value="GTQ">GTQ</option>
39-
<option value="HKD">HKD</option>
40-
<option value="HRK">HRK</option>
41-
<option value="HUF">HUF</option>
42-
<option value="IDR">IDR</option>
43-
<option value="ILS">ILS</option>
44-
<option value="INR" selected>INR</option>
45-
<option value="ISK">ISK</option>
20+
<option value="INR">INR</option>
4621
<option value="JPY">JPY</option>
47-
<option value="KRW">KRW</option>
48-
<option value="KZT">KZT</option>
49-
<option value="MXN">MXN</option>
50-
<option value="MYR">MYR</option>
51-
<option value="NOK">NOK</option>
52-
<option value="NZD">NZD</option>
53-
<option value="PAB">PAB</option>
54-
<option value="PEN">PEN</option>
55-
<option value="PHP">PHP</option>
56-
<option value="PKR">PKR</option>
57-
<option value="PLN">PLN</option>
58-
<option value="PYG">PYG</option>
59-
<option value="RON">RON</option>
60-
<option value="RUB">RUB</option>
61-
<option value="SAR">SAR</option>
62-
<option value="SEK">SEK</option>
63-
<option value="SGD">SGD</option>
64-
<option value="THB">THB</option>
65-
<option value="TRY">TRY</option>
66-
<option value="TWD">TWD</option>
67-
<option value="UAH">UAH</option>
68-
<option value="USD">USD</option>
69-
<option value="UYU">UYU</option>
70-
<option value="VND">VND</option>
71-
<option value="ZAR">ZAR</option>
22+
<option value="USD" selected>USD</option>
7223
</select>
73-
<input type="number" id="worth-first" placeholder="0" value="1" />
24+
<input type="number" id="worth-first" value="1" min="0" />
7425
</div>
7526

76-
<div class="exchange-rate-container">
77-
<div class="exchange-rate" id="exchange-rate"></div>
78-
</div>
27+
7928

8029
<div class="currency">
8130
<select id="curr-second">
82-
<option value="AED">AED</option>
83-
<option value="ARS">ARS</option>
8431
<option value="AUD">AUD</option>
85-
<option value="BGN">BGN</option>
86-
<option value="BRL">BRL</option>
87-
<option value="BSD">BSD</option>
8832
<option value="CAD">CAD</option>
89-
<option value="CHF">CHF</option>
90-
<option value="CLP">CLP</option>
91-
<option value="CNY">CNY</option>
92-
<option value="COP">COP</option>
93-
<option value="CZK">CZK</option>
94-
<option value="DKK">DKK</option>
95-
<option value="DOP">DOP</option>
96-
<option value="EGP">EGP</option>
9733
<option value="EUR">EUR</option>
98-
<option value="FJD">FJD</option>
9934
<option value="GBP">GBP</option>
100-
<option value="GTQ">GTQ</option>
101-
<option value="HKD">HKD</option>
102-
<option value="HRK">HRK</option>
103-
<option value="HUF">HUF</option>
104-
<option value="IDR">IDR</option>
105-
<option value="ILS">ILS</option>
106-
<option value="INR">INR</option>
107-
<option value="ISK">ISK</option>
35+
<option value="INR" selected>INR</option>
10836
<option value="JPY">JPY</option>
109-
<option value="KRW" selected>KRW</option>
110-
<option value="KZT">KZT</option>
111-
<option value="MXN">MXN</option>
112-
<option value="MYR">MYR</option>
113-
<option value="NOK">NOK</option>
114-
<option value="NZD">NZD</option>
115-
<option value="PAB">PAB</option>
116-
<option value="PEN">PEN</option>
117-
<option value="PHP">PHP</option>
118-
<option value="PKR">PKR</option>
119-
<option value="PLN">PLN</option>
120-
<option value="PYG">PYG</option>
121-
<option value="RON">RON</option>
122-
<option value="RUB">RUB</option>
123-
<option value="SAR">SAR</option>
124-
<option value="SEK">SEK</option>
125-
<option value="SGD">SGD</option>
126-
<option value="THB">THB</option>
127-
<option value="TRY">TRY</option>
128-
<option value="TWD">TWD</option>
129-
<option value="UAH">UAH</option>
13037
<option value="USD">USD</option>
131-
<option value="UYU">UYU</option>
132-
<option value="VND">VND</option>
133-
<option value="ZAR">ZAR</option>
13438
</select>
135-
<input type="number" id="worth-second" placeholder="0" />
136-
</div>
39+
<input type="number" id="worth-second" disabled />
13740
</div>
41+
42+
<p class="exchange-rate" id="exchange-rate"></p>
13843
</div>
13944
</div>
140-
<script src="script.js"></script>
45+
<script src="index.js"></script>
14146
</body>
14247
</html>

‎projects/currency-converter/script.js‎ renamed to ‎projects/currency-converter/index.js‎

File renamed without changes.

‎projects/currency-converter/readme.md‎

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎projects/currency-converter/style.css‎

Lines changed: 23 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1,83 +1,60 @@
1-
* {
2-
box-sizing: border-box;
3-
}
1+
42
body {
53

6-
font-family: Arial, Helvetica, sans-serif;
4+
font-family:'Courier New', Courier, monospace;
75
display: flex;
86
flex-direction: column;
9-
align-items: center;
107
justify-content: center;
118
height: 100vh;
129
margin: 0;
13-
padding: 20px;
14-
background-image: linear-gradient(rgb(42, 105, 177),rgb(67, 207, 67) );
15-
}
16-
17-
h1 {
18-
color:blanchedalmond;
19-
text-align: center;
20-
}
21-
h3{
22-
text-align: center;
23-
}
24-
25-
p {
26-
text-align: center;
10+
padding: 0;
11+
background: yellow;
12+
align-items: center;
13+
2714
}
2815

29-
.main-box{
30-
border:12px solid rgb(56, 27, 187);
31-
background-color: #ff3399;
32-
border-radius: 25px;
33-
padding:40px;
3416

35-
}
36-
.second-box{
37-
border:2px solid ;
38-
background-color:#ff99cc;
39-
border-radius:20px;
17+
.main-box{
18+
background-color: darkcyan;
19+
color: aliceblue;
20+
border-radius: 5px;
4021
padding:10px;
22+
max-width: 600px;
23+
text-align: center;
24+
25+
4126
}
4227

4328
.currency {
44-
padding: 40px 0;
29+
padding: 20px;
4530
display: flex;
4631
align-items: center;
4732
justify-content: space-between;
4833
}
4934

5035
.currency select {
51-
padding: 10px 20px 10px 10px;
52-
53-
appearance: none;
54-
border: 1px solid #dedede;
55-
font-size: 16px;
56-
background: transparent;
57-
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%20000002%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
58-
background-position: right 10px top 50%, 0, 0;
59-
background-size: 12px auto, 100%;
60-
background-repeat: no-repeat;
36+
padding: 10px;
37+
6138
}
6239

6340
.currency input {
6441
border:0px;
6542
background: transparent;
66-
font-size: 30px;
43+
font-size: 25px;
6744
text-align: right;
45+
color: aliceblue;
6846
}
6947

7048

7149

7250
.exchange-rate {
73-
color:aliceblue;
74-
font-size: 14px;
75-
padding: 0 10px;
51+
font-size: 16px;
52+
padding: 10px;
53+
font-weight: 600;
7654
}
7755

7856
select:focus,
79-
input:focus,
80-
button:focus {
57+
input:focus {
8158
outline: 0;
8259
}
8360

0 commit comments

Comments
 (0)