-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathunit-converter.html
101 lines (90 loc) · 2.65 KB
/
unit-converter.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Algebra</title>
</head>
<style>
@font-face {
font-family: "handwritten";
src: url(./fonts/nexa-rust/NexaRustSlab-BlackShadow01.otf);
}
.calc {
text-decoration: none;
font-family: "handwritten", sans-serif;
color: #000000;
padding: 10px;
display: flex;
justify-content: space-around;
box-shadow: rgb(0, 0, 0)1px 1px 20px;
background: linear-gradient(to right, #FFB84C, #FF6D28);
border-radius: 4%;
/*-webkit-background-clip: text;*/
/*-webkit-text-fill-color: transparent;*/
}
a:hover {
color: black;
background-color: yellow;
border-radius: 10px;
border: 5px solid black;
transition-property: all;
transition-duration: 150ms;
}
a:hover+.p1 {
display: block;
}
.flex-container {
margin-top: 100px;
display: flex;
justify-content: space-around;
}
.flex-container>div {
width: 300px;
margin: 10px;
text-align: center;
line-height: 75px;
font-size: 30px;
border-radius: 20px;
}
body {
background-image: url(https://www.allinonecalculator.com/images/home/background.jpg);
}
.p1 {
padding: 6%;
text-align: left;
font-size: 1.3rem;
line-height: 170%;
display: none;
box-shadow: rgb(255, 149, 0) 0 1px 20px;
border-radius: 4%;
justify-content: center;
background: linear-gradient(210deg, #000000, #4a4646);
color: white;
border-color: linear;
}
</style>
<body>
<div class="flex-container">
<div>
<a class="calc" href="./length.html" target="_blank" rel="noopener noreferrer">LENGTH CONVERTER<div></div>
</a>
<p class="p1">
The method of converting the measures of length from one unit to another is called length conversion. In the metric
system, units for length are kilometres (km), metres (m), centimetres (cm), and so on. The conversion of these units
from one unit to another is referred to as the conversion of units for length.
</p>
</div>
<div>
<a class="calc" href="./currency.html" target="_blank" rel="noopener noreferrer">CURRENCY CONVERTER
</a>
<p class="p1">
The foreign exchange market is a global decentralized or over-the-counter market for the trading of currencies. This
market determines foreign exchange rates for every currency. It includes all aspects of buying, selling and exchanging
currencies at current or determined prices.
</p>
</div>
</div>
</body>
</html>