Skip to content

Commit df73dcb

Browse files
mmdsharifimmdsharifi
committed
feat(index.html): update html file to last version of bootstrap
add some bootstrap class for providing demo BREAKING CHANGE: Breaking chnages: last bootstrap css class may be not valid #3
1 parent ba9cd55 commit df73dcb

File tree

3 files changed

+114
-66
lines changed

3 files changed

+114
-66
lines changed

‎index.html‎

Lines changed: 110 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -42,85 +42,135 @@
4242
-->
4343
<div class="jumbotron">
4444
<div class="container" dir="ltr">
45-
<h1>Bootstrap 4 RTL <span class="badge badge-default">alpha.6</span></h1>
46-
<p>bootstrap version RTL version.
47-
<a target="_blank" href="http://v4-alpha.getbootstrap.com/">read new documents!</a>
48-
<br>Install via Bower:
49-
<br>
50-
<code>bower install Bootstrap4-rtl</code>
51-
</p>
52-
<p>
53-
<a class="btn btn-primary btn-lg" target="_blank" href="https://github.com/mmdsharifi/Bootstrap4-RTL" role="button">Star project »</a>
54-
</p>
55-
<hr>
56-
<p>
57-
<div class="progress">
58-
<div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="75" aria-valuemin="0"
59-
aria-valuemax="100" style="width: 75%"></div>
45+
<div class="bd-example">
46+
<div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
47+
<ol class="carousel-indicators">
48+
<li data-target="#carouselExampleCaptions" data-slide-to="0" class=""></li>
49+
<li data-target="#carouselExampleCaptions" data-slide-to="1" class=""></li>
50+
<li data-target="#carouselExampleCaptions" data-slide-to="2" class="active"></li>
51+
</ol>
52+
<div class="carousel-inner">
53+
<div class="carousel-item">
54+
<img class="d-block w-100" data-src="holder.js/800x400?auto=yes&amp;bg=777&amp;fg=555&amp;text=First slide" alt="First slide [800x400]"
55+
src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15df13a3425%20text%20%7B%20fill%3A%23555%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15df13a3425%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22285.9296875%22%20y%3D%22217.7%22%3EFirst%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"
56+
data-holder-rendered="true">
57+
<div class="carousel-caption d-none d-md-block">
58+
<h3>Bootstrap 4 RTL</h3>
59+
<p>
60+
<a class="btn btn-success btn-lg" target="_blank" href="https://github.com/mmdsharifi/Bootstrap4-RTL" role="button"><i class="fa fa-star"></i> Star project »</a>
61+
</p>
62+
<p>
63+
read new<a target="_blank" href="https://getbootstrap.com/docs/4.0/"> documents!</a>
64+
</p>
65+
</div>
66+
</div>
67+
<div class="carousel-item">
68+
<img class="d-block w-100" data-src="holder.js/800x400?auto=yes&amp;bg=666&amp;fg=444&amp;text=Second slide" alt="Second slide [800x400]"
69+
src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15df13a3427%20text%20%7B%20fill%3A%23444%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15df13a3427%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23666%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22247.3203125%22%20y%3D%22217.7%22%3ESecond%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"
70+
data-holder-rendered="true">
71+
<div class="carousel-caption d-none d-md-block">
72+
<h3>Install Bootstrap</h3>
73+
<p><code>npm install bootstrap4-rtl --save</code></p>
74+
</div>
75+
</div>
76+
<div class="carousel-item active">
77+
<img class="d-block w-100" data-src="holder.js/800x400?auto=yes&amp;bg=555&amp;fg=333&amp;text=Third slide" alt="Third slide [800x400]"
78+
src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15df13a3428%20text%20%7B%20fill%3A%23333%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15df13a3428%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23555%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22277.0078125%22%20y%3D%22217.7%22%3EThird%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"
79+
data-holder-rendered="true">
80+
<div class="carousel-caption d-none d-md-block">
81+
<h3>Third slide label</h3>
82+
<p>The most beautiful bootstrap ever you seen <span class="badge badge-primary badge-pill">BETA</span></p>
83+
</div>
84+
</div>
85+
</div>
86+
<a class="carousel-control-prev" href="#carouselExampleCaptions" role="button" data-slide="prev">
87+
<span class="carousel-control-next-icon" aria-hidden="true"></span>
88+
<span class="sr-only">Previous</span>
89+
</a>
90+
<a class="carousel-control-next" href="#carouselExampleCaptions" role="button" data-slide="next">
91+
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
92+
<span class="sr-only">Next</span>
93+
</a>
6094
</div>
61-
</p>
95+
</div>
96+
</div>
97+
</div>
98+
<div class="dropdown">
99+
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true"
100+
aria-expanded="false">
101+
Dropdown button
102+
</button>
103+
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
104+
<a class="dropdown-item" href="#">Action</a>
105+
<a class="dropdown-item" href="#">Another action</a>
106+
<a class="dropdown-item" href="#">Something else here</a>
62107
</div>
63108
</div>
64109
<div class="container">
65-
<!-- Example row of columns -->
66-
<p class="lead">
67-
<a target="_blank" href="https://ganjoor.net/saadi/divan/ghazals/sh2/">سعدی » دیوان اشعار » غزلیات</a>
68-
</p>
69-
<hr>
70-
<div class="container">
71-
<div class="row justify-content-start">
72-
<div class="col-4">
73-
ای نفس خرم باد صبا
74-
</div>
75-
<div class="col-4">
76-
از بر یار آمده‌ای مرحبا
110+
<div class="card">
111+
<!-- Example row of columns -->
112+
<p class="lead card-header">
113+
<a target="_blank" href="https://ganjoor.net/saadi/divan/ghazals/sh2/">سعدی » دیوان اشعار » غزلیات</a>
114+
</p>
115+
<hr>
116+
<div class="card-body">
117+
<div class="row justify-content-start">
118+
<div class="col-4">
119+
ای نفس خرم باد صبا
120+
</div>
121+
<div class="col-4">
122+
از بر یار آمده‌ای مرحبا
123+
</div>
77124
</div>
78-
</div>
79-
<div class="row justify-content-center">
80-
<div class="col-4">
81-
گو رمقی بیش نماند از ضعیف
125+
<div class="row justify-content-center">
126+
<div class="col-4">
127+
گو رمقی بیش نماند از ضعیف
82128

129+
</div>
130+
<div class="col-4">
131+
چند کند صورت بی‌جان بقا
132+
</div>
83133
</div>
84-
<div class="col-4">
85-
چند کند صورت بی‌جان بقا
86-
</div>
87-
</div>
88-
<div class="row justify-content-end">
89-
<div class="col-4">
90-
قافله شب چه شنیدی ز صبح
91-
</div>
92-
<div class="col-4">
93-
مرغ سلیمان چه خبر از سبا
94-
</div>
95-
</div>
96-
<div class="row justify-content-around">
97-
<div class="col-4">
98-
بر سر خشمست هنوز آن حریف
134+
<div class="row justify-content-end">
135+
<div class="col-4">
136+
قافله شب چه شنیدی ز صبح
137+
</div>
138+
<div class="col-4">
139+
مرغ سلیمان چه خبر از سبا
140+
</div>
99141
</div>
100-
<div class="col-4">
101-
یا سخنی می‌رود اندر رضا
142+
<div class="row justify-content-around">
143+
<div class="col-4">
144+
بر سر خشمست هنوز آن حریف
145+
</div>
146+
<div class="col-4">
147+
یا سخنی می‌رود اندر رضا
148+
</div>
102149
</div>
103-
</div>
104-
<div class="row justify-content-between">
105-
<div class="col-4">
106-
از در صلح آمده‌ای یا خلاف
107-
</div>
108-
<div class="col-4">
109-
با قدم خوف روم یا رجا
150+
<div class="row justify-content-between">
151+
<div class="col-4">
152+
از در صلح آمده‌ای یا خلاف
153+
</div>
154+
<div class="col-4">
155+
با قدم خوف روم یا رجا
110156

157+
</div>
111158
</div>
112159
</div>
160+
<hr>
161+
<footer class="card-footer">
162+
<p>© <a target="_blank" href="http://lenus.org">Mohammad Sharifi</a> 2017</p>
163+
</footer>
113164
</div>
114-
<hr>
115-
<footer>
116-
<p>© <a target="_blank" href="http://lenus.org">Mohammad Sharifi</a> 2017</p>
117-
</footer>
118165
</div>
166+
119167
<!-- /container -->
120168
<!-- Bootstrap core JavaScript==================================================-
121169
->
122170
<!-- Placed at the end of the document so the pages load faster -->
171+
123172
<script src="public/js/jquery.min.js"></script>
173+
<script src="public/js/popper.js"></script>
124174
<script src="public/js/bootstrap.min.js"></script>
125175

126176

‎public/css/style-rtl.alpha6.min.css‎

Lines changed: 2 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)