Skip to content

Commit d532b13

Browse files
andreivictorandreivictor
authored
Merge pull request #2 from andreivictor/bootstrap-v4.0.0-beta
Added support for Bootstrap v4.0.0-beta
2 parents bf94a1d + f909154 commit d532b13

14 files changed

+452
-73
lines changed

‎bootstrap3/bootstrap-tooltip-custom-class.css‎ renamed to ‎bootstrap-v3.3.7/bootstrap-tooltip-custom-class.css‎

File renamed without changes.

‎bootstrap-v3.3.7/bootstrap-tooltip-custom-class.js‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
/* ================================================
2+
* bootstrap-tooltip-custom-class.js v0.0.1
3+
*
4+
* Extend Bootstrap 3 Tooltip plugin by adding custom classes.
5+
* Custom classes can be added by using `customClass` parameter or via `data-custom-class` attribute.
6+
* There are 5 predefined custom classes in CSS: .tooltip-primary, .tooltip-success, .tooltip-info, .tooltip-warning, .tooltip-danger.
7+
* ============================================= */
8+
9+
(function ($) {
10+
11+
if (typeof $.fn.tooltip.Constructor === 'undefined') {
12+
throw new Error('Bootstrap Tooltip must be included first!');
13+
}
14+
15+
var Tooltip = $.fn.tooltip.Constructor;
16+
17+
$.extend( Tooltip.DEFAULTS, {
18+
customClass: ''
19+
});
20+
21+
var _show = Tooltip.prototype.show;
22+
23+
Tooltip.prototype.show = function () {
24+
25+
_show.apply(this,Array.prototype.slice.apply(arguments));
26+
27+
if ( this.options.customClass ) {
28+
var $tip = this.tip();
29+
$tip.addClass(this.options.customClass);
30+
}
31+
32+
};
33+
34+
})(window.jQuery);

‎bootstrap3/bootstrap-tooltip-custom-class.scss‎ renamed to ‎bootstrap-v3.3.7/bootstrap-tooltip-custom-class.scss‎

File renamed without changes.

‎bootstrap3/example.html‎ renamed to ‎bootstrap-v3.3.7/example.html‎

File renamed without changes.

‎bootstrap4/bootstrap-tooltip-custom-class.css‎ renamed to ‎bootstrap-v4.0.0-alpha.6/bootstrap-tooltip-custom-class.css‎

File renamed without changes.

‎bootstrap-v4.0.0-alpha.6/bootstrap-tooltip-custom-class.js‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
/* ================================================
2+
* bootstrap4-tooltip-custom-class.js v0.0.1
3+
*
4+
* Extend Bootstrap v4.0.0-alpha.6 Tooltip plugin by adding custom classes.
5+
* Custom classes can be added by using `customClass` paramater or via `data-custom-class` attribute.
6+
* There are 5 predefined custom classes in CSS: .tooltip-primary, .tooltip-success, .tooltip-info, .tooltip-warning, .tooltip-danger.
7+
* ============================================= */
8+
9+
;(function($) {
10+
11+
if (typeof $.fn.tooltip.Constructor === 'undefined') {
12+
throw new Error('Bootstrap Tooltip must be included first!');
13+
}
14+
15+
var Tooltip = $.fn.tooltip.Constructor;
16+
17+
// add customClass option to Bootstrap Tooltip
18+
$.extend( Tooltip.Default, {
19+
customClass: ''
20+
});
21+
22+
var _show = Tooltip.prototype.show;
23+
24+
Tooltip.prototype.show = function () {
25+
26+
// invoke parent method
27+
_show.apply(this,Array.prototype.slice.apply(arguments));
28+
29+
if (this.config.customClass) {
30+
var tip = this.getTipElement();
31+
$(tip).addClass(this.config.customClass);
32+
}
33+
34+
};
35+
36+
})(window.jQuery);

‎bootstrap4/bootstrap-tooltip-custom-class.scss‎ renamed to ‎bootstrap-v4.0.0-alpha.6/bootstrap-tooltip-custom-class.scss‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,4 +97,3 @@ $tooltip-danger-bg: $brand-danger !default;
9797
.tooltip-danger {
9898
@include tooltip-custom($tooltip-danger-bg);
9999
}
100-

‎bootstrap4/example.html‎ renamed to ‎bootstrap-v4.0.0-alpha.6/example.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<html >
33
<head>
44
<meta charset="UTF-8">
5-
<title>Bootstrap 4 Tooltip Custom Classes</title>
5+
<title>Bootstrap v4.0.0-alpha.6 Tooltip Custom Classes</title>
66
<meta name="viewport" content="width=device-width, initial-scale=1">
77

88
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
@@ -133,7 +133,7 @@ <h3 class="bs-example__title">Dinamic examples</h3>
133133

134134
<button class="btn btn-custom" data-toggle="tooltip" data-placement="bottom" title="Custom tooltip example">Custom tooltip</button>
135135

136-
<button class="btn btn-custom-alt" data-toggle="tooltip" data-placement="bottom" title="Another custom tooltip example">Another custom tooltip</button>
136+
<button class="btn btn-custom-alt" data-toggle="tooltip" data-placement="bottom" title="Another custom tooltip">Another custom tooltip</button>
137137

138138
</div>
139139

‎bootstrap-v4.0.0-beta/bootstrap-tooltip-custom-class.css‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
.tooltip-primary .tooltip-inner {
2+
background-color: #007bff;
3+
}
4+
.tooltip-primary.bs-tooltip-top .arrow:before {
5+
border-top-color: #007bff;
6+
}
7+
.tooltip-primary.bs-tooltip-right .arrow:before {
8+
border-right-color: #007bff;
9+
}
10+
.tooltip-primary.bs-tooltip-left .arrow:before {
11+
border-left-color: #007bff;
12+
}
13+
.tooltip-primary.bs-tooltip-bottom .arrow:before {
14+
border-bottom-color: #007bff;
15+
}
16+
17+
.tooltip-success .tooltip-inner {
18+
background-color: #28a745;
19+
}
20+
.tooltip-success.bs-tooltip-top .arrow:before {
21+
border-top-color: #28a745;
22+
}
23+
.tooltip-success.bs-tooltip-right .arrow:before {
24+
border-right-color: #28a745;
25+
}
26+
.tooltip-success.bs-tooltip-left .arrow:before {
27+
border-left-color: #28a745;
28+
}
29+
.tooltip-success.bs-tooltip-bottom .arrow:before {
30+
border-bottom-color: #28a745;
31+
}
32+
33+
.tooltip-info .tooltip-inner {
34+
background-color: #17a2b8;
35+
}
36+
.tooltip-info.bs-tooltip-top .arrow:before {
37+
border-top-color: #17a2b8;
38+
}
39+
.tooltip-info.bs-tooltip-right .arrow:before {
40+
border-right-color: #17a2b8;
41+
}
42+
.tooltip-info.bs-tooltip-left .arrow:before {
43+
border-left-color: #17a2b8;
44+
}
45+
.tooltip-info.bs-tooltip-bottom .arrow:before {
46+
border-bottom-color: #17a2b8;
47+
}
48+
49+
.tooltip-warning .tooltip-inner {
50+
background-color: #ffc107;
51+
}
52+
.tooltip-warning.bs-tooltip-top .arrow:before {
53+
border-top-color: #ffc107;
54+
}
55+
.tooltip-warning.bs-tooltip-right .arrow:before {
56+
border-right-color: #ffc107;
57+
}
58+
.tooltip-warning.bs-tooltip-left .arrow:before {
59+
border-left-color: #ffc107;
60+
}
61+
.tooltip-warning.bs-tooltip-bottom .arrow:before {
62+
border-bottom-color: #ffc107;
63+
}
64+
65+
.tooltip-danger .tooltip-inner {
66+
background-color: #dc3545;
67+
}
68+
.tooltip-danger.bs-tooltip-top .arrow:before {
69+
border-top-color: #dc3545;
70+
}
71+
.tooltip-danger.bs-tooltip-right .arrow:before {
72+
border-right-color: #dc3545;
73+
}
74+
.tooltip-danger.bs-tooltip-left .arrow:before {
75+
border-left-color: #dc3545;
76+
}
77+
.tooltip-danger.bs-tooltip-bottom .arrow:before {
78+
border-bottom-color: #dc3545;
79+
}

‎bootstrap-v4.0.0-beta/bootstrap-tooltip-custom-class.js‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
/* ================================================
2+
* bootstrap4-tooltip-custom-class.js v0.0.1
3+
*
4+
* Extend Bootstrap v4.0.0-beta Tooltip plugin by adding custom classes.
5+
* Custom classes can be added by using `customClass` paramater or via `data-custom-class` attribute.
6+
* There are 5 predefined custom classes in CSS: .tooltip-primary, .tooltip-success, .tooltip-info, .tooltip-warning, .tooltip-danger.
7+
* ============================================= */
8+
9+
;(function($) {
10+
11+
if (typeof $.fn.tooltip.Constructor === 'undefined') {
12+
throw new Error('Bootstrap Tooltip must be included first!');
13+
}
14+
15+
var Tooltip = $.fn.tooltip.Constructor;
16+
17+
// add customClass option to Bootstrap Tooltip
18+
$.extend( Tooltip.Default, {
19+
customClass: ''
20+
});
21+
22+
var _show = Tooltip.prototype.show;
23+
24+
Tooltip.prototype.show = function () {
25+
26+
// invoke parent method
27+
_show.apply(this,Array.prototype.slice.apply(arguments));
28+
29+
if ( this.config.customClass ) {
30+
var tip = this.getTipElement();
31+
$(tip).addClass(this.config.customClass);
32+
}
33+
34+
};
35+
36+
})(window.jQuery);

0 commit comments

Comments
 (0)