-
Notifications
You must be signed in to change notification settings - Fork 1
/
bootstrap.html
executable file
·185 lines (183 loc) · 11.6 KB
/
bootstrap.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
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon-16x16.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<link rel="manifest" href="/site.webmanifest">
<title>DevDum!</title>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<header>
<div id="header">
<svg version="1.1" id="Capa_1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve"></svg>
</div>
</div>
<div id="mobileMenuToggle" title="Menu">Menu</div>
<div id="headerLeft">
<a href="/"><img alt="Home" title="Home" id="menuToggle" src="DevDum copy (1).png" width="190px"/></a>
</div>
<div id="headerRight">
<nav>
<ul>
<li><a id="github" rel="nofollow" href="https://github.com/" target="_blank">GitHub</a></li>
<li><a id="dailydev"rel="nofollow" href="https://app.daily.dev/" target="_blank">DailyDev</a></li>
<li><a id="w3" rel="nofollow" href="https://www.w3schools.com/" target="_blank">W3Schools</a></li>
<li><a id="mdn" rel="nofollow" href="https://developer.mozilla.org/en-US/" target="_blank">MDN WebDocs</a></li>
<li><a id="stack"rel="nofollow" href="https://stackoverflow.com/" target="_blank">StackOverflow</a></li>
</ul>
</nav>
</div>
</div>
</header>
<div id="wrapall">
<div id="sidebar">
<div id="stickThis">
<div id="sidebarContent">
<!-- <div id="logo"><imd </h1>
<h4>Less Searching. More Learning.</h4> -->
<aside>
<div><a id="color1" href="html.html"><img alt="HTML" title="HTML" src="icons/output-onlineimagetools-html.png"/></a></div>
<div><a id="color2" href="style.html"><img alt="CSS" title="CSS" src="icons/output-onlineimagetools-css.png"/></a></div>
<div><a id="color3" href="javascript.html"><img alt="JavaScript" title="Javascript" src="icons/output-onlineimagetools-js.png" width="53px"/></a></div>
<div><a id="color4" href="bootstrap.html"><img alt="Bootstrap" title="Bootstrap" src="icons/output-onlineimagetools-bootstrap.png"/></a></div>
<div><a id="color5" href="react.html"><img alt="React" title="React" src="icons/output-onlineimagetools-react.png"/></a></div>
<div><a id="color6" href="nodejs.html"><img alt="Node" title="Node" src="icons/output-onlineimagetools-nodejs.png" width="50px"/></a></div>
<div><a id="color7" href="api.html"><img alt="API" title="API" src="icons/output-onlineimagetools-api.png"/></a></div>
<div><a id="color8" href="mysql.html"><img alt="SQL" title="SQL" src="icons/output-onlineimagetools-sql.png"/></a></div>
<div><a id="color9" href="github.html"><img alt="GitHub" title="GitHub" src="icons/output-onlineimagetools-github.png"/></a></div>
<div><a id="color10" href="youtube.html"><img alt="YouTube" title="YouTube" src="icons/output-onlineimagetools-youtube.png"/></a></div>
<div><a id="color11" href="more.html"><img alt="More" title="More" src="icons/output-onlineimagetools-more.png" width="48px"/></a></div>
<a class="back2Top" href="#"><code>⮝ Back to Top ⮝</code></a>
</aside>
</div>
</div>
<div id="stick-here"></div>
</div>
<div id="main">
<section id="page">
<main>
<article id="yellow">
<h1 class="display-2">Bootstrap<span class="vim-caret"><img alt="bookstrap" title="bootstrap" src="icons/output-onlineimagetools-bootstrap.png" width="68px"/></span></h1>
<h4><strong>Bootstrap is a free front-end framework for faster and easier web development. Bootstrap includes HTML and CSS based design templates as well as optional JavaScript plugins.</strong></h4>
<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for resources..." title="Type in a name">
</article>
<ul id="myUL">
<article>
<h2><a href="https://getbootstrap.com/" target="_blank">Get Bootstrap: Front-End Framework</a></h2>
<p>Download the world’s most popular front-end open source toolkit.</p>
</article>
<article>
<h2><a href="https://www.w3schools.com/bootstrap4/default.asp" target="_blank">W3 Schools | Bootstrap Tutorial</a></h2>
<p>A complete list of all Bootstrap CSS classes with description and exampletutorials contain hundreds of Bootstrap examples.</p>
</article>
<article>
<h2><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference" target="_blank">MDN | HTML Reference</a></h2>
<p>This HTML reference describes all elements and attributes of HTML, including global attributes that apply to all elements.</p>
</article>
<article>
<h2><a href="https://getbootstrap.com/docs/5.1/examples/" target="_blank">Bootstrap Examples</a></h2>
<p>Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.</p>
</article>
<article>
<h2><a href="https://hackerthemes.com/bootstrap-cheatsheet/" target="_blank">Hackerthemes | Bootstrap 4 Cheat Sheet</a></h2>
<p>An interactive list of Bootstrap classes with downloabe templates and themse for version 4.3.1</p>
</article>
<article>
<h2><a href="https://overapi.com/html" target="_blank">OverAPI | HTML Cheat Sheet</a></h2>
<p>HTML Tools & Cheat Sheets: this is the whole code of OverAPI, you can fork it and use it like Github Pages locally.</p>
</article>
<article>
<h2><a href="https://www.w3schools.com/bootstrap/bootstrap_examples.asp" target="_blank"> W3 Schools | Bootstrap Examples</a></h2>
<p>W3.org is the current HTML standard. It obsoletes all other previously-published HTML specifications.</p>
</article>
<article>
<h2><a href="https://devdocs.io/bootstrap~4/" target="_blank">DevDocs | Bootstrap Reference</a></h2>
<p>Get started with Bootstrap, the world’s most popular framework for building responsive, mobile-first sites, with jsDelivr and a template starter page.</p>
</article>
<article>
<h2><a href="https://www.creative-tim.com/cheatsheet/bootstrap4" target="_blank">Creative Tim | Bootstrap 4 Cheat Sheet</a></h2>
<p>Fully Coded UI Tools to create web and mobile apps. Download the best Bootstrap Themes and Templates developed by Creative Tim. </p>
</article>
<article>
<h2><a href="https://bootswatch.com/" target="_blank">Bootswatch | Free Themes for Bootstrap</a></h2>
<p>Simply download a CSS file and replace the one in Bootstrap. No messing around with hex values. Bootstrap themes are released under the MIT License and maintained by the community on GitHub.</p>
</article>
<article>
<h2><a href="https://colorlib.com/wp/cat/bootstrap/" target="_blank">Colorlib | Bootstrap Templates</a></h2>
<p>The best Bootstrap templates that you will ever find for your website. Mainly based on Bootstrap 4 & 5 to get the most out of your website or upcoming project.</p>
</article>
<article>
<h2><a href="https://bootstraptaste.com/" target="_blank">BootstrapTaste | Premium & Free Templates 2022</a></h2>
<p>Looking for a good collection of Bootstrap templates and themes? You have landed on the right page.</p>
</article>
<article>
<h2><a href="https://dev.to/sm0ke/bootstrap-templates-open-source-and-free-63e" target="_blank">Dev Community | Open Source Templates</a></h2>
<p>This article presents a curated list with Bootstrap Templates provided for free by open-source enthusiasts (freelancers & agencies).</p>
</article>
<article>
<h2><a href="https://mdbootstrap.com/docs/b5/react/" target="_blank">Material Design | Bootstrap v5 & v4 </a></h2>
<p>Learn how to use 700+ UI components & templates. MDB is integrated with the latest version of React. </p>
</article>
<article>
<h2><a href="https://www.frontendcheatsheets.com/bootstrap" target="_blank">SheCodes | Bootstrap Cheat Sheet </a></h2>
<p>Interactive Bootstrap 5 cheatsheet for beginners and professionals. Snippet Categories: Grid, Buttons, Forms, Flexbox, Navigation, Cards, Spacing, & more...</p>
</article>
<article>
<h2><a href="https://bootsnipp.com/cssref" target="_blank">Bootsnipp | CSS Reference and HTML/CSS/JS playground</a></h2>
<p>Search for snippets, CSS Frameworks: Bootstrap, Foundation, Semantic UI, Materialize, Pure, Bulma, </p>
</article>
<article>
<h2><a href="https://bootstrapstudio.io/" target="_blank">Bootstrap Studio</a></h2>
<p>A powerful desktop app for creating responsive websites using the Bootstrap framework.</p>
</article>
<article>
<h2><a href="https://icons.getbootstrap.com/" target="_blank">Bootstrap Icons </a></h2>
<p>Free, high quality, open source icon library with over 1,600 icons. Include them anyway you like—SVGs, SVG sprite, or web fonts. Use them with or without Bootstrap in any project.</p>
</article>
<article>
<h2><a href="https://www.geeksforgeeks.org/how-to-use-bootstrap-with-react/" target="_blank">How to use Bootstrap with React?</a></h2>
<p>This blog discussed how to use React and Bootstrap, how to add bootstrap to React app. How to install the React bootstrap package and how to use it in React application.</p>
</article>
</ul>
</main>
<footer>
<p>2022©DevDum! Less searching. More learning. <a rel="nofollow" href="https://github.com/rdevans87/DevDum" target="_blank" rel="nofollow">Hosted on GitHub!</a></p>
<a href="https://www.buymeacoffee.com/ryanevans" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 42px !important;width: 180px !important;"></a>
<a href="https://www.producthunt.com/posts/devdum-code-smarter-not-harder?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-devdum-code-smarter-not-harder" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=343032&theme=light"
alt="DevDum! Code Smarter. Not Harder. - 200+ Resources for web developers. It's a no brainer! | Product Hunt" style="width: 200px; height: 43px;" width="250" height="54" /></a>
</footer>
</section>
</div>
</div>
<script>
function myFunction() {
var input, filter, ul, li, a, i, txtValue;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
ul = document.getElementById("myUL");
article = ul.getElementsByTagName("article");
for (i = 0; i < article.length; i++) {
a = article[i].getElementsByTagName("a")[0];
txtValue = a.textContent || a.innerText;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
article[i].style.display = "";
} else {
article[i].style.display = "none";
}
}
}
</script>
</body>
</html>