Skip to content

Commit e9e86c7

Browse files
authored
Merge branch 'main' into RealtimeCurrencyConverterProject
2 parents d4401a6 + 93767b9 commit e9e86c7

123 files changed

Lines changed: 1227 additions & 227 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

Projects/Calculator/js/script.js

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ for (item of buttons) {
4343
break;
4444

4545
case 'x':
46-
inputValue += '*';
46+
inputValue = eval(inputValue) + '*';
4747
result.innerHTML += '*';
4848
break;
4949

@@ -93,6 +93,25 @@ for (item of buttons) {
9393
inputValue = result.innerHTML;
9494
break;
9595

96+
case '+':
97+
inputValue = eval(inputValue) + '+';
98+
result.innerHTML += '+';
99+
100+
break;
101+
102+
case '-':
103+
inputValue = eval(inputValue) + '-';
104+
result.innerHTML += '-';
105+
106+
break;
107+
108+
109+
case '/':
110+
inputValue = eval(inputValue) + '/';
111+
result.innerHTML += '/';
112+
113+
break;
114+
96115
default :
97116
inputValue += buttonInput;
98117
result.innerHTML += buttonInput;

Projects/Dynamic js Quiz/index.html

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,19 @@
66
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Open Sans"/>
77
</head>
88
<body>
9-
<div id='container'>
10-
<div id='title'>
11-
<h1>Learning Js Properly: Project #1 - Dynamic Quiz</h1>
12-
</div>
13-
<br/>
14-
<div id='quiz'></div>
15-
<div class='button' id='next'><a href='#'>Next</a></div>
16-
<div class='button' id='prev'><a href='#'>Prev</a></div>
17-
<div class='button' id='start'> <a href='#'>Start Over</a></div>
18-
</div>
9+
<main>
10+
<div id="project-name">Dynamic Quiz Js</div>
11+
<div id='container'>
12+
<div id='quiz'></div>
1913

14+
<div class="controls">
15+
<div class='button' id='prev'>Prev</div>
16+
<div class='button' id='next'>Next</div>
17+
<div class='button' id='start'>Start Over</div>
18+
</div>
19+
</div>
20+
21+
</main>
2022
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
2123
<script type="text/javascript" src='questions.json'></script>
2224
<script type='text/javascript' src='text.js'></script>

Projects/Dynamic js Quiz/style.css

Lines changed: 83 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,71 +1,117 @@
1+
*{
2+
padding: 0;
3+
margin: 0;
4+
box-sizing: border-box;
5+
}
6+
17
body {
28
font-family: Open Sans;
9+
background-color: rgb(119, 199, 241);
310
}
411

5-
h1 {
6-
text-align: center;
12+
main{
13+
height: 100vh;
14+
width: 100vw;
715
}
816

9-
#title {
10-
text-decoration: underline;
17+
#project-name{
18+
border: 2px solid black;
19+
width: fit-content;
20+
margin: 30px auto;
21+
padding: 20px 60px;
22+
text-align: center;
23+
background-color: white;
24+
font-size: 24px;
25+
border-radius: 8px;
26+
font-weight: bold;
27+
/* margin-bottom: 30px; */
1128
}
1229

1330
#quiz {
14-
text-indent: 10px;
31+
/* text-indent: 10px; */
1532
display:none;
1633
}
17-
34+
.controls{
35+
margin-top: 30px;
36+
display: flex;
37+
justify-content: space-between;
38+
}
1839
.button {
19-
border:3px 3px solid;
20-
border-radius:3px;
21-
width: 40px;
22-
padding-left:9px;
23-
padding-right: 5px;
24-
position: relative;
25-
float:right;
26-
background-color: rgb(181, 223, 223);
27-
color: rgb(250, 204, 204);
28-
margin: 0 2px 0 2px;
40+
border-radius:8px;
41+
text-align: center;
42+
width: 120px;
43+
padding: 12px;
44+
background-color: rgb(214, 211, 211);
45+
border: 2px solid black;
2946
}
3047

3148
.button.active {
32-
background-color: #F8F8FF;
33-
color: #d7bbbb;
49+
background-color: #cac6c6;
3450
}
3551

36-
button {
37-
position: relative;
38-
float:right;
39-
}
4052

41-
.button a {
42-
text-decoration: none;
43-
color: black;
44-
}
4553

4654
#container {
4755
width:50%;
48-
margin:auto;
49-
padding: 0 25px 40px 10px;
50-
background-color: #715046;
51-
border:4px solid #b2cacc;
52-
border-radius:5px;
53-
color: #FFFFFF;
56+
padding: 30px;
57+
background-color: white;
58+
border:2px solid black;
59+
border-radius:8px;
5460
font-weight: bold;
55-
box-shadow: 5px 5px 5px #888;
61+
margin: 0 auto;
5662
}
5763

64+
.question{
65+
border: 2px solid black;
66+
padding: 12px;
67+
border-radius: 8px;
68+
margin-bottom: 15px;
69+
}
70+
.question p{
71+
font-weight: bolder;
72+
margin-bottom: 10px;
73+
}
5874
ul {
5975
list-style-type: none;
60-
padding: 0;
61-
margin: 0;
76+
display: flex;
77+
flex-direction: column;
78+
gap: 10px;
6279
}
6380

6481
#prev {
6582
display:none;
83+
/* visibility: hidden; */
6684
}
6785

6886
#start {
6987
display:none;
70-
width: 90px;
71-
}
88+
width: 120px;
89+
}
90+
91+
input[type="radio"] {
92+
display: none;
93+
}
94+
95+
label {
96+
border: 2px solid black;
97+
padding: 12px 8px;
98+
display: block;
99+
width: 100%;
100+
border-radius: 8px;
101+
}
102+
103+
input[type="radio"]:checked + label {
104+
background-color: rgb(119, 199, 241);
105+
color: white;
106+
}
107+
108+
.right {
109+
float: right;
110+
}
111+
112+
113+
@media screen and (max-width: 750px) {
114+
#container{
115+
width: 80%;
116+
}
117+
}

0 commit comments

Comments
 (0)