Skip to content

Commit a171ae7

Browse files
tiago-m-diastiago-m-dias
committed
feat: sort without the/a/an
Challenge wesbos#17
1 parent 08fcf51 commit a171ae7

1 file changed

Lines changed: 63 additions & 47 deletions

File tree

‎17 - Sort Without Articles/index-START.html‎

Lines changed: 63 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,71 @@
11
<!DOCTYPE html>
22
<html lang="en">
3+
34
<head>
4-
<meta charset="UTF-8">
5-
<title>Sort Without Articles</title>
5+
<meta charset="UTF-8">
6+
<title>Sort Without Articles</title>
67
</head>
8+
79
<body>
810

9-
<style>
10-
body {
11-
margin: 0;
12-
font-family: sans-serif;
13-
background: url("https://source.unsplash.com/nDqA4d5NL0k/2000x2000");
14-
background-size: cover;
15-
display: flex;
16-
align-items: center;
17-
min-height: 100vh;
18-
}
19-
20-
#bands {
21-
list-style: inside square;
22-
font-size: 20px;
23-
background: white;
24-
width: 500px;
25-
margin: auto;
26-
padding: 0;
27-
box-shadow: 0 0 0 20px rgba(0, 0, 0, 0.05);
28-
}
29-
30-
#bands li {
31-
border-bottom: 1px solid #efefef;
32-
padding: 20px;
33-
}
34-
35-
#bands li:last-child {
36-
border-bottom: 0;
37-
}
38-
39-
a {
40-
color: #ffc600;
41-
text-decoration: none;
42-
}
43-
44-
</style>
45-
46-
<ul id="bands"></ul>
47-
48-
<script>
49-
const bands = ['The Plot in You', 'The Devil Wears Prada', 'Pierce the Veil', 'Norma Jean', 'The Bled', 'Say Anything', 'The Midway State', 'We Came as Romans', 'Counterparts', 'Oh, Sleeper', 'A Skylit Drive', 'Anywhere But Here', 'An Old Dog'];
50-
51-
52-
</script>
11+
<style>
12+
body {
13+
margin: 0;
14+
font-family: sans-serif;
15+
background: url("https://source.unsplash.com/nDqA4d5NL0k/2000x2000");
16+
background-size: cover;
17+
display: flex;
18+
align-items: center;
19+
min-height: 100vh;
20+
}
21+
22+
#bands {
23+
list-style: inside square;
24+
font-size: 20px;
25+
background: white;
26+
width: 500px;
27+
margin: auto;
28+
padding: 0;
29+
box-shadow: 0 0 0 20px rgba(0, 0, 0, 0.05);
30+
}
31+
32+
#bands li {
33+
border-bottom: 1px solid #efefef;
34+
padding: 20px;
35+
}
36+
37+
#bands li:last-child {
38+
border-bottom: 0;
39+
}
40+
41+
a {
42+
color: #ffc600;
43+
text-decoration: none;
44+
}
45+
</style>
46+
47+
<ul id="bands"></ul>
48+
49+
<script>
50+
const bands = ['The Plot in You', 'The Devil Wears Prada', 'Pierce the Veil', 'Norma Jean', 'The Bled', 'Say Anything', 'The Midway State', 'We Came as Romans', 'Counterparts', 'Oh, Sleeper', 'A Skylit Drive', 'Anywhere But Here', 'An Old Dog'];
51+
52+
function strip(bandName) {
53+
//replace insensitive
54+
return bandName.replace(/^(a | the | an )/i, '').trim();
55+
}
56+
57+
//sort the bands array alphabetically
58+
const sortedBands = bands.sort(function(a, b) {
59+
if (strip(a) > strip(b)) {
60+
return 1;
61+
} else {
62+
return -1;
63+
}
64+
});
65+
66+
console.log(sortedBands);
67+
</script>
5368

5469
</body>
55-
</html>
70+
71+
</html>

0 commit comments

Comments
 (0)