Skip to content
This repository was archived by the owner on Sep 7, 2021. It is now read-only.

Commit 1b1ff62

Browse files
booleanhunterbooleanhunter
committed
Adding components for callouts and alerts
1 parent c7e4293 commit 1b1ff62

9 files changed

Lines changed: 125 additions & 17 deletions

File tree

‎reactjs-adminlte/public/dist/js/generalUIElements.bundle.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎reactjs-adminlte/public/dist/js/timeline.bundle.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎reactjs-adminlte/public/dist/js/vendors.js‎

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

‎reactjs-adminlte/public/dist/js/widgets.bundle.js‎

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

‎reactjs-adminlte/public/src/ui-elements/general/js/components/page-ui-elements/alert.js‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
define(
2+
[
3+
'react',
4+
],
5+
function (React) {
6+
var Alert = React.createClass({
7+
render: function(){
8+
return (
9+
<div className={"alert "+this.props.theme+" alert-dismissible"}>
10+
<button type="button" className="close" data-dismiss="alert" aria-hidden="true">×</button>
11+
<h4>
12+
<i className={"icon fa "+this.props.icon}></i>
13+
{this.props.title}
14+
</h4>
15+
{this.props.content}
16+
{this.props.children}
17+
</div>
18+
)
19+
}
20+
});
21+
22+
return Alert;
23+
}
24+
)

‎reactjs-adminlte/public/src/ui-elements/general/js/components/page-ui-elements/callout.js‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
define(
2+
[
3+
'react',
4+
],
5+
function (React) {
6+
var Callout = React.createClass({
7+
render: function(){
8+
return (
9+
<div className={"callout "+this.props.theme} >
10+
<h4>{this.props.title}</h4>
11+
12+
{this.props.content}
13+
{this.props.children}
14+
</div>
15+
)
16+
}
17+
});
18+
19+
return Callout;
20+
}
21+
)

‎reactjs-adminlte/public/src/ui-elements/general/js/components/page-ui-elements/custom-box/box.js‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@ define(
1212
loading: false,
1313
border: true,
1414
title: 'Default title',
15-
content: 'Default content',
15+
content: '',
16+
customClass: ''
1617
}
1718
},
1819
render: function() {
@@ -49,7 +50,7 @@ define(
4950

5051
return (
5152
<div className={"col-md-"+this.props.width+" col-sm-6 col-xs-12"}>
52-
<div className={"box "+this.props.theme+" "+borderClass+ " color-palette-box "+boxType}>
53+
<div className={"box "+this.props.theme+" "+borderClass+ " "+this.props.customClass+" "+boxType}>
5354
<div className="box-header with-border">
5455
<h3 className="box-title">{this.props.headerMarkup} {this.props.title}</h3>
5556
{boxToolsContainer}

‎reactjs-adminlte/public/src/ui-elements/general/js/components/ui-elements.js‎

Lines changed: 64 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,11 @@ define(
55
'./header-bar/header-bar',
66
'./navigation-menu',
77
'./page-ui-elements/color-palette-set',
8-
'./page-ui-elements/custom-box/box'
8+
'./page-ui-elements/custom-box/box',
9+
'./page-ui-elements/alert',
10+
'./page-ui-elements/callout'
911
],
10-
function (React, $, HeaderBar, NavigationMenu, ColorPaletteSet, Box) {
12+
function (React, $, HeaderBar, NavigationMenu, ColorPaletteSet, Box, Alert, Callout) {
1113
var UIElements = React.createClass({
1214
getInitialState: function() {
1315
return {
@@ -44,6 +46,7 @@ define(
4446
width = "12"
4547
theme = "box-default"
4648
title = "Color Palette"
49+
customClass = "color-palette-box"
4750
headerMarkup={<i className="fa fa-tag"></i>} >
4851
<div className="row">
4952
<ColorPaletteSet width= "2" title="Primary" theme="bg-light-blue" />
@@ -62,6 +65,65 @@ define(
6265
<ColorPaletteSet width= "2" title="Black" theme="bg-black" />
6366
</div>
6467
</Box>
68+
69+
<h2 className="page-header">Alerts and Callouts</h2>
70+
71+
<div className="row">
72+
<Box
73+
border = {false}
74+
width = "6"
75+
theme = "box-default"
76+
title = "Alerts"
77+
headerMarkup={<i className="fa fa-warning"></i>} >
78+
<Alert
79+
title="Alert!"
80+
theme="alert-danger"
81+
icon="fa-ban"
82+
content="Danger alert preview. This alert is dismissable. A wonderful serenity has taken possession of my entire soul,
83+
like these sweet mornings of spring which I enjoy with my whole heart." />
84+
<Alert
85+
title="Alert!"
86+
theme="alert-info"
87+
icon="fa-info"
88+
content="Info alert preview. This alert is dismissable."/>
89+
<Alert
90+
title="Alert!"
91+
theme="alert-warning"
92+
icon="fa-warning"
93+
content="Warning alert preview. This alert is dismissable." />
94+
<Alert
95+
title="Alert!"
96+
theme="alert-success"
97+
icon="fa-check"
98+
content="Success alert preview. This alert is dismissable." />
99+
100+
</Box>
101+
102+
<Box
103+
border = {false}
104+
width = "6"
105+
theme = "box-default"
106+
title = "Callouts"
107+
headerMarkup={<i className="fa fa-bullhorn"></i>} >
108+
<Callout
109+
title="I am a danger callout!"
110+
theme="callout-danger"
111+
content = "There is a problem that we need to fix. A wonderful serenity has taken possession of my entire soul,
112+
like these sweet mornings of spring which I enjoy with my whole heart." />
113+
<Callout
114+
title="I am an info callout!"
115+
theme="callout-info"
116+
content = "Follow the steps to continue to payment." />
117+
<Callout
118+
title="I am a warning callout!"
119+
theme="callout-warning"
120+
content = "This is a yellow callout" />
121+
<Callout
122+
title="I am a success callout!"
123+
theme="callout-success"
124+
content = "This is a green callout" />
125+
</Box>
126+
</div>
65127
</section>
66128

67129
</div>

‎reactjs-adminlte/public/src/widgets-page/js/components/widgets/custom-box/box.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ define(
1212
loading: false,
1313
border: true,
1414
title: 'Default title',
15-
content: 'Default content',
15+
content: '',
1616
}
1717
},
1818
render: function() {

0 commit comments

Comments
 (0)