html
html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!--
reference https://codepen.io/xichen/pen/ZpgdGq
https://code.sololearn.com/WxPGmx3qi0G8/?ref=app
-->
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
</head>
<body>
</body>
</html>
Enter to Rename, Shift+Enter to Preview
css
css
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
body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
background-color: #22475E;
scroll-behavior: smooth;
}
* {
box-sizing: border-box;
}
.card {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}
.card-header {
margin-bottom:60px;
}
.card-header, .card, .card-footer, .card-body {
-webkit-border-radius: 0;
-moz-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
border: 0;
border: none !important;
}
Enter to Rename, Shift+Enter to Preview
js
js
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
alert ('Some Badge XPs are missing. If anyone know, please let me know!');
var xpDetails = [];
xpDetails.push({title : "Verify",
xp : [{subTitle : "Verified Account", info : "Verify your Email address", xp : 10, img : 'https://api.sololearn.com/Uploads/Achievements/103.png'}]});
xpDetails.push({title : "Course",
xp : [{subTitle : "Engaged In", info : "Complete a lesson", xp : 10, img : 'https://api.sololearn.com/Uploads/Achievements/56.png'},
{subTitle : "Good Citizen", info : "Leave a comment in Lesson/Quiz", xp : 10, img : 'https://api.sololearn.com/Uploads/Achievements/60.png'},
{subTitle : "Achiever", info : "Complete a course", xp : 10, img : 'https://api.sololearn.com/Uploads/Achievements/59.png'},
{subTitle : 'Hat trick ', info : 'Complete 3 courses', xp : 10, img : 'https://api.sololearn.com/Uploads/Achievements/57.png'},
{subTitle : 'Contributor', info : 'Leave a comment with 5 upvotes', xp : 25, img : 'https://api.sololearn.com/Uploads/Achievements/91.png'},
{subTitle : 'Respected Citizen', info : 'Reply to a comment and get 5 upvotes', xp : 15, img : 'https://api.sololearn.com/Uploads/Achievements/61.png'},
{subTitle : 'Comment Master', info : 'Leave 5 comments with at least 5 upvotes each', xp : 50, img : 'https://api.sololearn.com/Uploads/Achievements/92.png'},
{subTitle : 'Course Master', info : 'Complete 10 courses', xp : 100, img : 'https://api.sololearn.com/Uploads/Achievements/58.png'}]});
xpDetails.push({title : "Code",
xp : [{subTitle : 'Intern', info : 'Post a code and get an upvote', xp : 25, img : 'https://api.sololearn.com/Uploads/Achievements/93.png'},
{subTitle : 'Junior', info : 'Get 5 upvotes', xp : 50, img : 'https://api.sololearn.com/Uploads/Achievements/94.png'},
{subTitle : 'Developer', info : 'Get 10 upvotes', xp : 200, img : 'https://api.sololearn.com/Uploads/Achievements/95.png'},
{subTitle : 'Senior Developer', info : 'Get 50 upvotes on your code', xp : 500, img : 'https://api.sololearn.com/Uploads/Achievements/96.png'},
{subTitle : 'Coder', info : 'Post 5 codes with at least 5 upvotes each', xp : 250, img : 'https://api.sololearn.com/Uploads/Achievements/97.png'},
{subTitle : 'Code master', info : 'Post 10 codes with at least 5 upvotes each', xp : 500, img : 'https://api.sololearn.com/Uploads/Achievements/98.png'},
{subTitle : 'Code Ninja', info : 'Post 50 codes with at least 5 upvotes each', xp : 1000, img : 'https://api.sololearn.com/Uploads/Achievements/99.png'}]});
xpDetails.push({title : "Challenge",
xp : [{subTitle : 'Just getting started', info : 'Win a challenge', xp : 20, img : 'https://api.sololearn.com/Uploads/Achievements/62.png'},
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run