-
Notifications
You must be signed in to change notification settings - Fork 2
/
newTab.html
120 lines (111 loc) · 5.87 KB
/
newTab.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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<!-- Things to do:
-Use plain javascript for tagmanager.js
-Make the sticky nav sideways and fix stickinesss when not needed
-Make it possible to have pictures as the background
-->
<html>
<head>
<title>New Tab - Bookmark Manager</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<!-- For fonts -->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- Self made stylesheet -->
<!-- <link rel="stylesheet" href="styles.css"> -->
<!-- For picking colours -->
<link rel="stylesheet" href="styles.css">
</head>
<body id="bod" style="overflow: hidden;">
<script src="main.js"></script>
<div id="searchContainer" class="d-flex" style="position: relative; top: 17%;">
<input class="form-control d-inline-flex" id="searchButton" type="text" placeholder="Search Bookmarks" aria-label="Search" style="border-radius: 1.5em; font-size: xx-large;opacity: 0.7; width: 68%;margin: auto;" autocomplete="off">
</div>
<div id="middleLine" style="position: relative; top: 18%; height: 35px; width: 80%; border-radius: 20px; margin-left: auto; margin-right: auto; margin-bottom: 5px; margin-top: 2px;"></div>
<div class="modal fade" id="manage_tags" tabindex="-1" role="dialog" aria-labelledby="allTagsModalTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 id="modalTagTitle" class="modal-title">Manage tags</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" id="modal-tag-information">
<div id="manage_tags_place" class="pb-1"></div>
<div class="d-flex">
<input type="text" class="form-control" style="width: 100%;" id="newTagName" placeholder="Tag name" autocomplete="off">
<button id="addNewTagButton" class="btn btn-success ml-1">Enter</button>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="errorMessage" tabindex="-1" role="dialog" aria-labelledby="messages" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 id="errorTitle" class="modal-title">Error</h5>
</div>
<div class="modal-body" id="modal-tag-information">
<div id="errorBody"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="confirmationMessage" tabindex="-1" role="dialog" aria-labelledby="messages" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Confirmation</h5>
</div>
<div class="modal-body" id="modal-confirm-body">
<div id="confirmBody"></div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="informationModal" tabindex="-1" role="dialog" aria-labelledby="messages" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 id="infoTitle" class="modal-title"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</div>
<div class="modal-body" id="infoModal">
</div>
<div class="modal-footer">
<button type="button" class="btn" id="removeBookmarkModal" data-dismiss="modal" style="position:sticky;right: 100%;">Delete Bookmark</button>
<button type="button" class="btn" id="removeFolderModal" data-dismiss="modal" style="position:sticky;right: 100%;">Delete Folder</button>
<button type="button" class="btn" id="saveChangesInfoModal" data-dismiss="modal">Save & Close</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="updateMessage" tabindex="-1" role="dialog" aria-labelledby="messages" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 id="updateTitle" class="modal-title">Update</h5>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div id="bookmarks" style="position: relative; width:80%;top: 19%; margin: auto; overflow-x: hidden; background-color: white; border-radius: 2em; padding-left: 4%;"></div>
</body>
</html>