Skip to content

Commit 535ba97

Browse files
marqbeniaminmarqbeniamin
committed
Bootstrap 4 update
- Core base code on Bootstrap 4 - Documentation code base written from scratch - Speed optimizations - Class changes : .card-block to .card-body - .navbar-toggleable-* to .navbar-expand-* - .hidden-*-down to .d-none .d-*-block - .hidden-*-up to .d-*-none - .checkbox to .form-check - .radio to .form-check - more class changes here:https://medium.com/@lukaszholeczek/how-to-upgrade-bootstrap-4-alpha-6-to-bootstrap-4-beta-d43b4210f2a3 - Bug fixes for responsive devices - Small changes for components
1 parent 91b0e07 commit 535ba97

File tree

286 files changed

+64772
-14413
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

286 files changed

+64772
-14413
lines changed

‎CHANGELOG.md

Lines changed: 29 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,22 @@
1-
v1.0.0 21 Sept, 2016 - Initial Release
1+
# Change Log
22

3-
v1.1.0 10 Nov, 2016 - New Page Added
4-
- fix link in documentation
5-
- for those who want to upsell inside their dashboard we added a new page "Upgrade to PRO" with a pricing and options table
3+
## [2.0.0] 2018-03-27
4+
### Bootstrap 4 update
5+
- Core base code on Bootstrap 4
6+
- Documentation code base written from scratch
7+
- Speed optimizations
8+
- Class changes : .card-block to .card-body
9+
- .navbar-toggleable-* to .navbar-expand-*
10+
- .hidden-*-down to .d-none .d-*-block
11+
- .hidden-*-up to .d-*-none
12+
- .checkbox to .form-check
13+
- .radio to .form-check
14+
- more class changes here:https://medium.com/@lukaszholeczek/how-to-upgrade-bootstrap-4-alpha-6-to-bootstrap-4-beta-d43b4210f2a3
15+
- Bug fixes for responsive devices
16+
- Small changes for components
617

7-
v1.1.1 8 Feb 2017
8-
- switched to MIT License
9-
10-
v1.2.0 8 Sep 2017
18+
## [1.2.0] 2017-09-08
19+
### BugFixing
1120
- added PerfectScrollbar for windows better scroll
1221
- added arrive.js library for dynamic content
1322
- fix issue with charts when resizing window
@@ -17,3 +26,15 @@ v1.2.0 8 Sep 2017
1726
- added fixed navbar
1827
- documentation updates
1928
- minor design fixes
29+
30+
## [1.1.1] 2017-02-08
31+
### MIT License
32+
- switched to MIT License
33+
34+
## [1.1.0] 2016-11-10
35+
### New Page Added, Small Fixes
36+
- fix link in documentation
37+
- for those who want to upsell inside their dashboard we added a new page "Upgrade to PRO" with a pricing and options table
38+
39+
## [1.0.0] 2016-09-21
40+
### Initial Release

‎README.md

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
11
# [Material Dashboard](http://demos.creative-tim.com/material-dashboard/examples/dashboard.html) [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter)](https://twitter.com/intent/tweet?text=Material%20Dashboard%20by%20Creative%20Tim&url=https%3A%2F%2Fdemos.creative-tim.com%2Fmaterial-dashboard%2Fexamples%2Fdashboard.html&via=CreativeTim)
2-
<center>
3-
4-
![Product Gif](assets/github/product.gif)
52

6-
</center>
3+
<center>![Product Gif](assets/github/product.gif)</center>
74

85
Material Dashboard is a free Material Bootstrap Admin with a fresh, new design inspired by Google's Material Design. We are very excited to introduce our take on the material concepts through an easy to use and beautiful set of components. Material Dashboard was built over the popular Bootstrap framework and it comes with a couple of third-party plugins redesigned to fit in with the rest of the elements.
96

‎assets/assets-for-demo/demo.css

Lines changed: 302 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,302 @@
1+
2+
/* PRESENTION PAGE */
3+
4+
/* Section Components */
5+
6+
.presentation-page{
7+
overflow-x: hidden;
8+
}
9+
10+
.section-components .title{
11+
margin-top: 60px;
12+
margin-bottom: 5px;
13+
}
14+
.section-components .description{
15+
margin-top: 35px;
16+
}
17+
18+
.section-components .image-container{
19+
height: 560px;
20+
position: relative;
21+
}
22+
23+
.section-components .components-macbook{
24+
width: auto;
25+
left: -100px;
26+
top: 0;
27+
height: 100%;
28+
position: absolute;
29+
}
30+
31+
.section-components .table-img,
32+
.section-components .share-btn-img,
33+
.section-components .coloured-card-btn-img,
34+
.section-components .coloured-card-img,
35+
.section-components .social-img,
36+
.section-components .pin-btn-img{
37+
position: absolute;
38+
box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
39+
}
40+
.section-components .coloured-card-img{
41+
left: 90%;
42+
top: 11%;
43+
height: 90px;
44+
border-radius: 2px;
45+
}
46+
.section-components .social-img{
47+
left: 70%;
48+
top: 67%;
49+
height: 40px;
50+
51+
}
52+
.section-components .coloured-card-btn-img{
53+
left: 35%;
54+
top: 2%;
55+
height: 125px;
56+
border-radius: 6px;
57+
}
58+
.section-components .table-img{
59+
left: -13%;
60+
top: 27%;
61+
height: 175px;
62+
border-radius: 2px;
63+
}
64+
.section-components .pin-btn-img{
65+
left: 0%;
66+
top: 68%;
67+
height: 25px;
68+
border-radius: 3px;
69+
}
70+
.section-components .share-btn-img{
71+
left: 3%;
72+
top: -3%;
73+
height: 25px;
74+
75+
}
76+
77+
/* Section Content */
78+
79+
.section-content .section-description{
80+
margin-top: 100px;
81+
}
82+
.section-content .title{
83+
margin-bottom: 5px;
84+
}
85+
86+
.section-content .section-description .title + .description{
87+
margin-top: 0;
88+
}
89+
.section-content .description{
90+
margin-top: 35px;
91+
}
92+
93+
.section-content .image-container{
94+
max-width: 900px;
95+
position: relative;
96+
}
97+
.section-content .image-container .ipad-img{
98+
width: 100%;
99+
transition: transform .6s .9s;
100+
z-index: 2;
101+
}
102+
.section-content .image-container .area-img,
103+
.section-content .image-container .info-img{
104+
position: absolute;
105+
box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
106+
opacity: 0;
107+
transform: translate3D(0px, 100px, 0px);
108+
-webkit-transform: translate3D(0px, 100px, 0px);
109+
}
110+
.section-content .image-container .area-img{
111+
top: 10%;
112+
left: 60%;
113+
height: 300px;
114+
width: 250px;
115+
z-index: 2;
116+
-webkit-transition: all 1s ease-out 0s;
117+
-moz-transition: all 1s ease-out 0s;
118+
-o-transition: all 1s ease-out 0s;
119+
-ms-transition: all 1s ease-out 0s;
120+
transition: all 1s ease-out 0s;
121+
}
122+
.section-content .image-container .info-img{
123+
top: 50%;
124+
left: 0%;
125+
height: 200px;
126+
width: 300px;
127+
-webkit-transition: all 1s ease-out 0s;
128+
-moz-transition: all 1s ease-out 0s;
129+
-o-transition: all 1s ease-out 0s;
130+
-ms-transition: all 1s ease-out 0s;
131+
transition: all 1s ease-out 0s;
132+
}
133+
.animated{
134+
transform: translate3D(0px, 0px, 0px) !important;
135+
-webkit-transform: translate3D(0px, 0px, 0px) !important;
136+
opacity: 1 !important;
137+
}
138+
139+
140+
/* animated images */
141+
142+
@-webkit-keyframes Floatingy{
143+
from {-webkit-transform:translate(0, 0px);}
144+
65% {-webkit-transform:translate(50px, 0);}
145+
to {-webkit-transform: translate(0, -0px);}
146+
}
147+
@-moz-keyframes Floatingy{
148+
from {-moz-transform:translate(0, 0px);}
149+
65% {-moz-transform:translate(50px, 0);}
150+
to {-moz-transform: translate(0, -0px);}
151+
}
152+
@-webkit-keyframes Floatingx{
153+
from {-webkit-transform:translate(50px, 0px);}
154+
65% {-webkit-transform:translate(0, 0);}
155+
to {-webkit-transform: translate(50px, -0px);}
156+
}
157+
@-moz-keyframes Floatingx{
158+
from {-moz-transform:translate(50px, 0px);}
159+
65% {-moz-transform:translate(0, 0);}
160+
to {-moz-transform: translate(50px, -0px);}
161+
}
162+
163+
164+
.table-img, .coloured-card-img, .coloured-card-btn-img, .pin-btn-img, .share-btn-img, .social-img{
165+
-webkit-animation-iteration-count: infinite;
166+
-webkit-animation-timing-function: ease-in-out;
167+
-moz-animation-iteration-count: infinite;
168+
-moz-animation-timing-function: ease-in-out;
169+
-webkit-animation-name: Floatingy;
170+
-moz-animation-name: Floatingy;
171+
float: left;
172+
}
173+
.table-img{
174+
-webkit-animation-duration: 14s;
175+
-moz-animation-duration: 14s;
176+
-webkit-animation-name: Floatingx;
177+
-moz-animation-name: Floatingx;
178+
}
179+
180+
.coloured-card-img{
181+
-webkit-animation-duration: 10s;
182+
-moz-animation-duration: 10s;
183+
-webkit-animation-name: Floatingx;
184+
-moz-animation-name: Floatingx;
185+
}
186+
187+
.coloured-card-btn-img{
188+
-webkit-animation-duration: 18s;
189+
-moz-animation-duration: 18s;
190+
}
191+
.pin-btn-img{
192+
-webkit-animation-duration: 15s;
193+
-moz-animation-duration: 15s;
194+
}
195+
.share-btn-img{
196+
-webkit-animation-duration: 11s;
197+
-moz-animation-duration: 11s;
198+
}
199+
.social-img{
200+
-webkit-animation-duration: 16s;
201+
-moz-animation-duration: 16s;
202+
-webkit-animation-name: Floatingx;
203+
-moz-animation-name: Floatingx;
204+
}
205+
206+
/* Presentation Page OnScroll Animation */
207+
208+
.animated {
209+
animation-duration: 1s;
210+
animation-fill-mode: both;
211+
}
212+
213+
.animated.infinite {
214+
animation-iteration-count: infinite;
215+
}
216+
217+
.animated.hinge {
218+
animation-duration: 2s;
219+
}
220+
221+
.animated.flipOutX,
222+
.animated.flipOutY,
223+
.animated.bounceIn,
224+
.animated.bounceOut {
225+
animation-duration: .75s;
226+
}
227+
228+
@keyframes bounce {
229+
from, 20%, 53%, 80%, to {
230+
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
231+
transform: translate3d(0, 0, 0);
232+
}
233+
40%, 43% {
234+
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
235+
transform: translate3d(0, -30px, 0);
236+
}
237+
70% {
238+
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
239+
transform: translate3d(0, -15px, 0);
240+
}
241+
90% {
242+
transform: translate3d(0, -4px, 0);
243+
}
244+
}
245+
.bounce {
246+
animation-name: bounce;
247+
transform-origin: center bottom;
248+
}
249+
250+
@keyframes flash {
251+
from, 50%, to {
252+
opacity: 1;
253+
}
254+
25%, 75% {
255+
opacity: 0;
256+
}
257+
}
258+
.flash {
259+
animation-name: flash;
260+
}
261+
262+
263+
.fixed-section{
264+
top: 90px;
265+
max-height: 71vh;
266+
overflow: scroll;
267+
border-bottom: 1px solid rgba(220,220,220, .8);
268+
}
269+
.fixed-section ul li{
270+
list-style: none;
271+
}
272+
.fixed-section li a{
273+
font-size: 14px;
274+
padding: 2px;
275+
display: block;
276+
color: #666666;
277+
}
278+
.fixed-section li a.active{
279+
color: #00bbff;
280+
}
281+
.fixed-section.float{
282+
position: fixed;
283+
top: 100px;
284+
width: 200px;
285+
margin-top: 0;
286+
}
287+
@media (max-width: 991px) {
288+
.fixed-section.affix {
289+
position: relative;
290+
margin-bottom: 100px;
291+
}
292+
}
293+
294+
#images h4{
295+
margin-bottom: 30px;
296+
}
297+
#javascriptComponents{
298+
padding-bottom: 0;
299+
}
300+
#javascriptComponents .btn-raised{
301+
margin: 10px 0px;
302+
}

0 commit comments

Comments
 (0)