bullframe.css 4.2.2 → 5.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (141) hide show
  1. package/.browserslistrc +2 -4
  2. package/.editorconfig +8 -4
  3. package/.prettierignore +1 -0
  4. package/.stylelintignore +3 -0
  5. package/.stylelintrc.json +5 -2
  6. package/CHANGELOG.md +18 -1
  7. package/README.md +369 -327
  8. package/dist/css/bullframe-classless-dark-prefers.css +378 -269
  9. package/dist/css/bullframe-classless-dark-prefers.css.map +1 -0
  10. package/dist/css/bullframe-classless-dark-prefers.min.css +3 -3
  11. package/dist/css/bullframe-classless-dark-prefers.min.css.map +1 -1
  12. package/dist/css/bullframe-classless-dark.css +384 -253
  13. package/dist/css/bullframe-classless-dark.css.map +1 -0
  14. package/dist/css/bullframe-classless-dark.min.css +3 -3
  15. package/dist/css/bullframe-classless-dark.min.css.map +1 -1
  16. package/dist/css/bullframe-classless-system-default.css +378 -269
  17. package/dist/css/bullframe-classless-system-default.css.map +1 -0
  18. package/dist/css/bullframe-classless-system-default.min.css +3 -3
  19. package/dist/css/bullframe-classless-system-default.min.css.map +1 -1
  20. package/dist/css/bullframe-classless.css +343 -229
  21. package/dist/css/bullframe-classless.css.map +1 -0
  22. package/dist/css/bullframe-classless.min.css +3 -2
  23. package/dist/css/bullframe-classless.min.css.map +1 -1
  24. package/dist/css/bullframe-dark-prefers.css +399 -464
  25. package/dist/css/bullframe-dark-prefers.css.map +1 -0
  26. package/dist/css/bullframe-dark-prefers.min.css +3 -2
  27. package/dist/css/bullframe-dark-prefers.min.css.map +1 -1
  28. package/dist/css/bullframe-dark.css +401 -375
  29. package/dist/css/bullframe-dark.css.map +1 -0
  30. package/dist/css/bullframe-dark.min.css +3 -2
  31. package/dist/css/bullframe-dark.min.css.map +1 -1
  32. package/dist/css/bullframe-system-default.css +396 -391
  33. package/dist/css/bullframe-system-default.css.map +1 -0
  34. package/dist/css/bullframe-system-default.min.css +3 -2
  35. package/dist/css/bullframe-system-default.min.css.map +1 -1
  36. package/dist/css/bullframe-utilities.css +69 -109
  37. package/dist/css/bullframe-utilities.css.map +1 -0
  38. package/dist/css/bullframe-utilities.min.css +2 -1
  39. package/dist/css/bullframe-utilities.min.css.map +1 -1
  40. package/dist/css/bullframe.css +370 -350
  41. package/dist/css/bullframe.css.map +1 -0
  42. package/dist/css/bullframe.min.css +3 -1
  43. package/dist/css/bullframe.min.css.map +1 -1
  44. package/dist/docs/demo/css/style.css +131 -0
  45. package/{docs/test-page → dist/docs/demo}/index.html +166 -358
  46. package/dist/docs/github-readme/bf-logo-full-dark.png +0 -0
  47. package/package.json +25 -27
  48. package/prettier.config.js +26 -0
  49. package/src/docs/demo/css/style.css +131 -0
  50. package/src/docs/demo/icons/android-chrome-192x192.png +0 -0
  51. package/src/docs/demo/icons/android-chrome-384x384.png +0 -0
  52. package/src/docs/demo/icons/apple-touch-icon.png +0 -0
  53. package/src/docs/demo/icons/favicon-16x16.png +0 -0
  54. package/src/docs/demo/icons/favicon-32x32.png +0 -0
  55. package/src/docs/demo/icons/favicon.ico +0 -0
  56. package/src/docs/demo/icons/mstile-150x150.png +0 -0
  57. package/src/docs/demo/icons/safari-pinned-tab.svg +28 -0
  58. package/src/docs/demo/images/logo.png +0 -0
  59. package/src/docs/demo/images/placeholder-img-130x140.jpg +0 -0
  60. package/src/docs/demo/images/placeholder-img-16x16.jpg +0 -0
  61. package/src/docs/demo/images/placeholder-img-800x400.jpg +0 -0
  62. package/src/docs/demo/images/video-poster.png +0 -0
  63. package/src/docs/demo/index.html +1152 -0
  64. package/src/docs/github-readme/bf-logo-full-dark.png +0 -0
  65. package/src/docs/github-readme/bf-logo-full-light.png +0 -0
  66. package/src/scss/bullframe-classless-dark-prefers.scss +2 -5
  67. package/src/scss/bullframe-classless-dark.scss +2 -5
  68. package/src/scss/bullframe-classless-system-default.scss +2 -5
  69. package/src/scss/bullframe-classless.scss +49 -43
  70. package/src/scss/bullframe-dark-prefers.scss +2 -4
  71. package/src/scss/bullframe-dark.scss +2 -4
  72. package/src/scss/bullframe-system-default.scss +2 -4
  73. package/src/scss/bullframe-utilities.scss +21 -61
  74. package/src/scss/bullframe.scss +49 -121
  75. package/src/scss/custom/_author-styles.scss +5 -0
  76. package/src/scss/forms/_forms-normalization.scss +68 -58
  77. package/src/scss/forms/_forms-styling-radio-checkbox.scss +64 -66
  78. package/src/scss/forms/_forms-styling-range.scss +88 -74
  79. package/src/scss/forms/_forms-styling-select.scss +18 -16
  80. package/src/scss/forms/_forms-styling.scss +38 -26
  81. package/src/scss/miscellaneous/_misc-accessibility.scss +10 -16
  82. package/src/scss/miscellaneous/_misc-anchors.scss +15 -13
  83. package/src/scss/miscellaneous/_misc-embedded-content.scss +14 -21
  84. package/src/scss/miscellaneous/_misc-focus.scss +0 -21
  85. package/src/scss/miscellaneous/_misc-interactive.scss +48 -0
  86. package/src/scss/miscellaneous/_misc-lists.scss +9 -5
  87. package/src/scss/miscellaneous/_misc-scrolling.scss +5 -0
  88. package/src/scss/miscellaneous/_misc-shame.scss +6 -0
  89. package/src/scss/miscellaneous/_misc-tables.scss +11 -5
  90. package/src/scss/mixins/_mixin-dark-prefers.scss +414 -0
  91. package/src/scss/mixins/_mixin-dark.scss +396 -0
  92. package/src/scss/mixins/_mixin-grid-flex.scss +0 -3
  93. package/src/scss/mixins/_mixin-layout.scss +1 -1
  94. package/src/scss/mixins/_mixin-texts.scss +2 -3
  95. package/src/scss/typography/_typography-blockquotes.scss +10 -5
  96. package/src/scss/typography/_typography-headings.scss +9 -8
  97. package/src/scss/typography/_typography-html-body.scss +17 -14
  98. package/src/scss/typography/_typography-misc.scss +19 -22
  99. package/src/scss/typography/_typography-monospaced-elements.scss +21 -12
  100. package/src/scss/utilities/_utility-buttons.scss +20 -18
  101. package/src/scss/utilities/_utility-debugging.scss +2 -88
  102. package/src/scss/utilities/_utility-embeds.scss +1 -1
  103. package/src/scss/utilities/_utility-filters.scss +0 -3
  104. package/src/scss/utilities/_utility-form-states.scss +30 -21
  105. package/src/scss/utilities/_utility-global-dark-classless.scss +3 -157
  106. package/src/scss/utilities/_utility-global-dark-prefers-classless.scss +3 -3
  107. package/src/scss/utilities/_utility-global-dark-prefers.scss +3 -3
  108. package/src/scss/utilities/_utility-global-dark-scrollbars.scss +11 -6
  109. package/src/scss/utilities/_utility-global-dark.scss +4 -213
  110. package/src/scss/utilities/_utility-global-system-default-classless.scss +3 -3
  111. package/src/scss/utilities/_utility-global-system-default.scss +3 -3
  112. package/src/scss/utilities/_utility-grid-system.scss +51 -115
  113. package/src/scss/utilities/_utility-layout.scss +7 -15
  114. package/src/scss/utilities/_utility-print.scss +5 -5
  115. package/src/scss/utilities/_utility-spacing.scss +42 -40
  116. package/src/scss/utilities/_utility-tables.scss +12 -18
  117. package/src/scss/utilities/_utility-texts.scss +48 -22
  118. package/src/scss/utilities/_utility-z-index.scss +1 -1
  119. package/src/scss/variables/_variables-breakpoints.scss +1 -0
  120. package/src/scss/variables/_variables-colors.scss +8 -5
  121. package/src/scss/variables/_variables-spacing.scss +3 -5
  122. package/src/scss/variables/_variables-texts.scss +5 -9
  123. package/vite.config.js +116 -0
  124. package/.nvmrc +0 -1
  125. package/.prettierrc +0 -19
  126. package/gulpfile.js +0 -67
  127. package/src/scss/miscellaneous/_misc-author-styles-in-css.scss +0 -76
  128. /package/{docs/test-page/assets → dist/docs/demo}/icons/android-chrome-192x192.png +0 -0
  129. /package/{docs/test-page/assets → dist/docs/demo}/icons/android-chrome-384x384.png +0 -0
  130. /package/{docs/test-page/assets → dist/docs/demo}/icons/apple-touch-icon.png +0 -0
  131. /package/{docs/test-page/assets → dist/docs/demo}/icons/favicon-16x16.png +0 -0
  132. /package/{docs/test-page/assets → dist/docs/demo}/icons/favicon-32x32.png +0 -0
  133. /package/{docs/test-page/assets → dist/docs/demo}/icons/favicon.ico +0 -0
  134. /package/{docs/test-page/assets → dist/docs/demo}/icons/mstile-150x150.png +0 -0
  135. /package/{docs/test-page/assets → dist/docs/demo}/icons/safari-pinned-tab.svg +0 -0
  136. /package/{docs/test-page/assets → dist/docs/demo}/images/logo.png +0 -0
  137. /package/{docs/test-page/assets → dist/docs/demo}/images/placeholder-img-130x140.jpg +0 -0
  138. /package/{docs/test-page/assets → dist/docs/demo}/images/placeholder-img-16x16.jpg +0 -0
  139. /package/{docs/test-page/assets → dist/docs/demo}/images/placeholder-img-800x400.jpg +0 -0
  140. /package/{docs/test-page/assets → dist/docs/demo}/images/video-poster.png +0 -0
  141. /package/{docs/assets/images/branding/logo-full.png → dist/docs/github-readme/bf-logo-full-light.png} +0 -0
@@ -0,0 +1,131 @@
1
+ .demo {
2
+ .bf-row {
3
+ margin-bottom: 2rem;
4
+ }
5
+
6
+ [class^="bf-col"] {
7
+ margin-bottom: 1rem;
8
+ }
9
+
10
+ header {
11
+ margin-bottom: 1rem;
12
+
13
+ h1 {
14
+ margin-top: 1rem;
15
+ margin-bottom: 0;
16
+ font-weight: 700;
17
+
18
+ span {
19
+ color: #f95c1f;
20
+ }
21
+
22
+ @media (min-width: 600px) {
23
+ font-size: 5.5rem;
24
+ }
25
+
26
+ @media (min-width: 1000px) {
27
+ font-size: 7rem;
28
+ }
29
+ }
30
+
31
+ a {
32
+ margin-right: 1rem;
33
+ }
34
+ }
35
+
36
+ @media (min-width: 600px) {
37
+ .btn-github {
38
+ font-size: 115%;
39
+ }
40
+ }
41
+
42
+ .description {
43
+ max-width: 80rem;
44
+ margin-left: auto;
45
+ margin-right: auto;
46
+ }
47
+
48
+ .h2--section {
49
+ padding-bottom: 2rem;
50
+ text-transform: uppercase;
51
+
52
+ @media (min-width: 600px) {
53
+ font-size: 4rem;
54
+ }
55
+ }
56
+
57
+ legend {
58
+ padding-bottom: 1rem;
59
+ }
60
+
61
+ button,
62
+ .bf-btn,
63
+ .input-image,
64
+ input,
65
+ select,
66
+ textarea {
67
+ margin-bottom: 2rem;
68
+ }
69
+
70
+ dialog {
71
+ .bf-btn {
72
+ margin-bottom: 0;
73
+ }
74
+ }
75
+
76
+ [type="image"],
77
+ [type="checkbox"],
78
+ [type="radio"] {
79
+ margin-bottom: 0;
80
+ }
81
+
82
+ .grid {
83
+ .col-wrapper {
84
+ background-color: #888;
85
+ height: 6rem;
86
+ line-height: 6rem;
87
+ overflow-y: hidden;
88
+ color: #fff;
89
+ font-size: 80%;
90
+ text-align: center;
91
+ border-radius: 3px;
92
+ font-weight: 700;
93
+ }
94
+
95
+ .bf-row:nth-child(odd) {
96
+ .col-wrapper {
97
+ background-color: #ccc;
98
+ color: #000;
99
+ }
100
+ }
101
+
102
+ @media (max-width: 767px) {
103
+ .bf-row {
104
+ margin-bottom: 0;
105
+ }
106
+
107
+ [class*="bf-col-"] {
108
+ margin-bottom: 2rem;
109
+ }
110
+ }
111
+ }
112
+
113
+ .back-to-top {
114
+ text-align: center;
115
+ display: block;
116
+ margin: 6rem 0 12rem;
117
+
118
+ a {
119
+ i {
120
+ vertical-align: middle;
121
+ font-style: normal;
122
+ }
123
+ }
124
+ }
125
+
126
+ @media (max-width: 575px) {
127
+ header {
128
+ margin-bottom: 1rem;
129
+ }
130
+ }
131
+ }