-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathmycards.html
61 lines (47 loc) · 2.49 KB
/
mycards.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ballin!</title>
<link rel="SHORTCUT ICON" href="https://www.convertico.com/images/1585104286.8542/_previmg.png" type="image/x-icon" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/uikit.min.css" />
<link href="https://fonts.googleapis.com/css?family=Lalezar&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="uk-height-medium uk-flex uk-flex-center uk-flex-middle uk-background-cover uk-light"
data-src="https://cdn.pixabay.com/photo/2018/04/05/09/03/ball-3292243_1280.jpg?fit=crop&w=650&h=433&q=80"
data-srcset="https://cdn.pixabay.com/photo/2018/04/05/09/03/ball-3292243_1280.jpg?fit=crop&w=650&h=433&q=80 650w,
https://cdn.pixabay.com/photo/2018/04/05/09/03/ball-3292243_1280.jpg?fit=crop&w=1300&h=866&q=80 1300w"
data-sizes="(min-width: 650px) 650px, 100vw" uk-img>
<h1 id = "main-title">My Collection</h1>
</div>
<nav class="uk-navbar-container uk-margin uk-dark uk-navbar-transparent" uk-navbar>
<div class="uk-navbar-center">
<div class="uk-navbar-center">
<div class = "getCardsNav">
<a href="index.html"><button class="uk-button uk-button-secondary uk-button-large button-style">Go Back</button> </a>
</div>
</div>
</div>
</nav>
<div uk-filter="target: .js-filter">
<div class="container">
<ul class="uk-subnav uk-subnav-pill">
<li class="uk-active" uk-filter-control><a id="myCardsBtn">My Cards</a></li>
<li uk-filter-control="[data-rarity='legendary']"><a href="#">Legendary</a></li>
<li uk-filter-control="[data-rarity='rare']"><a href="#">Rare</a></li>
<li uk-filter-control="[data-rarity='common']"><a href="#">Common</a></li>
</ul>
<ul id="cardsGoHere" class="js-filter uk-child-width-1-2 uk-child-width-1-3@m uk-text-center" uk-grid>
</ul>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/uikit.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/uikit-icons.min.js"></script>
<script src="https://code.jquery.com/jquery.js"></script>
<script src="script.js"></script>
</body>
</html>