jekyll-theme-digitalebrain 0.1.5 → 0.1.6

Sign up to get free protection for your applications and to get access to all the features.
Files changed (92) hide show
  1. checksums.yaml +4 -4
  2. data/_includes/_footer.html +68 -0
  3. data/_includes/_head.html +29 -0
  4. data/_includes/_navbar.html +20 -0
  5. data/_layouts/default.html +41 -0
  6. data/_layouts/page.html +39 -0
  7. data/_layouts/post.html +5 -0
  8. data/_sass/bootstrap/_alert.scss +51 -0
  9. data/_sass/bootstrap/_badge.scss +47 -0
  10. data/_sass/bootstrap/_breadcrumb.scss +41 -0
  11. data/_sass/bootstrap/_button-group.scss +172 -0
  12. data/_sass/bootstrap/_buttons.scss +144 -0
  13. data/_sass/bootstrap/_card.scss +301 -0
  14. data/_sass/bootstrap/_carousel.scss +235 -0
  15. data/_sass/bootstrap/_close.scss +34 -0
  16. data/_sass/bootstrap/_code.scss +56 -0
  17. data/_sass/bootstrap/_custom-forms.scss +420 -0
  18. data/_sass/bootstrap/_dropdown.scss +166 -0
  19. data/_sass/bootstrap/_forms.scss +335 -0
  20. data/_sass/bootstrap/_functions.scss +86 -0
  21. data/_sass/bootstrap/_grid.scss +52 -0
  22. data/_sass/bootstrap/_images.scss +42 -0
  23. data/_sass/bootstrap/_input-group.scss +159 -0
  24. data/_sass/bootstrap/_jumbotron.scss +16 -0
  25. data/_sass/bootstrap/_list-group.scss +115 -0
  26. data/_sass/bootstrap/_media.scss +8 -0
  27. data/_sass/bootstrap/_mixins.scss +41 -0
  28. data/_sass/bootstrap/_modal.scss +168 -0
  29. data/_sass/bootstrap/_nav.scss +118 -0
  30. data/_sass/bootstrap/_navbar.scss +299 -0
  31. data/_sass/bootstrap/_pagination.scss +78 -0
  32. data/_sass/bootstrap/_popover.scss +183 -0
  33. data/_sass/bootstrap/_print.scss +124 -0
  34. data/_sass/bootstrap/_progress.scss +34 -0
  35. data/_sass/bootstrap/_reboot.scss +482 -0
  36. data/_sass/bootstrap/_root.scss +19 -0
  37. data/_sass/bootstrap/_tables.scss +188 -0
  38. data/_sass/bootstrap/_tooltip.scss +115 -0
  39. data/_sass/bootstrap/_transitions.scss +22 -0
  40. data/_sass/bootstrap/_type.scss +125 -0
  41. data/_sass/bootstrap/_utilities.scss +15 -0
  42. data/_sass/bootstrap/_variables.scss +930 -0
  43. data/_sass/bootstrap/bootstrap-grid.scss +32 -0
  44. data/_sass/bootstrap/bootstrap-reboot.scss +12 -0
  45. data/_sass/bootstrap/bootstrap.scss +42 -0
  46. data/_sass/bootstrap/mixins/_alert.scss +13 -0
  47. data/_sass/bootstrap/mixins/_background-variant.scss +21 -0
  48. data/_sass/bootstrap/mixins/_badge.scss +12 -0
  49. data/_sass/bootstrap/mixins/_border-radius.scss +35 -0
  50. data/_sass/bootstrap/mixins/_box-shadow.scss +5 -0
  51. data/_sass/bootstrap/mixins/_breakpoints.scss +123 -0
  52. data/_sass/bootstrap/mixins/_buttons.scss +109 -0
  53. data/_sass/bootstrap/mixins/_caret.scss +66 -0
  54. data/_sass/bootstrap/mixins/_clearfix.scss +7 -0
  55. data/_sass/bootstrap/mixins/_float.scss +11 -0
  56. data/_sass/bootstrap/mixins/_forms.scss +137 -0
  57. data/_sass/bootstrap/mixins/_gradients.scss +45 -0
  58. data/_sass/bootstrap/mixins/_grid-framework.scss +67 -0
  59. data/_sass/bootstrap/mixins/_grid.scss +52 -0
  60. data/_sass/bootstrap/mixins/_hover.scss +37 -0
  61. data/_sass/bootstrap/mixins/_image.scss +36 -0
  62. data/_sass/bootstrap/mixins/_list-group.scss +21 -0
  63. data/_sass/bootstrap/mixins/_lists.scss +7 -0
  64. data/_sass/bootstrap/mixins/_nav-divider.scss +10 -0
  65. data/_sass/bootstrap/mixins/_pagination.scss +22 -0
  66. data/_sass/bootstrap/mixins/_reset-text.scss +17 -0
  67. data/_sass/bootstrap/mixins/_resize.scss +6 -0
  68. data/_sass/bootstrap/mixins/_screen-reader.scss +33 -0
  69. data/_sass/bootstrap/mixins/_size.scss +6 -0
  70. data/_sass/bootstrap/mixins/_table-row.scss +30 -0
  71. data/_sass/bootstrap/mixins/_text-emphasis.scss +14 -0
  72. data/_sass/bootstrap/mixins/_text-hide.scss +11 -0
  73. data/_sass/bootstrap/mixins/_text-truncate.scss +8 -0
  74. data/_sass/bootstrap/mixins/_transition.scss +13 -0
  75. data/_sass/bootstrap/mixins/_visibility.scss +7 -0
  76. data/_sass/bootstrap/utilities/_align.scss +8 -0
  77. data/_sass/bootstrap/utilities/_background.scss +19 -0
  78. data/_sass/bootstrap/utilities/_borders.scss +59 -0
  79. data/_sass/bootstrap/utilities/_clearfix.scss +3 -0
  80. data/_sass/bootstrap/utilities/_display.scss +38 -0
  81. data/_sass/bootstrap/utilities/_embed.scss +52 -0
  82. data/_sass/bootstrap/utilities/_flex.scss +51 -0
  83. data/_sass/bootstrap/utilities/_float.scss +9 -0
  84. data/_sass/bootstrap/utilities/_position.scss +37 -0
  85. data/_sass/bootstrap/utilities/_screenreaders.scss +11 -0
  86. data/_sass/bootstrap/utilities/_shadows.scss +6 -0
  87. data/_sass/bootstrap/utilities/_sizing.scss +12 -0
  88. data/_sass/bootstrap/utilities/_spacing.scss +51 -0
  89. data/_sass/bootstrap/utilities/_text.scss +58 -0
  90. data/_sass/bootstrap/utilities/_visibility.scss +11 -0
  91. data/_sass/style.scss +1569 -0
  92. metadata +91 -1
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 2a773b958a14edcad2726e4f5d5adac640869b7f
4
- data.tar.gz: 3adaf73cae854faf93aca1e88155a3d656d919f2
3
+ metadata.gz: 83c54a64b954cd5f00e779b9dc42022c5a68ee90
4
+ data.tar.gz: 215d6a80ef990144f0d9e490b96b8de09606a1f2
5
5
  SHA512:
6
- metadata.gz: 9f42cbbedaf4b40b29da5080406fb6cdc447b6aeb52c93fc773439c0c4a5ba01df9c6129ac36e81c67ec4aec46b8bdf658a4b2a3615c8f40c2b89cb18289d444
7
- data.tar.gz: 5faeaa936c09c37edcc94a5a464f0f8f0689171b4b882055b43b7984590a3bdbc2fb7dd1a796f0812927b1c31324d48effc06b2c932a2b4ee3d50632fb590281
6
+ metadata.gz: 12cb7364f4a05c8d11a845e17000dddd189304be4397532efe70d503dd3afe27e599f0f64585e1153072110f2041b08c822a7aeecdc282951371b324cc5dd122
7
+ data.tar.gz: 01e564b3505f9c4c46ab86c22239f6e9c7e36d0d190204b56a8f3f3e9c0b9607385031e80428a8eac25a4711c10c2f7b57686ba91421bfe2b10b473969c9e246
@@ -0,0 +1,68 @@
1
+ <!-- Footer section -->
2
+
3
+ <footer class="ftco-footer ftco-bg-dark ftco-section">
4
+ <div class="container">
5
+ <!-- footer
6
+ <div class="row mb-5">
7
+ <div class="col-md">
8
+ <div class="ftco-footer-widget mb-4">
9
+ <h2 class="ftco-heading-2">About theOrder</h2>
10
+ <ul class="list-unstyled">
11
+ <li><a href="#" class="py-2 d-block">About Us</a></li>
12
+ <li><a href="#" class="py-2 d-block">Lawyers</a></li>
13
+ <li><a href="#" class="py-2 d-block">Blog</a></li>
14
+ <li><a href="#" class="py-2 d-block">Contact</a></li>
15
+ </ul>
16
+ </div>
17
+ </div>
18
+ <div class="col-md">
19
+ <div class="ftco-footer-widget mb-4">
20
+ <h2 class="ftco-heading-2">Communities</h2>
21
+ <ul class="list-unstyled">
22
+ <li><a href="#" class="py-2 d-block">Support</a></li>
23
+ <li><a href="#" class="py-2 d-block">Practice Areas</a></li>
24
+ <li><a href="#" class="py-2 d-block">Won Cases</a></li>
25
+ <li><a href="#" class="py-2 d-block">Privacy</a></li>
26
+ </ul>
27
+ </div>
28
+ </div>
29
+ <div class="col-md">
30
+ <div class="ftco-footer-widget mb-4">
31
+ <h2 class="ftco-heading-2">Contact Information</h2>
32
+ <ul class="list-unstyled">
33
+ <li><a href="#" class="py-2 d-block">198 West 21th Street, Suite 721 New York NY 10016</a></li>
34
+ <li><a href="#" class="py-2 d-block">+ 1235 2355 98</a></li>
35
+ <li><a href="#" class="py-2 d-block">info@yoursite.com</a></li>
36
+ <li><a href="#" class="py-2 d-block">email@email.com</a></li>
37
+ </ul>
38
+ </div>
39
+ </div>
40
+ <div class="col-md">
41
+ <div class="ftco-footer-widget mb-4">
42
+ <h2 class="ftco-heading-2">Opening Hours</h2>
43
+ <ul class="list-unstyled">
44
+ <li><a href="#" class="py-2 d-block">Mon - Thu: 9:00 - 21 00</a></li>
45
+ <li><a href="#" class="py-2 d-block">Fri 8:00 - 21 00</a></li>
46
+ <li><a href="#" class="py-2 d-block">Sat 9:30 - 15: 00</a></li>
47
+ </ul>
48
+ </div>
49
+ </div>
50
+ </div>
51
+ -->
52
+ <div class="row">
53
+ <div class="col-md-12 text-center">
54
+ <div id="div_top_socials">
55
+ <nav>
56
+ <ul id="ul_top_socials" class="et-social-icon" style="padding-left: 0px;">
57
+ <li style="padding-right: 5px;"><a href="{{ site.twitter }}"><i class="fab fa-lg fa-twitter"></i></a></li>
58
+ <li style="padding-right: 5px;"><a href="{{ site.github }}"><i class="fab fa-lg fa-github"></i></a></li>
59
+ <li style="padding-right: 5px;"><a href="{{ site.instagram }}"><i class="fab fa-lg fa-instagram"></i></a></li>
60
+ </ul>
61
+ </nav>
62
+ </div>
63
+ <p>Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="icon-heart" aria-hidden="true"></i> by <a href="www.digitalebrain.com" target="_blank" class="text-primary">DigitaleBrain</a></p>
64
+ </div>
65
+ </div>
66
+ </div>
67
+ </footer>
68
+ <!-- END Footer -->
@@ -0,0 +1,29 @@
1
+ <head>
2
+ <title> {{ site.title }} </title>
3
+ <meta charset="utf-8">
4
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes">
5
+
6
+ <link href="https://fonts.googleapis.com/css?family=Rubik:300,400,500" rel="stylesheet">
7
+ <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.8/css/all.css" integrity="sha384-3AB7yXWz4OeoZcPbieVW64vVXEwADiYyAEhwilzWsLw+9FgqpyjjStpPnpBO8o8S" crossorigin="anonymous">
8
+
9
+ <link rel="shortcut icon" type="image/png" href="/assets/images/favicon.png">
10
+ <link rel="stylesheet" href="assets/css/open-iconic-bootstrap.min.css">
11
+ <link rel="stylesheet" href="assets/css/content.css">
12
+ <link rel="stylesheet" href="assets/css/animate.css">
13
+
14
+ <link rel="stylesheet" href="assets/css/owl.carousel.min.css">
15
+ <link rel="stylesheet" href="assets/css/owl.theme.default.min.css">
16
+ <link rel="stylesheet" href="assets/css/magnific-popup.css">
17
+
18
+ <link rel="stylesheet" href="assets/css/aos.css">
19
+
20
+ <link rel="stylesheet" href="assets/css/ionicons.min.css">
21
+
22
+ <link rel="stylesheet" href="assets/css/bootstrap-datepicker.css">
23
+ <link rel="stylesheet" href="assets/css/jquery.timepicker.css">
24
+
25
+
26
+ <link rel="stylesheet" href="assets/css/flaticon.css">
27
+ <link rel="stylesheet" href="assets/css/icomoon.css">
28
+ <link rel="stylesheet" href="assets/css/style.css">
29
+ </head>
@@ -0,0 +1,20 @@
1
+ <!-- nav -->
2
+ <nav class="navbar navbar-expand-lg navbar-dark ftco_navbar bg-dark ftco-navbar-light" id="ftco-navbar" data-aos="fade-down" data-aos-delay="500">
3
+ <div class="container">
4
+ <a class="navbar-brand" href="#"><span class="flaticon-brain"></span> DigitaleBrain</a>
5
+ <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#ftco-nav" aria-controls="ftco-nav" aria-expanded="false" aria-label="Toggle navigation">
6
+ <span class="oi oi-menu"></span> Menu
7
+ </button>
8
+ <div class="collapse navbar-collapse" id="ftco-nav">
9
+ <ul class="navbar-nav ml-auto">
10
+ <li class="nav-item active"><a href="index.html" class="nav-link">Home</a></li>
11
+ <li class="nav-item"><a href="about.html" class="nav-link">About</a></li>
12
+ <!--<li class="nav-item"><a href="#" class="nav-link">Cases</a></li>
13
+ <li class="nav-item"><a href="#" class="nav-link">Blog</a></li>
14
+ <li class="nav-item"><a href="#" class="nav-link">About</a></li>
15
+ <li class="nav-item"><a href="#" class="nav-link">Contact</a></li>-->
16
+ </ul>
17
+ </div>
18
+ </div>
19
+ </nav>
20
+ <!-- END nav -->
@@ -0,0 +1,41 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ {% include _head.html %}
4
+ <body>
5
+ {% include _navbar.html %}
6
+
7
+ <section class="bg-mobile ftco-cover overlay" id="section-home" data-aos="fade" data-stellar-background-ratio="0.5">
8
+ <div class="container">
9
+ <div class="row align-items-center justify-content-center ftco-vh-100">
10
+ <div id="left-main" class="col-md-8 text-center">
11
+ <h1 class="ftco-heading mb-4" data-aos="fade-up" data-aos-delay="500"> {{ site.content }} </h1>
12
+ <h2 class="h5 ftco-subheading mb-5" data-aos="fade-up" data-aos-delay="600"> {{ site.content2 }} </h2>
13
+ <p data-aos="fade-up" data-aos-delay="700"><a href="#" target="_blank" class="btn btn-outline-white px-4 py-3" data-toggle="modal" data-target="#reservationModal">{{ site.ButtonContent }}</a></p>
14
+ </div>
15
+ </div>
16
+ </div>
17
+ </section>
18
+
19
+ <!-- extra content -->
20
+
21
+ <!-- loader -->
22
+
23
+ {% include _footer.html %}
24
+
25
+ <div id="ftco-loader" class="show fullscreen"><svg class="circular" width="48px" height="48px"><circle class="path-bg" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke="#eeeeee"/><circle class="path" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke-miterlimit="10" stroke="#F96D00"/></svg></div>
26
+
27
+ <script src="assets/js/jquery.min.js"></script>
28
+ <script src="assets/js/jquery-migrate-3.0.1.min.js"></script>
29
+ <script src="assets/js/popper.min.js"></script>
30
+ <script src="assets/js/bootstrap.min.js"></script>
31
+ <script src="assets/js/jquery.easing.1.3.js"></script>
32
+ <script src="assets/js/jquery.waypoints.min.js"></script>
33
+ <script src="assets/js/jquery.stellar.min.js"></script>
34
+ <script src="assets/js/owl.carousel.min.js"></script>
35
+ <script src="assets/js/jquery.magnific-popup.min.js"></script>
36
+ <script src="assets/js/aos.js"></script>
37
+ <script src="assets/js/jquery.animateNumber.min.js"></script>
38
+ <script src="assets/js/main.js"></script>
39
+
40
+ </body>
41
+ </html>
@@ -0,0 +1,39 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ {% include _head.html %}
4
+ <body>
5
+ {% include _navbar.html %}
6
+ <section class="bg-pages ftco-cover overlay" id="section-home" data-aos="fade" data-stellar-background-ratio="0.5">
7
+ <div class="container">
8
+ <div class="row align-items-center justify-content-center ftco-vh-100">
9
+ <div id="left-main" class="col-md-8 text-center">
10
+
11
+ {{ page.content }}
12
+
13
+ </div>
14
+ </div>
15
+ </div>
16
+ <section/>
17
+ <!-- extra content -->
18
+
19
+ <!-- loader -->
20
+
21
+ {% include _footer.html %}
22
+
23
+ <div id="ftco-loader" class="show fullscreen"><svg class="circular" width="48px" height="48px"><circle class="path-bg" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke="#eeeeee"/><circle class="path" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke-miterlimit="10" stroke="#F96D00"/></svg></div>
24
+
25
+ <script src="assets/js/jquery.min.js"></script>
26
+ <script src="assets/js/jquery-migrate-3.0.1.min.js"></script>
27
+ <script src="assets/js/popper.min.js"></script>
28
+ <script src="assets/js/bootstrap.min.js"></script>
29
+ <script src="assets/js/jquery.easing.1.3.js"></script>
30
+ <script src="assets/js/jquery.waypoints.min.js"></script>
31
+ <script src="assets/js/jquery.stellar.min.js"></script>
32
+ <script src="assets/js/owl.carousel.min.js"></script>
33
+ <script src="assets/js/jquery.magnific-popup.min.js"></script>
34
+ <script src="assets/js/aos.js"></script>
35
+ <script src="assets/js/jquery.animateNumber.min.js"></script>
36
+ <script src="assets/js/main.js"></script>
37
+
38
+ </body>
39
+ </html>
@@ -0,0 +1,5 @@
1
+ ---
2
+ layout: default
3
+ ---
4
+
5
+ {{ content }}
@@ -0,0 +1,51 @@
1
+ //
2
+ // Base styles
3
+ //
4
+
5
+ .alert {
6
+ position: relative;
7
+ padding: $alert-padding-y $alert-padding-x;
8
+ margin-bottom: $alert-margin-bottom;
9
+ border: $alert-border-width solid transparent;
10
+ @include border-radius($alert-border-radius);
11
+ }
12
+
13
+ // Headings for larger alerts
14
+ .alert-heading {
15
+ // Specified to prevent conflicts of changing $headings-color
16
+ color: inherit;
17
+ }
18
+
19
+ // Provide class for links that match alerts
20
+ .alert-link {
21
+ font-weight: $alert-link-font-weight;
22
+ }
23
+
24
+
25
+ // Dismissible alerts
26
+ //
27
+ // Expand the right padding and account for the close button's positioning.
28
+
29
+ .alert-dismissible {
30
+ padding-right: ($close-font-size + $alert-padding-x * 2);
31
+
32
+ // Adjust close link position
33
+ .close {
34
+ position: absolute;
35
+ top: 0;
36
+ right: 0;
37
+ padding: $alert-padding-y $alert-padding-x;
38
+ color: inherit;
39
+ }
40
+ }
41
+
42
+
43
+ // Alternate styles
44
+ //
45
+ // Generate contextual modifier classes for colorizing the alert.
46
+
47
+ @each $color, $value in $theme-colors {
48
+ .alert-#{$color} {
49
+ @include alert-variant(theme-color-level($color, $alert-bg-level), theme-color-level($color, $alert-border-level), theme-color-level($color, $alert-color-level));
50
+ }
51
+ }
@@ -0,0 +1,47 @@
1
+ // Base class
2
+ //
3
+ // Requires one of the contextual, color modifier classes for `color` and
4
+ // `background-color`.
5
+
6
+ .badge {
7
+ display: inline-block;
8
+ padding: $badge-padding-y $badge-padding-x;
9
+ font-size: $badge-font-size;
10
+ font-weight: $badge-font-weight;
11
+ line-height: 1;
12
+ text-align: center;
13
+ white-space: nowrap;
14
+ vertical-align: baseline;
15
+ @include border-radius($badge-border-radius);
16
+
17
+ // Empty badges collapse automatically
18
+ &:empty {
19
+ display: none;
20
+ }
21
+ }
22
+
23
+ // Quick fix for badges in buttons
24
+ .btn .badge {
25
+ position: relative;
26
+ top: -1px;
27
+ }
28
+
29
+ // Pill badges
30
+ //
31
+ // Make them extra rounded with a modifier to replace v3's badges.
32
+
33
+ .badge-pill {
34
+ padding-right: $badge-pill-padding-x;
35
+ padding-left: $badge-pill-padding-x;
36
+ @include border-radius($badge-pill-border-radius);
37
+ }
38
+
39
+ // Colors
40
+ //
41
+ // Contextual variations (linked badges get darker on :hover).
42
+
43
+ @each $color, $value in $theme-colors {
44
+ .badge-#{$color} {
45
+ @include badge-variant($value);
46
+ }
47
+ }
@@ -0,0 +1,41 @@
1
+ .breadcrumb {
2
+ display: flex;
3
+ flex-wrap: wrap;
4
+ padding: $breadcrumb-padding-y $breadcrumb-padding-x;
5
+ margin-bottom: $breadcrumb-margin-bottom;
6
+ list-style: none;
7
+ background-color: $breadcrumb-bg;
8
+ @include border-radius($breadcrumb-border-radius);
9
+ }
10
+
11
+ .breadcrumb-item {
12
+ // The separator between breadcrumbs (by default, a forward-slash: "/")
13
+ + .breadcrumb-item {
14
+ padding-left: $breadcrumb-item-padding;
15
+
16
+ &::before {
17
+ display: inline-block; // Suppress underlining of the separator in modern browsers
18
+ padding-right: $breadcrumb-item-padding;
19
+ color: $breadcrumb-divider-color;
20
+ content: $breadcrumb-divider;
21
+ }
22
+ }
23
+
24
+ // IE9-11 hack to properly handle hyperlink underlines for breadcrumbs built
25
+ // without `<ul>`s. The `::before` pseudo-element generates an element
26
+ // *within* the .breadcrumb-item and thereby inherits the `text-decoration`.
27
+ //
28
+ // To trick IE into suppressing the underline, we give the pseudo-element an
29
+ // underline and then immediately remove it.
30
+ + .breadcrumb-item:hover::before {
31
+ text-decoration: underline;
32
+ }
33
+ // stylelint-disable-next-line no-duplicate-selectors
34
+ + .breadcrumb-item:hover::before {
35
+ text-decoration: none;
36
+ }
37
+
38
+ &.active {
39
+ color: $breadcrumb-active-color;
40
+ }
41
+ }
@@ -0,0 +1,172 @@
1
+ // stylelint-disable selector-no-qualifying-type
2
+
3
+ // Make the div behave like a button
4
+ .btn-group,
5
+ .btn-group-vertical {
6
+ position: relative;
7
+ display: inline-flex;
8
+ vertical-align: middle; // match .btn alignment given font-size hack above
9
+
10
+ > .btn {
11
+ position: relative;
12
+ flex: 0 1 auto;
13
+
14
+ // Bring the hover, focused, and "active" buttons to the front to overlay
15
+ // the borders properly
16
+ @include hover {
17
+ z-index: 1;
18
+ }
19
+ &:focus,
20
+ &:active,
21
+ &.active {
22
+ z-index: 1;
23
+ }
24
+ }
25
+
26
+ // Prevent double borders when buttons are next to each other
27
+ .btn + .btn,
28
+ .btn + .btn-group,
29
+ .btn-group + .btn,
30
+ .btn-group + .btn-group {
31
+ margin-left: -$btn-border-width;
32
+ }
33
+ }
34
+
35
+ // Optional: Group multiple button groups together for a toolbar
36
+ .btn-toolbar {
37
+ display: flex;
38
+ flex-wrap: wrap;
39
+ justify-content: flex-start;
40
+
41
+ .input-group {
42
+ width: auto;
43
+ }
44
+ }
45
+
46
+ .btn-group {
47
+ > .btn:first-child {
48
+ margin-left: 0;
49
+ }
50
+
51
+ // Reset rounded corners
52
+ > .btn:not(:last-child):not(.dropdown-toggle),
53
+ > .btn-group:not(:last-child) > .btn {
54
+ @include border-right-radius(0);
55
+ }
56
+
57
+ > .btn:not(:first-child),
58
+ > .btn-group:not(:first-child) > .btn {
59
+ @include border-left-radius(0);
60
+ }
61
+ }
62
+
63
+ // Sizing
64
+ //
65
+ // Remix the default button sizing classes into new ones for easier manipulation.
66
+
67
+ .btn-group-sm > .btn { @extend .btn-sm; }
68
+ .btn-group-lg > .btn { @extend .btn-lg; }
69
+
70
+
71
+ //
72
+ // Split button dropdowns
73
+ //
74
+
75
+ .dropdown-toggle-split {
76
+ padding-right: $btn-padding-x * .75;
77
+ padding-left: $btn-padding-x * .75;
78
+
79
+ &::after,
80
+ .dropup &::after,
81
+ .dropright &::after {
82
+ margin-left: 0;
83
+ }
84
+
85
+ .dropleft &::before {
86
+ margin-right: 0;
87
+ }
88
+ }
89
+
90
+ .btn-sm + .dropdown-toggle-split {
91
+ padding-right: $btn-padding-x-sm * .75;
92
+ padding-left: $btn-padding-x-sm * .75;
93
+ }
94
+
95
+ .btn-lg + .dropdown-toggle-split {
96
+ padding-right: $btn-padding-x-lg * .75;
97
+ padding-left: $btn-padding-x-lg * .75;
98
+ }
99
+
100
+
101
+ // The clickable button for toggling the menu
102
+ // Set the same inset shadow as the :active state
103
+ .btn-group.show .dropdown-toggle {
104
+ @include box-shadow($btn-active-box-shadow);
105
+
106
+ // Show no shadow for `.btn-link` since it has no other button styles.
107
+ &.btn-link {
108
+ @include box-shadow(none);
109
+ }
110
+ }
111
+
112
+
113
+ //
114
+ // Vertical button groups
115
+ //
116
+
117
+ .btn-group-vertical {
118
+ flex-direction: column;
119
+ align-items: flex-start;
120
+ justify-content: center;
121
+
122
+ .btn,
123
+ .btn-group {
124
+ width: 100%;
125
+ }
126
+
127
+ > .btn + .btn,
128
+ > .btn + .btn-group,
129
+ > .btn-group + .btn,
130
+ > .btn-group + .btn-group {
131
+ margin-top: -$btn-border-width;
132
+ margin-left: 0;
133
+ }
134
+
135
+ // Reset rounded corners
136
+ > .btn:not(:last-child):not(.dropdown-toggle),
137
+ > .btn-group:not(:last-child) > .btn {
138
+ @include border-bottom-radius(0);
139
+ }
140
+
141
+ > .btn:not(:first-child),
142
+ > .btn-group:not(:first-child) > .btn {
143
+ @include border-top-radius(0);
144
+ }
145
+ }
146
+
147
+
148
+ // Checkbox and radio options
149
+ //
150
+ // In order to support the browser's form validation feedback, powered by the
151
+ // `required` attribute, we have to "hide" the inputs via `clip`. We cannot use
152
+ // `display: none;` or `visibility: hidden;` as that also hides the popover.
153
+ // Simply visually hiding the inputs via `opacity` would leave them clickable in
154
+ // certain cases which is prevented by using `clip` and `pointer-events`.
155
+ // This way, we ensure a DOM element is visible to position the popover from.
156
+ //
157
+ // See https://github.com/twbs/bootstrap/pull/12794 and
158
+ // https://github.com/twbs/bootstrap/pull/14559 for more information.
159
+
160
+ .btn-group-toggle {
161
+ > .btn,
162
+ > .btn-group > .btn {
163
+ margin-bottom: 0; // Override default `<label>` value
164
+
165
+ input[type="radio"],
166
+ input[type="checkbox"] {
167
+ position: absolute;
168
+ clip: rect(0, 0, 0, 0);
169
+ pointer-events: none;
170
+ }
171
+ }
172
+ }
@@ -0,0 +1,144 @@
1
+ // stylelint-disable selector-no-qualifying-type
2
+
3
+ //
4
+ // Base styles
5
+ //
6
+
7
+ .btn {
8
+ display: inline-block;
9
+ font-weight: $btn-font-weight;
10
+ text-align: center;
11
+ white-space: nowrap;
12
+ vertical-align: middle;
13
+ user-select: none;
14
+ border: $btn-border-width solid transparent;
15
+ @include button-size($btn-padding-y, $btn-padding-x, $font-size-base, $btn-line-height, $btn-border-radius);
16
+ @include transition($btn-transition);
17
+
18
+ // Share hover and focus styles
19
+ @include hover-focus {
20
+ text-decoration: none;
21
+ }
22
+
23
+ &:focus,
24
+ &.focus {
25
+ outline: 0;
26
+ box-shadow: $btn-focus-box-shadow;
27
+ }
28
+
29
+ // Disabled comes first so active can properly restyle
30
+ &.disabled,
31
+ &:disabled {
32
+ opacity: $btn-disabled-opacity;
33
+ @include box-shadow(none);
34
+ }
35
+
36
+ // Opinionated: add "hand" cursor to non-disabled .btn elements
37
+ &:not(:disabled):not(.disabled) {
38
+ cursor: pointer;
39
+ }
40
+
41
+ &:not(:disabled):not(.disabled):active,
42
+ &:not(:disabled):not(.disabled).active {
43
+ background-image: none;
44
+ @include box-shadow($btn-active-box-shadow);
45
+
46
+ &:focus {
47
+ @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow);
48
+ }
49
+ }
50
+ }
51
+
52
+ // Future-proof disabling of clicks on `<a>` elements
53
+ a.btn.disabled,
54
+ fieldset:disabled a.btn {
55
+ pointer-events: none;
56
+ }
57
+
58
+
59
+ //
60
+ // Alternate buttons
61
+ //
62
+
63
+ @each $color, $value in $theme-colors {
64
+ .btn-#{$color} {
65
+ @include button-variant($value, $value);
66
+ }
67
+ }
68
+
69
+ @each $color, $value in $theme-colors {
70
+ .btn-outline-#{$color} {
71
+ @include button-outline-variant($value);
72
+ }
73
+ }
74
+
75
+
76
+ //
77
+ // Link buttons
78
+ //
79
+
80
+ // Make a button look and behave like a link
81
+ .btn-link {
82
+ font-weight: $font-weight-normal;
83
+ color: $link-color;
84
+ background-color: transparent;
85
+
86
+ @include hover {
87
+ color: $link-hover-color;
88
+ text-decoration: $link-hover-decoration;
89
+ background-color: transparent;
90
+ border-color: transparent;
91
+ }
92
+
93
+ &:focus,
94
+ &.focus {
95
+ text-decoration: $link-hover-decoration;
96
+ border-color: transparent;
97
+ box-shadow: none;
98
+ }
99
+
100
+ &:disabled,
101
+ &.disabled {
102
+ color: $btn-link-disabled-color;
103
+ pointer-events: none;
104
+ }
105
+
106
+ // No need for an active state here
107
+ }
108
+
109
+
110
+ //
111
+ // Button Sizes
112
+ //
113
+
114
+ .btn-lg {
115
+ @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $font-size-lg, $btn-line-height-lg, $btn-border-radius-lg);
116
+ }
117
+
118
+ .btn-sm {
119
+ @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
120
+ }
121
+
122
+
123
+ //
124
+ // Block button
125
+ //
126
+
127
+ .btn-block {
128
+ display: block;
129
+ width: 100%;
130
+
131
+ // Vertically space out multiple block buttons
132
+ + .btn-block {
133
+ margin-top: $btn-block-spacing-y;
134
+ }
135
+ }
136
+
137
+ // Specificity overrides
138
+ input[type="submit"],
139
+ input[type="reset"],
140
+ input[type="button"] {
141
+ &.btn-block {
142
+ width: 100%;
143
+ }
144
+ }