jekyll-rtd-theme 1.1.8 → 2.0.0.pre.beta

Sign up to get free protection for your applications and to get access to all the features.
Files changed (109) hide show
  1. checksums.yaml +4 -4
  2. data/LICENSE +1 -1
  3. data/README.md +23 -65
  4. data/_includes/addons/analytics.liquid +4 -4
  5. data/_includes/addons/github.liquid +7 -10
  6. data/_includes/breadcrumbs.liquid +27 -0
  7. data/_includes/extend/list.liquid +2 -2
  8. data/_includes/{reset → extend}/tabs.liquid +0 -0
  9. data/_includes/extend/toctree.liquid +6 -5
  10. data/_includes/footer.liquid +36 -0
  11. data/_includes/reset/defaults.liquid +25 -60
  12. data/_includes/reset/workdir.liquid +1 -0
  13. data/_includes/safe/shortcodes.liquid +9 -0
  14. data/_includes/shortcodes/danger.liquid +3 -2
  15. data/_includes/shortcodes/note.liquid +3 -2
  16. data/_includes/shortcodes/tip.liquid +3 -2
  17. data/_includes/shortcodes/warning.liquid +3 -2
  18. data/_includes/{class/_toctree.liquid → toctree.liquid} +2 -2
  19. data/_layouts/default.liquid +182 -23
  20. data/_layouts/plugins/extension.liquid +6 -8
  21. data/_sass/@primer/base/base.scss +90 -0
  22. data/_sass/@primer/base/index.scss +6 -0
  23. data/_sass/@primer/base/kbd.scss +21 -0
  24. data/_sass/@primer/base/normalize.scss +423 -0
  25. data/_sass/@primer/base/typography-base.scss +100 -0
  26. data/_sass/@primer/breadcrumb/breadcrumb.scss +28 -0
  27. data/_sass/@primer/breadcrumb/index.scss +3 -0
  28. data/_sass/@primer/buttons/button-group.scss +91 -0
  29. data/_sass/@primer/buttons/button.scss +296 -0
  30. data/_sass/@primer/buttons/index.scss +4 -0
  31. data/_sass/@primer/buttons/misc.scss +205 -0
  32. data/_sass/@primer/forms/form-control.scss +278 -0
  33. data/_sass/@primer/forms/form-group.scss +279 -0
  34. data/_sass/@primer/forms/form-select.scss +38 -0
  35. data/_sass/@primer/forms/form-validation.scss +369 -0
  36. data/_sass/@primer/forms/index.scss +7 -0
  37. data/_sass/@primer/forms/input-group.scss +53 -0
  38. data/_sass/@primer/forms/radio-group.scss +43 -0
  39. data/_sass/@primer/markdown/blob-csv.scss +31 -0
  40. data/_sass/@primer/markdown/code.scss +73 -0
  41. data/_sass/@primer/markdown/headings.scss +72 -0
  42. data/_sass/@primer/markdown/images.scss +131 -0
  43. data/_sass/@primer/markdown/index.scss +8 -0
  44. data/_sass/@primer/markdown/lists.scss +76 -0
  45. data/_sass/@primer/markdown/markdown-body.scss +99 -0
  46. data/_sass/@primer/markdown/tables.scss +38 -0
  47. data/_sass/@primer/support/index.scss +11 -0
  48. data/_sass/@primer/support/mixins/buttons.scss +184 -0
  49. data/_sass/@primer/support/mixins/layout.scss +55 -0
  50. data/_sass/@primer/support/mixins/misc.scss +32 -0
  51. data/_sass/@primer/support/mixins/typography.scss +88 -0
  52. data/_sass/@primer/support/variables/color-system.scss +243 -0
  53. data/_sass/@primer/support/variables/colors.scss +55 -0
  54. data/_sass/@primer/support/variables/layout.scss +149 -0
  55. data/_sass/@primer/support/variables/misc.scss +42 -0
  56. data/_sass/@primer/support/variables/typography.scss +43 -0
  57. data/_sass/@primer/utilities/animations.scss +187 -0
  58. data/_sass/@primer/utilities/borders.scss +184 -0
  59. data/_sass/@primer/utilities/box-shadow.scss +25 -0
  60. data/_sass/@primer/utilities/colors.scss +185 -0
  61. data/_sass/@primer/utilities/details.scss +34 -0
  62. data/_sass/@primer/utilities/flexbox.scss +121 -0
  63. data/_sass/@primer/utilities/index.scss +14 -0
  64. data/_sass/@primer/utilities/layout.scss +134 -0
  65. data/_sass/@primer/utilities/margin.scss +68 -0
  66. data/_sass/@primer/utilities/padding.scss +59 -0
  67. data/_sass/@primer/utilities/typography.scss +325 -0
  68. data/_sass/@primer/utilities/visibility-display.scss +82 -0
  69. data/_sass/_font-face.scss +65 -0
  70. data/_sass/_icons.scss +53 -0
  71. data/_sass/_layout.scss +76 -0
  72. data/_sass/_reset.scss +21 -0
  73. data/_sass/_root.scss +9 -0
  74. data/_sass/_variables.scss +29 -0
  75. data/_sass/class/addons-wrap.scss +39 -0
  76. data/_sass/class/container.scss +11 -0
  77. data/_sass/class/content-wrap.scss +4 -0
  78. data/_sass/class/header.scss +10 -0
  79. data/_sass/{highlight.scss → class/highlight.scss} +0 -0
  80. data/_sass/class/markdown-body.scss +49 -0
  81. data/_sass/class/sidebar-wrap.scss +72 -0
  82. data/_sass/class/title.scss +13 -0
  83. data/_sass/theme.scss +26 -12
  84. data/assets/404.liquid +1 -3
  85. data/assets/css/theme.min.css +1 -4
  86. data/assets/css/theme.scss +4 -0
  87. data/assets/js/mermaid.min.js +6 -5
  88. data/assets/js/search.js +90 -0
  89. data/assets/js/theme.js +55 -121
  90. data/assets/js/theme.min.js +1 -1
  91. data/assets/search.liquid +9 -1
  92. metadata +74 -25
  93. data/_includes/assets/custom.js +0 -0
  94. data/_includes/assets/custom.scss +0 -0
  95. data/_includes/class/_breadcrumbs.liquid +0 -28
  96. data/_includes/class/_footer.liquid +0 -38
  97. data/_includes/class/rst-versions.liquid +0 -22
  98. data/_includes/class/wy-nav-content.liquid +0 -15
  99. data/_includes/class/wy-nav-side.liquid +0 -18
  100. data/_includes/class/wy-nav-top.liquid +0 -8
  101. data/_includes/extra/footer.html +0 -0
  102. data/_includes/extra/head.html +0 -0
  103. data/_includes/node/links.liquid +0 -24
  104. data/_includes/node/metadata.liquid +0 -21
  105. data/_includes/node/script.extension.liquid +0 -29
  106. data/_includes/node/script.liquid +0 -20
  107. data/_includes/node/script.schema.liquid +0 -27
  108. data/_includes/node/title.liquid +0 -1
  109. data/_includes/reset/i18n.liquid +0 -1
@@ -0,0 +1,131 @@
1
+ // Need to target base styles
2
+ // stylelint-disable selector-max-compound-selectors, selector-no-qualifying-type
3
+ // stylelint-disable selector-max-type
4
+ .markdown-body {
5
+ // Images & Stuff
6
+ img {
7
+ max-width: 100%;
8
+ // because we put padding on the images to hide header lines, and some people
9
+ // specify the width of their images in their markdown.
10
+ box-sizing: content-box;
11
+ background-color: $bg-white;
12
+
13
+ &[align="right"] {
14
+ // stylelint-disable-next-line primer/spacing
15
+ padding-left: 20px;
16
+ }
17
+
18
+ &[align="left"] {
19
+ // stylelint-disable-next-line primer/spacing
20
+ padding-right: 20px;
21
+ }
22
+ }
23
+
24
+ .emoji {
25
+ max-width: none;
26
+ vertical-align: text-top;
27
+ // Override `<img>` styles so Emjois don't clash with zebra striping in our tables
28
+ background-color: transparent;
29
+ }
30
+
31
+ // Gollum Image Tags
32
+
33
+ // Framed
34
+ span.frame {
35
+ display: block;
36
+ overflow: hidden;
37
+
38
+ > span {
39
+ display: block;
40
+ float: left;
41
+ width: auto;
42
+ // stylelint-disable-next-line primer/spacing
43
+ padding: 7px;
44
+ // stylelint-disable-next-line primer/spacing
45
+ margin: 13px 0 0;
46
+ overflow: hidden;
47
+ // stylelint-disable-next-line primer/borders
48
+ border: $border-width $border-style lighten($gray-300, 5%);
49
+ }
50
+
51
+ span img {
52
+ display: block;
53
+ float: left;
54
+ }
55
+
56
+ span span {
57
+ display: block;
58
+ // stylelint-disable-next-line primer/spacing
59
+ padding: 5px 0 0;
60
+ clear: both;
61
+ color: $text-gray-dark;
62
+ }
63
+ }
64
+
65
+ span.align-center {
66
+ display: block;
67
+ overflow: hidden;
68
+ clear: both;
69
+
70
+ > span {
71
+ display: block;
72
+ // stylelint-disable-next-line primer/spacing
73
+ margin: 13px auto 0;
74
+ overflow: hidden;
75
+ text-align: center;
76
+ }
77
+
78
+ span img {
79
+ margin: 0 auto;
80
+ text-align: center;
81
+ }
82
+ }
83
+
84
+ span.align-right {
85
+ display: block;
86
+ overflow: hidden;
87
+ clear: both;
88
+
89
+ > span {
90
+ display: block;
91
+ // stylelint-disable-next-line primer/spacing
92
+ margin: 13px 0 0;
93
+ overflow: hidden;
94
+ text-align: right;
95
+ }
96
+
97
+ span img {
98
+ margin: 0;
99
+ text-align: right;
100
+ }
101
+ }
102
+
103
+ span.float-left {
104
+ display: block;
105
+ float: left;
106
+ // stylelint-disable-next-line primer/spacing
107
+ margin-right: 13px;
108
+ overflow: hidden;
109
+
110
+ span {
111
+ // stylelint-disable-next-line primer/spacing
112
+ margin: 13px 0 0;
113
+ }
114
+ }
115
+
116
+ span.float-right {
117
+ display: block;
118
+ float: right;
119
+ // stylelint-disable-next-line primer/spacing
120
+ margin-left: 13px;
121
+ overflow: hidden;
122
+
123
+ > span {
124
+ display: block;
125
+ // stylelint-disable-next-line primer/spacing
126
+ margin: 13px auto 0;
127
+ overflow: hidden;
128
+ text-align: right;
129
+ }
130
+ }
131
+ }
@@ -0,0 +1,8 @@
1
+ @import "../support/index.scss";
2
+ @import "./markdown-body.scss";
3
+ @import "./headings.scss";
4
+ @import "./lists.scss";
5
+ @import "./tables.scss";
6
+ @import "./images.scss";
7
+ @import "./code.scss";
8
+ @import "./blob-csv.scss";
@@ -0,0 +1,76 @@
1
+ // Base styles
2
+ // stylelint-disable selector-no-qualifying-type
3
+ // stylelint-disable selector-max-type
4
+ .markdown-body {
5
+ // Lists, Blockquotes & Such
6
+ ul,
7
+ ol {
8
+ // stylelint-disable-next-line primer/spacing
9
+ padding-left: 2em;
10
+
11
+ &.no-list {
12
+ padding: 0;
13
+ list-style-type: none;
14
+ }
15
+ }
16
+
17
+ // Did someone complain about list spacing? Encourage them
18
+ // to create the spacing with their markdown formatting.
19
+ // List behavior should be controled by the markup, not the css.
20
+ //
21
+ // For lists with padding between items, use blank
22
+ // lines between items. This will generate paragraphs with
23
+ // padding to space things out.
24
+ //
25
+ // - item
26
+ //
27
+ // - item
28
+ //
29
+ // - item
30
+ //
31
+ // For list without padding, don't use blank lines.
32
+ //
33
+ // - item
34
+ // - item
35
+ // - item
36
+ //
37
+ // Modifying the css to emulate these behaviors merely brakes
38
+ // one case in the process of solving another. Don't change
39
+ // this unless it's really really a bug.
40
+ ul ul,
41
+ ul ol,
42
+ ol ol,
43
+ ol ul {
44
+ margin-top: 0;
45
+ margin-bottom: 0;
46
+ }
47
+
48
+ li {
49
+ word-wrap: break-all;
50
+ }
51
+
52
+ li > p {
53
+ margin-top: $spacer-3;
54
+ }
55
+
56
+ li + li {
57
+ margin-top: $em-spacer-3;
58
+ }
59
+
60
+ dl {
61
+ padding: 0;
62
+
63
+ dt {
64
+ padding: 0;
65
+ margin-top: $spacer-3;
66
+ font-size: 1em;
67
+ font-style: italic;
68
+ font-weight: $font-weight-bold;
69
+ }
70
+
71
+ dd {
72
+ padding: 0 $spacer-3;
73
+ margin-bottom: $spacer-3;
74
+ }
75
+ }
76
+ }
@@ -0,0 +1,99 @@
1
+ // All of our block level items should have the same margin
2
+ // stylelint-disable selector-max-type
3
+
4
+ // This is styling for generic markdownized text. Anything you put in a
5
+ // container with .markdown-body on it should render generally well. It also
6
+ // includes some GitHub Flavored Markdown specific styling (like @mentions)
7
+ .markdown-body {
8
+ font-family: $body-font;
9
+ font-size: $h4-size;
10
+ line-height: $body-line-height;
11
+ word-wrap: break-word;
12
+
13
+ @import "../base/kbd.scss"; // adds support for keyboard shortcuts
14
+
15
+ // Clearfix on the markdown body
16
+ &::before {
17
+ display: table;
18
+ content: "";
19
+ }
20
+
21
+ &::after {
22
+ display: table;
23
+ clear: both;
24
+ content: "";
25
+ }
26
+
27
+ > *:first-child {
28
+ margin-top: 0 !important;
29
+ }
30
+
31
+ > *:last-child {
32
+ margin-bottom: 0 !important;
33
+ }
34
+
35
+ // Anchors like <a name="examples">. These sometimes end up wrapped around
36
+ // text when users mistakenly forget to close the tag or use self-closing tag
37
+ // syntax. We don't want them to appear like links.
38
+ // FIXME: a:not(:link):not(:visited) would be a little clearer here (and
39
+ // possibly faster to match), but it breaks styling of <a href> elements due
40
+ // to https://bugs.webkit.org/show_bug.cgi?id=142737.
41
+ a:not([href]) {
42
+ color: inherit;
43
+ text-decoration: none;
44
+ }
45
+
46
+ // Link Colors
47
+ .absent {
48
+ color: $text-red;
49
+ }
50
+
51
+ .anchor {
52
+ float: left;
53
+ padding-right: $spacer-1;
54
+ // stylelint-disable-next-line primer/spacing
55
+ margin-left: -20px;
56
+ line-height: $lh-condensed-ultra;
57
+
58
+ &:focus {
59
+ outline: none;
60
+ }
61
+ }
62
+
63
+ p,
64
+ blockquote,
65
+ ul,
66
+ ol,
67
+ dl,
68
+ table,
69
+ pre,
70
+ details {
71
+ margin-top: 0;
72
+ margin-bottom: $spacer-3;
73
+ }
74
+
75
+ hr {
76
+ height: $em-spacer-3;
77
+ padding: 0;
78
+ margin: $spacer-4 0;
79
+ // stylelint-disable-next-line primer/colors
80
+ background-color: $gray-200;
81
+ border: 0;
82
+ }
83
+
84
+ blockquote {
85
+ // stylelint-disable-next-line primer/spacing
86
+ padding: 0 1em;
87
+ color: $text-gray-light;
88
+ // stylelint-disable-next-line primer/borders
89
+ border-left: 0.25em $border-style lighten($gray-300, 5%);
90
+
91
+ > :first-child {
92
+ margin-top: 0;
93
+ }
94
+
95
+ > :last-child {
96
+ margin-bottom: 0;
97
+ }
98
+ }
99
+ }
@@ -0,0 +1,38 @@
1
+ // Needs refactoring
2
+ // stylelint-disable selector-max-type
3
+ .markdown-body {
4
+ // Tables
5
+ table {
6
+ display: block;
7
+ width: 100%; // keep for backwards compatibility
8
+ width: max-content;
9
+ max-width: 100%;
10
+ overflow: auto;
11
+
12
+ th {
13
+ font-weight: $font-weight-bold;
14
+ }
15
+
16
+ th,
17
+ td {
18
+ // stylelint-disable-next-line primer/spacing
19
+ padding: 6px 13px;
20
+ // stylelint-disable-next-line primer/borders
21
+ border: $border-width $border-style lighten($gray-300, 5%);
22
+ }
23
+
24
+ tr {
25
+ background-color: $bg-white;
26
+ // stylelint-disable-next-line primer/borders
27
+ border-top: $border-width $border-style darken($gray-300, 4%);
28
+
29
+ &:nth-child(2n) {
30
+ background-color: $bg-gray;
31
+ }
32
+ }
33
+
34
+ img {
35
+ background-color: transparent;
36
+ }
37
+ }
38
+ }
@@ -0,0 +1,11 @@
1
+ // variables
2
+ @import "./variables/typography.scss";
3
+ @import "./variables/colors.scss";
4
+ @import "./variables/layout.scss";
5
+ @import "./variables/misc.scss";
6
+
7
+ // mixins
8
+ @import "./mixins/typography.scss";
9
+ @import "./mixins/layout.scss";
10
+ @import "./mixins/buttons.scss";
11
+ @import "./mixins/misc.scss";
@@ -0,0 +1,184 @@
1
+ // TODO: See if the mixins below can be deprecated
2
+ // Might still be needed for .btn-blue
3
+ // ------------------------------------------------------------------
4
+
5
+ // Button color generator for primary and themed buttons
6
+
7
+ // New button hotness
8
+ @mixin btn-solid($color, $bg, $bg2) {
9
+ color: $color;
10
+ background-color: $bg2;
11
+ background-image: linear-gradient(-180deg, $bg 0%, $bg2 90%);
12
+
13
+ @if $bg == $gray-000 {
14
+ &:focus,
15
+ &.focus {
16
+ box-shadow: $btn-input-focus-shadow;
17
+ }
18
+
19
+ &:hover,
20
+ &.hover {
21
+ background-color: darken($bg2, 3%);
22
+ background-image: linear-gradient(
23
+ -180deg,
24
+ darken($bg, 3%) 0%,
25
+ darken($bg2, 3%) 90%
26
+ );
27
+ background-position: 0 -$em-spacer-5;
28
+ border-color: rgba($black, 0.35);
29
+ }
30
+
31
+ &:active,
32
+ &.selected,
33
+ &[aria-selected="true"],
34
+ [open] > & {
35
+ background-color: darken(desaturate($bg, 10%), 6%);
36
+ background-image: none;
37
+ border-color: rgba(
38
+ $black,
39
+ 0.35
40
+ ); // repeat to avoid shift on click-drag off of button
41
+ box-shadow: $btn-active-shadow;
42
+ }
43
+
44
+ &:disabled,
45
+ &.disabled,
46
+ &[aria-disabled="true"] {
47
+ color: rgba($color, 0.4);
48
+ background-color: $bg2;
49
+ background-image: none;
50
+ border-color: $border-color-button;
51
+ box-shadow: none;
52
+ }
53
+ } @else {
54
+ &:focus,
55
+ &.focus {
56
+ box-shadow: 0 0 0 0.2em rgba($bg, 0.4);
57
+ }
58
+
59
+ &:hover,
60
+ &.hover {
61
+ background-color: darken($bg2, 2%);
62
+ background-image: linear-gradient(
63
+ -180deg,
64
+ darken($bg, 2%) 0%,
65
+ darken($bg2, 2%) 90%
66
+ );
67
+ background-position: 0 -$em-spacer-5;
68
+ border-color: $black-fade-50;
69
+ }
70
+
71
+ &:active,
72
+ &.selected,
73
+ &[aria-selected="true"],
74
+ [open] > & {
75
+ background-color: darken(mix($bg, $bg2, 50%), 7%);
76
+ background-image: none;
77
+ border-color: $black-fade-50; // repeat to avoid shift on click-drag off of button
78
+ box-shadow: $btn-active-shadow;
79
+ }
80
+
81
+ &:disabled,
82
+ &.disabled,
83
+ &[aria-disabled="true"] {
84
+ color: rgba($color, 0.75);
85
+ background-color: mix($bg2, $white, 50%);
86
+ background-image: none;
87
+ border-color: $border-color-button;
88
+ box-shadow: none;
89
+ }
90
+
91
+ .Counter {
92
+ color: darken($bg, 8%);
93
+ background-color: $white;
94
+ }
95
+ }
96
+ }
97
+
98
+ // Inverse button hover style
99
+ @mixin btn-inverse($color, $bg, $bg2) {
100
+ color: $color;
101
+ background-color: $bg;
102
+ background-image: linear-gradient(-180deg, $bg 0%, $bg2 90%);
103
+
104
+ &:focus {
105
+ box-shadow: 0 0 0 0.2em rgba($color, 0.4);
106
+ }
107
+
108
+ &:hover {
109
+ color: $text-white;
110
+ background-color: $color;
111
+ background-image: linear-gradient(
112
+ -180deg,
113
+ lighten($color, 10%) 0%,
114
+ $color 90%
115
+ );
116
+ border-color: $black-fade-50;
117
+
118
+ .Counter {
119
+ color: $text-white;
120
+ }
121
+ }
122
+
123
+ &:active,
124
+ &.selected,
125
+ &[aria-selected="true"],
126
+ [open] > & {
127
+ color: $text-white;
128
+ background-color: darken($color, 5%);
129
+ background-image: none;
130
+ border-color: $black-fade-50;
131
+ box-shadow: $btn-active-shadow;
132
+ }
133
+
134
+ &:disabled,
135
+ &.disabled,
136
+ &[aria-disabled="true"] {
137
+ color: rgba($color, 0.4);
138
+ background-color: $bg2;
139
+ background-image: none;
140
+ border-color: $border-color-button;
141
+ box-shadow: none;
142
+ }
143
+ }
144
+
145
+ // Outline color generator for btn-outline to make the hover state inverse the text and bg colors.
146
+ @mixin btn-outline($text-color: $text-blue, $bg-color: $bg-white) {
147
+ color: $text-color;
148
+ background-color: $bg-color;
149
+ background-image: none;
150
+
151
+ .Counter {
152
+ background-color: rgba($black, 0.07);
153
+ }
154
+
155
+ &:hover,
156
+ &:active,
157
+ &.selected,
158
+ &[aria-selected="true"],
159
+ [open] > & {
160
+ color: $bg-color;
161
+ background-color: $text-color;
162
+ background-image: none;
163
+ border-color: $text-color;
164
+
165
+ .Counter {
166
+ color: $text-color;
167
+ background-color: $bg-color;
168
+ }
169
+ }
170
+
171
+ &:focus {
172
+ border-color: $text-color;
173
+ box-shadow: 0 0 0 0.2em rgba($text-color, 0.4);
174
+ }
175
+
176
+ &:disabled,
177
+ &.disabled,
178
+ &[aria-disabled="true"] {
179
+ color: $black-fade-30;
180
+ background-color: $bg-white;
181
+ border-color: $black-fade-15;
182
+ box-shadow: none;
183
+ }
184
+ }
@@ -0,0 +1,55 @@
1
+ // Responsive media queries
2
+
3
+ @mixin breakpoint($breakpoint) {
4
+ @if $breakpoint == "" {
5
+ @content;
6
+ } @else {
7
+ // Retrieves the value from the key
8
+ $value: map-get($breakpoints, $breakpoint);
9
+
10
+ // If the key exists in the map
11
+ @if $value != null {
12
+ // Prints a media query based on the value
13
+ @media (min-width: $value) {
14
+ @content;
15
+ }
16
+ }
17
+
18
+ // If the key doesn't exist in the map
19
+ @else {
20
+ @warn "Unfortunately, no value could be retrieved from `#{$breakpoint}`. "
21
+ + "Please make sure it is defined in `$breakpoints` map.";
22
+ }
23
+ }
24
+ }
25
+
26
+ // Retina media query
27
+
28
+ @mixin retina-media-query {
29
+ @media only screen and (-webkit-min-device-pixel-ratio: 2),
30
+ only screen and (min--moz-device-pixel-ratio: 2),
31
+ only screen and (-moz-min-device-pixel-ratio: 2),
32
+ only screen and (-o-min-device-pixel-ratio: 2/1),
33
+ only screen and (min-device-pixel-ratio: 2),
34
+ only screen and (min-resolution: 192dpi),
35
+ only screen and (min-resolution: 2dppx) {
36
+ @content;
37
+ }
38
+ }
39
+
40
+ // Clearfix
41
+ //
42
+ // Clears floats via mixin.
43
+
44
+ @mixin clearfix {
45
+ &::before {
46
+ display: table;
47
+ content: "";
48
+ }
49
+
50
+ &::after {
51
+ display: table;
52
+ clear: both;
53
+ content: "";
54
+ }
55
+ }
@@ -0,0 +1,32 @@
1
+ // Generate a two-color caret for any element.
2
+ @mixin double-caret(
3
+ $foreground: $text-white,
4
+ $background: lighten($gray-300, 5%)
5
+ ) {
6
+ &::after,
7
+ &::before {
8
+ position: absolute;
9
+ top: 11px;
10
+ right: 100%;
11
+ left: -16px;
12
+ display: block;
13
+ width: 0;
14
+ height: 0;
15
+ pointer-events: none;
16
+ content: " ";
17
+ border-color: transparent;
18
+ border-style: solid solid outset;
19
+ }
20
+
21
+ &::after {
22
+ margin-top: 1px;
23
+ margin-left: 2px;
24
+ border-width: 7px;
25
+ border-right-color: $foreground;
26
+ }
27
+
28
+ &::before {
29
+ border-width: 8px;
30
+ border-right-color: $background;
31
+ }
32
+ }