brut 0.17.0 → 0.18.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 (1103) hide show
  1. checksums.yaml +4 -4
  2. data/exe/brut +34 -0
  3. data/lib/brut/cli/apps/build_assets.rb +78 -48
  4. data/lib/brut/cli/apps/db.rb +168 -202
  5. data/lib/brut/cli/apps/deploy.rb +291 -0
  6. data/lib/brut/cli/apps/heroku_container_based_deploy.rb +6 -0
  7. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/add_segment.rb +5 -5
  8. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/add_segment_options.rb +1 -1
  9. data/lib/brut/cli/apps/new/app.rb +240 -0
  10. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/app_id.rb +1 -1
  11. data/lib/brut/cli/apps/new/app_name.rb +29 -0
  12. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/base.rb +9 -6
  13. data/lib/brut/cli/apps/new/erb_binding_delegate.rb +23 -0
  14. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/internet_identifier.rb +5 -5
  15. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/invalid_identifier.rb +1 -1
  16. data/{mkbrut/lib/mkbrut/app.rb → lib/brut/cli/apps/new/old_app.rb} +8 -11
  17. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/add_css_import.rb +1 -1
  18. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/add_i18n_message.rb +1 -1
  19. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/add_method.rb +1 -1
  20. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/append_to_file.rb +1 -1
  21. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/base_op.rb +3 -3
  22. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/copy_file.rb +1 -1
  23. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/insert_code_in_method.rb +1 -1
  24. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/insert_into_file.rb +1 -1
  25. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/insert_route.rb +1 -1
  26. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/mkdir.rb +1 -1
  27. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/prism_parsing_op.rb +1 -1
  28. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/render_template.rb +1 -1
  29. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/ops/skip_file.rb +1 -1
  30. data/lib/brut/cli/apps/new/ops.rb +17 -0
  31. data/lib/brut/cli/apps/new/organization.rb +5 -0
  32. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/prefix.rb +1 -1
  33. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/segments/bare_bones.rb +12 -11
  34. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/segments/demo.rb +16 -15
  35. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/segments/heroku.rb +9 -5
  36. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/segments/sidekiq.rb +44 -21
  37. data/lib/brut/cli/apps/new/segments.rb +8 -0
  38. data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/versions.rb +3 -3
  39. data/lib/brut/cli/apps/new.rb +26 -0
  40. data/lib/brut/cli/apps/scaffold.rb +150 -141
  41. data/lib/brut/cli/apps/test.rb +92 -68
  42. data/lib/brut/cli/commands/base_command.rb +174 -0
  43. data/lib/brut/cli/commands/compound_command.rb +29 -0
  44. data/lib/brut/cli/commands/execution_context.rb +32 -0
  45. data/lib/brut/cli/commands/help.rb +26 -0
  46. data/lib/brut/cli/commands/output_error.rb +13 -0
  47. data/lib/brut/cli/commands/raise_error.rb +11 -0
  48. data/lib/brut/cli/commands.rb +8 -0
  49. data/lib/brut/cli/execute_result.rb +39 -0
  50. data/lib/brut/cli/executor.rb +9 -4
  51. data/lib/brut/cli/output.rb +13 -0
  52. data/lib/brut/cli/parsed_command_line.rb +143 -0
  53. data/lib/brut/cli/runner.rb +124 -0
  54. data/lib/brut/cli.rb +7 -29
  55. data/lib/brut/framework/container.rb +1 -1
  56. data/lib/brut/framework/mcp.rb +59 -13
  57. data/lib/brut/framework/project_environment.rb +3 -1
  58. data/lib/brut/junk_drawer.rb +3 -1
  59. data/lib/brut/spec_support/cli_command_support.rb +45 -0
  60. data/lib/brut/spec_support/e2e_test_server.rb +3 -0
  61. data/lib/brut/spec_support/general_support.rb +1 -1
  62. data/lib/brut/spec_support/matchers/have_executed.rb +35 -0
  63. data/lib/brut/spec_support/rspec_setup.rb +4 -8
  64. data/lib/brut/spec_support.rb +1 -0
  65. data/lib/brut/tui/markup_string.rb +2 -0
  66. data/lib/brut/tui/script/events/command_std_out.rb +3 -2
  67. data/lib/brut/tui/script/exec_step.rb +11 -4
  68. data/lib/brut/tui/script/puts_subscriber.rb +4 -4
  69. data/lib/brut/tui/script.rb +7 -3
  70. data/lib/brut/tui/terminal_theme.rb +15 -11
  71. data/lib/brut/version.rb +1 -1
  72. data/templates/Base/.env.development.local +2 -0
  73. data/templates/Base/bin/ci +42 -0
  74. data/{mkbrut/templates → templates}/Base/bin/release +2 -2
  75. data/templates/Base/bin/setup +174 -0
  76. data/{mkbrut/templates → templates}/Base/bin/watch-and-build-assets +1 -1
  77. data/{mkbrut/templates → templates}/Base/dx/docker-compose.env.erb +1 -1
  78. data/{mkbrut/templates → templates}/segments/Demo/app/src/front_end/css/fonts.css +1 -1
  79. data/{mkbrut/templates → templates}/segments/Heroku/deploy/Dockerfile +2 -2
  80. data/templates/segments/Heroku/deploy/docker_config.rb +30 -0
  81. metadata +190 -1055
  82. data/.gitignore +0 -61
  83. data/.projections.json +0 -10
  84. data/CHANGELOG.md +0 -172
  85. data/CODE_OF_CONDUCT.txt +0 -99
  86. data/Dockerfile.dx +0 -82
  87. data/Gemfile +0 -6
  88. data/Gemfile.lock +0 -246
  89. data/LICENSE.txt +0 -370
  90. data/README.md +0 -90
  91. data/Rakefile +0 -25
  92. data/assets/Logo-Square.pxd +0 -0
  93. data/assets/LogoPylon.pxd +0 -0
  94. data/assets/LogoStop.pxd +0 -0
  95. data/assets/LogoTall.pxd +0 -0
  96. data/assets/MetroIcon.graffle +0 -0
  97. data/assets/MetroLogo.graffle +0 -0
  98. data/assets/SocialImage.png +0 -0
  99. data/assets/SocialImage.pxd +0 -0
  100. data/assets/YouTubeThumb.pxd +0 -0
  101. data/bin/bin_kit.rb +0 -51
  102. data/bin/build +0 -86
  103. data/bin/ci +0 -40
  104. data/bin/dev +0 -20
  105. data/bin/docs +0 -86
  106. data/bin/generate-and-run-rubocop +0 -52
  107. data/bin/new-version +0 -8
  108. data/bin/publish +0 -61
  109. data/bin/rake +0 -27
  110. data/bin/rspec +0 -27
  111. data/bin/rubocop +0 -27
  112. data/bin/setup +0 -252
  113. data/bin/test +0 -18
  114. data/brut-css/.nvim.lua +0 -1
  115. data/brut-css/README.md +0 -28
  116. data/brut-css/bin/build +0 -50
  117. data/brut-css/bin/ci +0 -19
  118. data/brut-css/bin/dev +0 -1
  119. data/brut-css/bin/docs +0 -34
  120. data/brut-css/bin/publish +0 -21
  121. data/brut-css/bin/setup +0 -6
  122. data/brut-css/config/media-queries-all.css +0 -15
  123. data/brut-css/config/media-queries-minimal.css +0 -5
  124. data/brut-css/config/postcss.config.cjs +0 -7
  125. data/brut-css/config/pseudo-classes-all.css +0 -9
  126. data/brut-css/dx +0 -1
  127. data/brut-css/package-lock.json +0 -3165
  128. data/brut-css/package.json +0 -36
  129. data/brut-css/src/css/appearance.css +0 -145
  130. data/brut-css/src/css/border.css +0 -522
  131. data/brut-css/src/css/colors.css +0 -3502
  132. data/brut-css/src/css/dimensions.css +0 -548
  133. data/brut-css/src/css/flex.css +0 -179
  134. data/brut-css/src/css/index.css +0 -13
  135. data/brut-css/src/css/layout.css +0 -120
  136. data/brut-css/src/css/list.css +0 -41
  137. data/brut-css/src/css/positioning.css +0 -354
  138. data/brut-css/src/css/properties/colors.css +0 -455
  139. data/brut-css/src/css/properties/index.css +0 -3
  140. data/brut-css/src/css/properties/spacing.css +0 -140
  141. data/brut-css/src/css/properties/typography.css +0 -224
  142. data/brut-css/src/css/reset.css +0 -107
  143. data/brut-css/src/css/spacing.css +0 -585
  144. data/brut-css/src/css/typography.css +0 -519
  145. data/brut-css/src/css/utils.css +0 -104
  146. data/brut-css/src/docs/1_getting-started/1_overview.md +0 -46
  147. data/brut-css/src/docs/1_getting-started/2_installation.md +0 -25
  148. data/brut-css/src/docs/1_getting-started/3_core-concepts.md +0 -75
  149. data/brut-css/src/docs/1_getting-started/4_simple-example.md +0 -132
  150. data/brut-css/src/docs/1_getting-started/page.html.ejs +0 -10
  151. data/brut-css/src/docs/2_properties/page.html.ejs +0 -71
  152. data/brut-css/src/docs/3_classes/color-demo.html.ejs +0 -31
  153. data/brut-css/src/docs/3_classes/page.html.ejs +0 -87
  154. data/brut-css/src/docs/4_customization/1_design-system.md +0 -36
  155. data/brut-css/src/docs/4_customization/2_breakpoints.md +0 -75
  156. data/brut-css/src/docs/4_customization/3_pseudo-classes.md +0 -74
  157. data/brut-css/src/docs/4_customization/4_advanced-configuration.md +0 -40
  158. data/brut-css/src/docs/4_customization/page.html.ejs +0 -10
  159. data/brut-css/src/docs/docs.css +0 -98
  160. data/brut-css/src/docs/includes/body-and-header.html.ejs +0 -30
  161. data/brut-css/src/docs/includes/footer-and-rest.html.ejs +0 -9
  162. data/brut-css/src/docs/includes/head.html.ejs +0 -5
  163. data/brut-css/src/docs/includes/nav.html.ejs +0 -10
  164. data/brut-css/src/docs/index.html.ejs +0 -32
  165. data/brut-css/src/docs/prism-twilight.min.css +0 -1
  166. data/brut-css/src/js/Logger.js +0 -71
  167. data/brut-css/src/js/build.js +0 -111
  168. data/brut-css/src/js/cli/CLIArgError.js +0 -7
  169. data/brut-css/src/js/cli/Debug.js +0 -27
  170. data/brut-css/src/js/cli/DocsDir.js +0 -16
  171. data/brut-css/src/js/cli/DocsTemplateSourceDir.js +0 -16
  172. data/brut-css/src/js/cli/InputFile.js +0 -31
  173. data/brut-css/src/js/cli/MediaQueryConfigFile.js +0 -10
  174. data/brut-css/src/js/cli/OutputFile.js +0 -22
  175. data/brut-css/src/js/cli/ParsedArg.js +0 -17
  176. data/brut-css/src/js/cli/PathToBrutCSSRoot.js +0 -19
  177. data/brut-css/src/js/cli/PseudoClassConfigFile.js +0 -11
  178. data/brut-css/src/js/cli.js +0 -108
  179. data/brut-css/src/js/docGenerator.js +0 -467
  180. data/brut-css/src/js/mediaQueryConfigParser.js +0 -98
  181. data/brut-css/src/js/post-css-plugins/addMediaQueriesPlugin.js +0 -49
  182. data/brut-css/src/js/post-css-plugins/addPseudoClassesPlugin.js +0 -42
  183. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/Category.js +0 -9
  184. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/DocState.js +0 -185
  185. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/Documentable.js +0 -8
  186. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/Group.js +0 -7
  187. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/ParsedComment.js +0 -73
  188. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/Property.js +0 -9
  189. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/PropertyCategory.js +0 -4
  190. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/PropertyGroup.js +0 -8
  191. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/Rule.js +0 -12
  192. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/RuleCategory.js +0 -4
  193. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/RuleGroup.js +0 -8
  194. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/SeeRef.js +0 -5
  195. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin/SeeURL.js +0 -9
  196. data/brut-css/src/js/post-css-plugins/generateDocumentationPlugin.js +0 -49
  197. data/brut-css/src/js/post-css-plugins/generateRootCustomPropertiesPlugin.js +0 -45
  198. data/brut-css/src/js/pseudoClassConfigParser.js +0 -145
  199. data/brut-js/.projections.json +0 -10
  200. data/brut-js/README.md +0 -118
  201. data/brut-js/bin/build +0 -19
  202. data/brut-js/bin/ci +0 -5
  203. data/brut-js/bin/docs +0 -25
  204. data/brut-js/bin/publish +0 -21
  205. data/brut-js/bin/setup +0 -6
  206. data/brut-js/docs/README.md +0 -8
  207. data/brut-js/docs/jsdoc-plugins/customElementTag.js +0 -8
  208. data/brut-js/docs/jsdoc-theme/publish.js +0 -692
  209. data/brut-js/docs/jsdoc-theme/static/scripts/linenumber.js +0 -25
  210. data/brut-js/docs/jsdoc-theme/static/scripts/prettify/Apache-License-2.0.txt +0 -202
  211. data/brut-js/docs/jsdoc-theme/static/scripts/prettify/lang-css.js +0 -2
  212. data/brut-js/docs/jsdoc-theme/static/scripts/prettify/prettify.js +0 -28
  213. data/brut-js/docs/jsdoc-theme/static/styles/jsdoc-default.css +0 -327
  214. data/brut-js/docs/jsdoc-theme/static/styles/prettify-jsdoc.css +0 -111
  215. data/brut-js/docs/jsdoc-theme/static/styles/prettify-tomorrow.css +0 -132
  216. data/brut-js/docs/jsdoc-theme/tmpl/augments.tmpl +0 -10
  217. data/brut-js/docs/jsdoc-theme/tmpl/container.tmpl +0 -199
  218. data/brut-js/docs/jsdoc-theme/tmpl/details.tmpl +0 -143
  219. data/brut-js/docs/jsdoc-theme/tmpl/example.tmpl +0 -2
  220. data/brut-js/docs/jsdoc-theme/tmpl/examples.tmpl +0 -13
  221. data/brut-js/docs/jsdoc-theme/tmpl/exceptions.tmpl +0 -32
  222. data/brut-js/docs/jsdoc-theme/tmpl/layout.tmpl +0 -38
  223. data/brut-js/docs/jsdoc-theme/tmpl/mainpage.tmpl +0 -14
  224. data/brut-js/docs/jsdoc-theme/tmpl/members.tmpl +0 -38
  225. data/brut-js/docs/jsdoc-theme/tmpl/method.tmpl +0 -131
  226. data/brut-js/docs/jsdoc-theme/tmpl/modifies.tmpl +0 -14
  227. data/brut-js/docs/jsdoc-theme/tmpl/params.tmpl +0 -131
  228. data/brut-js/docs/jsdoc-theme/tmpl/properties.tmpl +0 -108
  229. data/brut-js/docs/jsdoc-theme/tmpl/returns.tmpl +0 -19
  230. data/brut-js/docs/jsdoc-theme/tmpl/source.tmpl +0 -8
  231. data/brut-js/docs/jsdoc-theme/tmpl/tutorial.tmpl +0 -19
  232. data/brut-js/docs/jsdoc-theme/tmpl/type.tmpl +0 -7
  233. data/brut-js/docs/jsdoc.config.json +0 -23
  234. data/brut-js/docs/package-lock.json +0 -343
  235. data/brut-js/docs/package.json +0 -7
  236. data/brut-js/dx +0 -1
  237. data/brut-js/package-lock.json +0 -2210
  238. data/brut-js/package.json +0 -36
  239. data/brut-js/specs/AjaxSubmit.spec.js +0 -453
  240. data/brut-js/specs/Autosubmit.spec.js +0 -127
  241. data/brut-js/specs/ConfirmSubmit.spec.js +0 -224
  242. data/brut-js/specs/ConstraintViolationMessage.spec.js +0 -33
  243. data/brut-js/specs/ConstraintViolationMessages.spec.js +0 -32
  244. data/brut-js/specs/CopyToClipboard.spec.js +0 -35
  245. data/brut-js/specs/Form.spec.js +0 -137
  246. data/brut-js/specs/I18nTranslation.spec.js +0 -19
  247. data/brut-js/specs/LocaleDetection.spec.js +0 -22
  248. data/brut-js/specs/Message.spec.js +0 -15
  249. data/brut-js/specs/SpecHelper.js +0 -23
  250. data/brut-js/specs/Tabs.spec.js +0 -41
  251. data/brut-js/specs/Toast.spec.js +0 -34
  252. data/brut-js/specs/config/asset_metadata.json +0 -7
  253. data/brut-js/src/AjaxSubmit.js +0 -499
  254. data/brut-js/src/Autosubmit.js +0 -63
  255. data/brut-js/src/BaseCustomElement.js +0 -261
  256. data/brut-js/src/ConfirmSubmit.js +0 -137
  257. data/brut-js/src/ConfirmationDialog.js +0 -143
  258. data/brut-js/src/ConstraintViolationMessage.js +0 -140
  259. data/brut-js/src/ConstraintViolationMessages.js +0 -98
  260. data/brut-js/src/CopyToClipboard.js +0 -96
  261. data/brut-js/src/Form.js +0 -147
  262. data/brut-js/src/I18nTranslation.js +0 -64
  263. data/brut-js/src/LocaleDetection.js +0 -117
  264. data/brut-js/src/Logger.js +0 -90
  265. data/brut-js/src/Message.js +0 -62
  266. data/brut-js/src/RichString.js +0 -116
  267. data/brut-js/src/Tabs.js +0 -168
  268. data/brut-js/src/Toast.js +0 -102
  269. data/brut-js/src/Tracing.js +0 -247
  270. data/brut-js/src/appForTestingOnly.js +0 -15
  271. data/brut-js/src/index.js +0 -133
  272. data/brut-js/src/testing/AssetMetadata.js +0 -35
  273. data/brut-js/src/testing/AssetMetadataLoader.js +0 -25
  274. data/brut-js/src/testing/CustomElementTest.js +0 -235
  275. data/brut-js/src/testing/DOMCreator.js +0 -45
  276. data/brut-js/src/testing/index.js +0 -48
  277. data/brut.gemspec +0 -73
  278. data/brutrb.com/.vitepress/config.mjs +0 -164
  279. data/brutrb.com/.vitepress/plugins/jsdocLinker.js +0 -34
  280. data/brutrb.com/.vitepress/plugins/rdocLinker.js +0 -18
  281. data/brutrb.com/.vitepress/theme/custom.css +0 -14
  282. data/brutrb.com/.vitepress/theme/index.js +0 -18
  283. data/brutrb.com/.vitepress/theme/style.css +0 -139
  284. data/brutrb.com/adrs.md +0 -16
  285. data/brutrb.com/ai.md +0 -68
  286. data/brutrb.com/assets.md +0 -131
  287. data/brutrb.com/bin/build +0 -5
  288. data/brutrb.com/bin/deploy +0 -7
  289. data/brutrb.com/bin/dev +0 -5
  290. data/brutrb.com/bin/setup +0 -6
  291. data/brutrb.com/brut-js.md +0 -128
  292. data/brutrb.com/business-logic.md +0 -55
  293. data/brutrb.com/cli.md +0 -274
  294. data/brutrb.com/components.md +0 -265
  295. data/brutrb.com/configuration.md +0 -256
  296. data/brutrb.com/css.md +0 -103
  297. data/brutrb.com/custom-element-tests.md +0 -148
  298. data/brutrb.com/database-access.md +0 -201
  299. data/brutrb.com/database-schema.md +0 -320
  300. data/brutrb.com/deployment.md +0 -158
  301. data/brutrb.com/dev-environment.md +0 -186
  302. data/brutrb.com/dir-structure.md +0 -120
  303. data/brutrb.com/doc-conventions.md +0 -41
  304. data/brutrb.com/dx +0 -1
  305. data/brutrb.com/end-to-end-tests.md +0 -176
  306. data/brutrb.com/features.md +0 -373
  307. data/brutrb.com/flash-and-session.md +0 -208
  308. data/brutrb.com/form-constraints.md +0 -266
  309. data/brutrb.com/forms.md +0 -238
  310. data/brutrb.com/getting-started.md +0 -142
  311. data/brutrb.com/handlers.md +0 -177
  312. data/brutrb.com/hooks.md +0 -176
  313. data/brutrb.com/i18n.md +0 -190
  314. data/brutrb.com/images/DevEnvironment.graffle +0 -0
  315. data/brutrb.com/images/DevEnvironment.png +0 -0
  316. data/brutrb.com/images/LogoSquare.png +0 -0
  317. data/brutrb.com/images/LogoStop.png +0 -0
  318. data/brutrb.com/images/LogoTall.png +0 -0
  319. data/brutrb.com/images/Makefile +0 -10
  320. data/brutrb.com/images/OverviewMetro.graffle +0 -0
  321. data/brutrb.com/images/OverviewMetro.png +0 -0
  322. data/brutrb.com/images/dev-env-overview.dot +0 -54
  323. data/brutrb.com/images/dev-env-overview.png +0 -0
  324. data/brutrb.com/images/dev-env-protocol.dot +0 -37
  325. data/brutrb.com/images/dev-env-protocol.png +0 -0
  326. data/brutrb.com/images/overview.graffle +0 -0
  327. data/brutrb.com/images/overview.png +0 -0
  328. data/brutrb.com/images/spa.dot +0 -19
  329. data/brutrb.com/images/spa.png +0 -0
  330. data/brutrb.com/images/tutorial/02-confirmation-dialog-browser-element-styled.png +0 -0
  331. data/brutrb.com/images/tutorial/02-confirmation-dialog-browser-element.png +0 -0
  332. data/brutrb.com/images/tutorial/02-confirmation-dialog-browser.png +0 -0
  333. data/brutrb.com/images/tutorial/02-confirmation-flow.graffle +0 -0
  334. data/brutrb.com/images/tutorial/02-confirmation-flow.png +0 -0
  335. data/brutrb.com/images/tutorial/basic-form-with-violations.png +0 -0
  336. data/brutrb.com/images/tutorial/basic-form.png +0 -0
  337. data/brutrb.com/images/tutorial/initial-home-page.png +0 -0
  338. data/brutrb.com/images/tutorial/new-post-editor.png +0 -0
  339. data/brutrb.com/images/tutorial/new-post-home-page.png +0 -0
  340. data/brutrb.com/images/tutorial/styled-form-with-server-side-violations.png +0 -0
  341. data/brutrb.com/images/tutorial/styled-form-with-violations.png +0 -0
  342. data/brutrb.com/images/tutorial/styled-home-page-with-posts.png +0 -0
  343. data/brutrb.com/images/tutorial/styled-home-page.png +0 -0
  344. data/brutrb.com/images/tutorial/welcome-to-brut.png +0 -0
  345. data/brutrb.com/images/workspace-protocol.dot +0 -44
  346. data/brutrb.com/images/workspace-protocol.png +0 -0
  347. data/brutrb.com/index.md +0 -34
  348. data/brutrb.com/instrumentation.md +0 -331
  349. data/brutrb.com/javascript.md +0 -122
  350. data/brutrb.com/jobs.md +0 -114
  351. data/brutrb.com/keyword-injection.md +0 -195
  352. data/brutrb.com/layouts.md +0 -156
  353. data/brutrb.com/lsp.md +0 -23
  354. data/brutrb.com/markdown-examples.md +0 -85
  355. data/brutrb.com/middleware.md +0 -80
  356. data/brutrb.com/overview.md +0 -68
  357. data/brutrb.com/package-lock.json +0 -2451
  358. data/brutrb.com/package.json +0 -11
  359. data/brutrb.com/pages.md +0 -290
  360. data/brutrb.com/public/SocialImage.png +0 -0
  361. data/brutrb.com/public/favicon.ico +0 -0
  362. data/brutrb.com/recipes/alternate-layouts.md +0 -32
  363. data/brutrb.com/recipes/authentication.md +0 -336
  364. data/brutrb.com/recipes/custom-flash.md +0 -51
  365. data/brutrb.com/recipes/dev-env-secrets.md +0 -87
  366. data/brutrb.com/recipes/form-errors.md +0 -148
  367. data/brutrb.com/recipes/indexed-forms.md +0 -149
  368. data/brutrb.com/recipes/migrations.md +0 -210
  369. data/brutrb.com/recipes/text-field-component.md +0 -182
  370. data/brutrb.com/roadmap.md +0 -52
  371. data/brutrb.com/routes.md +0 -189
  372. data/brutrb.com/security.md +0 -102
  373. data/brutrb.com/seed-data.md +0 -63
  374. data/brutrb.com/space-time-continuum.md +0 -81
  375. data/brutrb.com/tutorial.md +0 -138
  376. data/brutrb.com/tutorials/01-intro.md +0 -1654
  377. data/brutrb.com/tutorials/02-dialog.md +0 -569
  378. data/brutrb.com/unit-tests.md +0 -148
  379. data/brutrb.com/why.md +0 -19
  380. data/docker-compose.dx.yml +0 -25
  381. data/docs/404.html +0 -26
  382. data/docs/CNAME +0 -1
  383. data/docs/SocialImage.png +0 -0
  384. data/docs/adrs.html +0 -29
  385. data/docs/ai.html +0 -29
  386. data/docs/api/Brut/BackEnd/SeedData.html +0 -493
  387. data/docs/api/Brut/BackEnd/Sidekiq/Middlewares/Server/FlushSpans.html +0 -214
  388. data/docs/api/Brut/BackEnd/Sidekiq/Middlewares/Server.html +0 -125
  389. data/docs/api/Brut/BackEnd/Sidekiq/Middlewares.html +0 -125
  390. data/docs/api/Brut/BackEnd/Sidekiq.html +0 -125
  391. data/docs/api/Brut/BackEnd/Validators/FormValidator.html +0 -414
  392. data/docs/api/Brut/BackEnd/Validators.html +0 -128
  393. data/docs/api/Brut/BackEnd.html +0 -132
  394. data/docs/api/Brut/CLI/App.html +0 -1601
  395. data/docs/api/Brut/CLI/AppRunner.html +0 -491
  396. data/docs/api/Brut/CLI/Apps/BuildAssets/All.html +0 -264
  397. data/docs/api/Brut/CLI/Apps/BuildAssets/CSS.html +0 -306
  398. data/docs/api/Brut/CLI/Apps/BuildAssets/Images.html +0 -262
  399. data/docs/api/Brut/CLI/Apps/BuildAssets/JS.html +0 -314
  400. data/docs/api/Brut/CLI/Apps/BuildAssets.html +0 -183
  401. data/docs/api/Brut/CLI/Apps/DB/Create.html +0 -365
  402. data/docs/api/Brut/CLI/Apps/DB/Drop.html +0 -357
  403. data/docs/api/Brut/CLI/Apps/DB/Migrate.html +0 -389
  404. data/docs/api/Brut/CLI/Apps/DB/NewMigration.html +0 -339
  405. data/docs/api/Brut/CLI/Apps/DB/Rebuild.html +0 -329
  406. data/docs/api/Brut/CLI/Apps/DB/Seed.html +0 -347
  407. data/docs/api/Brut/CLI/Apps/DB/Status.html +0 -383
  408. data/docs/api/Brut/CLI/Apps/DB.html +0 -183
  409. data/docs/api/Brut/CLI/Apps/DeployBase/GitChecks.html +0 -270
  410. data/docs/api/Brut/CLI/Apps/DeployBase.html +0 -257
  411. data/docs/api/Brut/CLI/Apps/HerokuContainerBasedDeploy/Deploy.html +0 -587
  412. data/docs/api/Brut/CLI/Apps/HerokuContainerBasedDeploy.html +0 -196
  413. data/docs/api/Brut/CLI/Apps/Scaffold/Action/Route.html +0 -303
  414. data/docs/api/Brut/CLI/Apps/Scaffold/Action.html +0 -508
  415. data/docs/api/Brut/CLI/Apps/Scaffold/Component.html +0 -398
  416. data/docs/api/Brut/CLI/Apps/Scaffold/CustomElementTest.html +0 -374
  417. data/docs/api/Brut/CLI/Apps/Scaffold/DbModel.html +0 -384
  418. data/docs/api/Brut/CLI/Apps/Scaffold/E2ETest.html +0 -410
  419. data/docs/api/Brut/CLI/Apps/Scaffold/Form.html +0 -262
  420. data/docs/api/Brut/CLI/Apps/Scaffold/Page/Route.html +0 -303
  421. data/docs/api/Brut/CLI/Apps/Scaffold/Page.html +0 -480
  422. data/docs/api/Brut/CLI/Apps/Scaffold/RoutesEditor.html +0 -450
  423. data/docs/api/Brut/CLI/Apps/Scaffold/Test.html +0 -380
  424. data/docs/api/Brut/CLI/Apps/Scaffold.html +0 -253
  425. data/docs/api/Brut/CLI/Apps/Test/Audit.html +0 -474
  426. data/docs/api/Brut/CLI/Apps/Test/E2e.html +0 -407
  427. data/docs/api/Brut/CLI/Apps/Test/JS.html +0 -262
  428. data/docs/api/Brut/CLI/Apps/Test/Run.html +0 -578
  429. data/docs/api/Brut/CLI/Apps/Test.html +0 -253
  430. data/docs/api/Brut/CLI/Apps.html +0 -125
  431. data/docs/api/Brut/CLI/Command.html +0 -2425
  432. data/docs/api/Brut/CLI/Error.html +0 -139
  433. data/docs/api/Brut/CLI/ExecutionResults/Result.html +0 -664
  434. data/docs/api/Brut/CLI/ExecutionResults.html +0 -675
  435. data/docs/api/Brut/CLI/Executor.html +0 -561
  436. data/docs/api/Brut/CLI/InvalidOption.html +0 -245
  437. data/docs/api/Brut/CLI/Options.html +0 -880
  438. data/docs/api/Brut/CLI/Output.html +0 -699
  439. data/docs/api/Brut/CLI/SystemExecError.html +0 -451
  440. data/docs/api/Brut/CLI.html +0 -263
  441. data/docs/api/Brut/FactoryBot.html +0 -225
  442. data/docs/api/Brut/Framework/App.html +0 -1097
  443. data/docs/api/Brut/Framework/Config.html +0 -1071
  444. data/docs/api/Brut/Framework/Container.html +0 -1464
  445. data/docs/api/Brut/Framework/Error.html +0 -140
  446. data/docs/api/Brut/Framework/Errors/AbstractMethod.html +0 -232
  447. data/docs/api/Brut/Framework/Errors/Bug.html +0 -234
  448. data/docs/api/Brut/Framework/Errors/MissingConfiguration.html +0 -257
  449. data/docs/api/Brut/Framework/Errors/MissingParameter.html +0 -273
  450. data/docs/api/Brut/Framework/Errors/NoClassForPath.html +0 -471
  451. data/docs/api/Brut/Framework/Errors/NotFound.html +0 -308
  452. data/docs/api/Brut/Framework/Errors/NotImplemented.html +0 -234
  453. data/docs/api/Brut/Framework/Errors.html +0 -351
  454. data/docs/api/Brut/Framework/FussyTypeEnforcement.html +0 -392
  455. data/docs/api/Brut/Framework/MCP.html +0 -871
  456. data/docs/api/Brut/Framework/ProjectEnvironment.html +0 -648
  457. data/docs/api/Brut/Framework.html +0 -129
  458. data/docs/api/Brut/FrontEnd/AssetPathResolver.html +0 -317
  459. data/docs/api/Brut/FrontEnd/Component/Helpers.html +0 -420
  460. data/docs/api/Brut/FrontEnd/Component.html +0 -434
  461. data/docs/api/Brut/FrontEnd/Components/ConstraintViolations.html +0 -491
  462. data/docs/api/Brut/FrontEnd/Components/FormTag.html +0 -526
  463. data/docs/api/Brut/FrontEnd/Components/I18nTranslations.html +0 -313
  464. data/docs/api/Brut/FrontEnd/Components/Input.html +0 -195
  465. data/docs/api/Brut/FrontEnd/Components/Inputs/ButtonTag.html +0 -447
  466. data/docs/api/Brut/FrontEnd/Components/Inputs/CsrfToken.html +0 -339
  467. data/docs/api/Brut/FrontEnd/Components/Inputs/InputTag.html +0 -568
  468. data/docs/api/Brut/FrontEnd/Components/Inputs/RadioButton.html +0 -419
  469. data/docs/api/Brut/FrontEnd/Components/Inputs/SelectTagWithOptions.html +0 -610
  470. data/docs/api/Brut/FrontEnd/Components/Inputs/TextareaTag.html +0 -534
  471. data/docs/api/Brut/FrontEnd/Components/Inputs.html +0 -125
  472. data/docs/api/Brut/FrontEnd/Components/LocaleDetection.html +0 -367
  473. data/docs/api/Brut/FrontEnd/Components/PageIdentifier.html +0 -355
  474. data/docs/api/Brut/FrontEnd/Components/TimeTag.html +0 -655
  475. data/docs/api/Brut/FrontEnd/Components/Traceparent.html +0 -352
  476. data/docs/api/Brut/FrontEnd/Components.html +0 -156
  477. data/docs/api/Brut/FrontEnd/CsrfProtector.html +0 -250
  478. data/docs/api/Brut/FrontEnd/Download.html +0 -467
  479. data/docs/api/Brut/FrontEnd/Flash.html +0 -1150
  480. data/docs/api/Brut/FrontEnd/Form.html +0 -1227
  481. data/docs/api/Brut/FrontEnd/Forms/Button.html +0 -331
  482. data/docs/api/Brut/FrontEnd/Forms/ButtonInputDefinition.html +0 -537
  483. data/docs/api/Brut/FrontEnd/Forms/ConstraintViolation.html +0 -590
  484. data/docs/api/Brut/FrontEnd/Forms/Input/Color.html +0 -201
  485. data/docs/api/Brut/FrontEnd/Forms/Input/TimeOfDay.html +0 -535
  486. data/docs/api/Brut/FrontEnd/Forms/Input.html +0 -1567
  487. data/docs/api/Brut/FrontEnd/Forms/InputDeclarations.html +0 -635
  488. data/docs/api/Brut/FrontEnd/Forms/InputDefinition.html +0 -1336
  489. data/docs/api/Brut/FrontEnd/Forms/RadioButtonGroupInput.html +0 -730
  490. data/docs/api/Brut/FrontEnd/Forms/RadioButtonGroupInputDefinition.html +0 -587
  491. data/docs/api/Brut/FrontEnd/Forms/SelectInput.html +0 -734
  492. data/docs/api/Brut/FrontEnd/Forms/SelectInputDefinition.html +0 -582
  493. data/docs/api/Brut/FrontEnd/Forms/ValidityState.html +0 -659
  494. data/docs/api/Brut/FrontEnd/Forms.html +0 -127
  495. data/docs/api/Brut/FrontEnd/GenericResponse.html +0 -377
  496. data/docs/api/Brut/FrontEnd/Handler.html +0 -442
  497. data/docs/api/Brut/FrontEnd/Handlers/CspReportingHandler.html +0 -318
  498. data/docs/api/Brut/FrontEnd/Handlers/InstrumentationHandler/TraceParent.html +0 -336
  499. data/docs/api/Brut/FrontEnd/Handlers/InstrumentationHandler.html +0 -399
  500. data/docs/api/Brut/FrontEnd/Handlers/LocaleDetectionHandler.html +0 -354
  501. data/docs/api/Brut/FrontEnd/Handlers/MissingHandler/Form.html +0 -151
  502. data/docs/api/Brut/FrontEnd/Handlers/MissingHandler.html +0 -315
  503. data/docs/api/Brut/FrontEnd/Handlers.html +0 -125
  504. data/docs/api/Brut/FrontEnd/HandlingResults.html +0 -339
  505. data/docs/api/Brut/FrontEnd/HttpMethod.html +0 -661
  506. data/docs/api/Brut/FrontEnd/HttpStatus.html +0 -496
  507. data/docs/api/Brut/FrontEnd/InlineSvgLocator.html +0 -284
  508. data/docs/api/Brut/FrontEnd/Layout.html +0 -486
  509. data/docs/api/Brut/FrontEnd/Middleware.html +0 -135
  510. data/docs/api/Brut/FrontEnd/Middlewares/AnnotateBrutOwnedPaths.html +0 -288
  511. data/docs/api/Brut/FrontEnd/Middlewares/Favicon.html +0 -292
  512. data/docs/api/Brut/FrontEnd/Middlewares/OpenTelemetrySpan.html +0 -324
  513. data/docs/api/Brut/FrontEnd/Middlewares/ReloadApp.html +0 -376
  514. data/docs/api/Brut/FrontEnd/Middlewares.html +0 -125
  515. data/docs/api/Brut/FrontEnd/Page.html +0 -781
  516. data/docs/api/Brut/FrontEnd/Pages/MissingPage.html +0 -797
  517. data/docs/api/Brut/FrontEnd/Pages.html +0 -125
  518. data/docs/api/Brut/FrontEnd/RequestContext.html +0 -1312
  519. data/docs/api/Brut/FrontEnd/RouteHook.html +0 -424
  520. data/docs/api/Brut/FrontEnd/RouteHooks/AgeFlash.html +0 -242
  521. data/docs/api/Brut/FrontEnd/RouteHooks/CSPNoInlineScripts.html +0 -249
  522. data/docs/api/Brut/FrontEnd/RouteHooks/CSPNoInlineStylesOrScripts/ReportOnly.html +0 -264
  523. data/docs/api/Brut/FrontEnd/RouteHooks/CSPNoInlineStylesOrScripts.html +0 -261
  524. data/docs/api/Brut/FrontEnd/RouteHooks/LocaleDetection.html +0 -284
  525. data/docs/api/Brut/FrontEnd/RouteHooks/SetupRequestContext.html +0 -252
  526. data/docs/api/Brut/FrontEnd/RouteHooks.html +0 -115
  527. data/docs/api/Brut/FrontEnd/Routing/FormHandlerRoute.html +0 -227
  528. data/docs/api/Brut/FrontEnd/Routing/FormRoute.html +0 -305
  529. data/docs/api/Brut/FrontEnd/Routing/MissingForm.html +0 -324
  530. data/docs/api/Brut/FrontEnd/Routing/MissingHandler.html +0 -319
  531. data/docs/api/Brut/FrontEnd/Routing/MissingPage.html +0 -315
  532. data/docs/api/Brut/FrontEnd/Routing/MissingPath.html +0 -315
  533. data/docs/api/Brut/FrontEnd/Routing/PageRoute.html +0 -327
  534. data/docs/api/Brut/FrontEnd/Routing/Route.html +0 -761
  535. data/docs/api/Brut/FrontEnd/Routing.html +0 -927
  536. data/docs/api/Brut/FrontEnd/Session.html +0 -1195
  537. data/docs/api/Brut/FrontEnd.html +0 -134
  538. data/docs/api/Brut/I18n/BaseMethods.html +0 -931
  539. data/docs/api/Brut/I18n/ForBackEnd.html +0 -302
  540. data/docs/api/Brut/I18n/ForCLI.html +0 -302
  541. data/docs/api/Brut/I18n/ForHTML.html +0 -296
  542. data/docs/api/Brut/I18n/HTTPAcceptLanguage/AlwaysEnglish.html +0 -316
  543. data/docs/api/Brut/I18n/HTTPAcceptLanguage.html +0 -930
  544. data/docs/api/Brut/I18n.html +0 -127
  545. data/docs/api/Brut/Instrumentation/LoggerSpanExporter.html +0 -435
  546. data/docs/api/Brut/Instrumentation/Methods/ClassMethods.html +0 -596
  547. data/docs/api/Brut/Instrumentation/Methods.html +0 -173
  548. data/docs/api/Brut/Instrumentation/OpenTelemetry/NormalizedAttributes.html +0 -286
  549. data/docs/api/Brut/Instrumentation/OpenTelemetry/Span.html +0 -302
  550. data/docs/api/Brut/Instrumentation/OpenTelemetry.html +0 -866
  551. data/docs/api/Brut/Instrumentation.html +0 -128
  552. data/docs/api/Brut/RubocopConfig.html +0 -237
  553. data/docs/api/Brut/SinatraHelpers/ClassMethods.html +0 -534
  554. data/docs/api/Brut/SinatraHelpers.html +0 -281
  555. data/docs/api/Brut/SpecSupport/ClockSupport.html +0 -383
  556. data/docs/api/Brut/SpecSupport/ComponentSupport.html +0 -496
  557. data/docs/api/Brut/SpecSupport/E2ETestServer.html +0 -503
  558. data/docs/api/Brut/SpecSupport/E2eSupport.html +0 -142
  559. data/docs/api/Brut/SpecSupport/EnhancedNode.html +0 -403
  560. data/docs/api/Brut/SpecSupport/FlashSupport.html +0 -278
  561. data/docs/api/Brut/SpecSupport/GeneralSupport/ClassMethods.html +0 -401
  562. data/docs/api/Brut/SpecSupport/GeneralSupport.html +0 -195
  563. data/docs/api/Brut/SpecSupport/HandlerSupport.html +0 -160
  564. data/docs/api/Brut/SpecSupport/Matchers/BeABug.html +0 -142
  565. data/docs/api/Brut/SpecSupport/Matchers/BePageFor.html +0 -142
  566. data/docs/api/Brut/SpecSupport/Matchers/BeRoutingFor.html +0 -155
  567. data/docs/api/Brut/SpecSupport/Matchers/HaveConstraintViolation.html +0 -583
  568. data/docs/api/Brut/SpecSupport/Matchers/HaveGenerated.html +0 -149
  569. data/docs/api/Brut/SpecSupport/Matchers/HaveHTMLAttribute.html +0 -466
  570. data/docs/api/Brut/SpecSupport/Matchers/HaveI18nString.html +0 -149
  571. data/docs/api/Brut/SpecSupport/Matchers/HaveLinkTo.html +0 -149
  572. data/docs/api/Brut/SpecSupport/Matchers/HaveRedirectedTo.html +0 -165
  573. data/docs/api/Brut/SpecSupport/Matchers/HaveReturnedHttpStatus.html +0 -158
  574. data/docs/api/Brut/SpecSupport/Matchers/HaveReturnedRackResponse.html +0 -156
  575. data/docs/api/Brut/SpecSupport/Matchers.html +0 -125
  576. data/docs/api/Brut/SpecSupport/RSpecSetup/OptionalSidekiqSupport.html +0 -335
  577. data/docs/api/Brut/SpecSupport/RSpecSetup.html +0 -637
  578. data/docs/api/Brut/SpecSupport/SessionSupport.html +0 -196
  579. data/docs/api/Brut/SpecSupport.html +0 -129
  580. data/docs/api/Brut/TUI/AnsiEscapeCode/Mod.html +0 -409
  581. data/docs/api/Brut/TUI/AnsiEscapeCode.html +0 -426
  582. data/docs/api/Brut/TUI/EventLoop/Deque.html +0 -531
  583. data/docs/api/Brut/TUI/EventLoop.html +0 -676
  584. data/docs/api/Brut/TUI/Events/BaseEvent.html +0 -449
  585. data/docs/api/Brut/TUI/Events/EventBus.html +0 -485
  586. data/docs/api/Brut/TUI/Events/EventLoopStarted.html +0 -211
  587. data/docs/api/Brut/TUI/Events/Exception.html +0 -523
  588. data/docs/api/Brut/TUI/Events/Tick.html +0 -294
  589. data/docs/api/Brut/TUI/Events.html +0 -131
  590. data/docs/api/Brut/TUI/MarkupString.html +0 -537
  591. data/docs/api/Brut/TUI/Script/BlockStep.html +0 -300
  592. data/docs/api/Brut/TUI/Script/Events/CommandExecutionFailed.html +0 -252
  593. data/docs/api/Brut/TUI/Script/Events/CommandExecutionSucceeded.html +0 -163
  594. data/docs/api/Brut/TUI/Script/Events/CommandStdErr.html +0 -163
  595. data/docs/api/Brut/TUI/Script/Events/CommandStdOut.html +0 -300
  596. data/docs/api/Brut/TUI/Script/Events/ExecutingCommand.html +0 -298
  597. data/docs/api/Brut/TUI/Script/Events/Message.html +0 -345
  598. data/docs/api/Brut/TUI/Script/Events/PhaseCompleted.html +0 -229
  599. data/docs/api/Brut/TUI/Script/Events/PhaseStarted.html +0 -350
  600. data/docs/api/Brut/TUI/Script/Events/ScriptCompleted.html +0 -282
  601. data/docs/api/Brut/TUI/Script/Events/ScriptStarted.html +0 -343
  602. data/docs/api/Brut/TUI/Script/Events/StepCompleted.html +0 -163
  603. data/docs/api/Brut/TUI/Script/Events/StepStarted.html +0 -346
  604. data/docs/api/Brut/TUI/Script/Events.html +0 -115
  605. data/docs/api/Brut/TUI/Script/ExecStep/ProcessStatusFailed.html +0 -210
  606. data/docs/api/Brut/TUI/Script/ExecStep.html +0 -493
  607. data/docs/api/Brut/TUI/Script/LoggingSubscriber.html +0 -914
  608. data/docs/api/Brut/TUI/Script/PutsSubscriber.html +0 -783
  609. data/docs/api/Brut/TUI/Script/Step.html +0 -313
  610. data/docs/api/Brut/TUI/Script.html +0 -1250
  611. data/docs/api/Brut/TUI/Terminal.html +0 -593
  612. data/docs/api/Brut/TUI/TerminalTheme.html +0 -1403
  613. data/docs/api/Brut/TUI/Themes/Dark.html +0 -706
  614. data/docs/api/Brut/TUI/Themes/Light.html +0 -804
  615. data/docs/api/Brut/TUI/Themes/None.html +0 -218
  616. data/docs/api/Brut/TUI/Themes.html +0 -115
  617. data/docs/api/Brut/TUI.html +0 -129
  618. data/docs/api/Brut.html +0 -341
  619. data/docs/api/Clock.html +0 -603
  620. data/docs/api/ModuleName.html +0 -595
  621. data/docs/api/RichString.html +0 -775
  622. data/docs/api/SemanticLogger/Appender/Async.html +0 -219
  623. data/docs/api/Sequel/Extensions/BrutInstrumentation.html +0 -119
  624. data/docs/api/Sequel/Extensions/BrutMigrations.html +0 -541
  625. data/docs/api/Sequel/Extensions.html +0 -117
  626. data/docs/api/Sequel/Plugins/CreatedAt/InstanceMethods.html +0 -105
  627. data/docs/api/Sequel/Plugins/CreatedAt.html +0 -125
  628. data/docs/api/Sequel/Plugins/ExternalId/ClassMethods.html +0 -207
  629. data/docs/api/Sequel/Plugins/ExternalId/InstanceMethods.html +0 -186
  630. data/docs/api/Sequel/Plugins/ExternalId.html +0 -218
  631. data/docs/api/Sequel/Plugins/FindBang/ClassMethods.html +0 -202
  632. data/docs/api/Sequel/Plugins/FindBang.html +0 -125
  633. data/docs/api/Sequel/Plugins.html +0 -117
  634. data/docs/api/Sequel.html +0 -117
  635. data/docs/api/SpecSupport/Matchers/BeABug.html +0 -143
  636. data/docs/api/_index.html +0 -1964
  637. data/docs/api/class_list.html +0 -54
  638. data/docs/api/css/common.css +0 -1
  639. data/docs/api/css/full_list.css +0 -59
  640. data/docs/api/css/style.css +0 -504
  641. data/docs/api/file.README.html +0 -172
  642. data/docs/api/file_list.html +0 -59
  643. data/docs/api/frames.html +0 -22
  644. data/docs/api/index.html +0 -172
  645. data/docs/api/js/app.js +0 -344
  646. data/docs/api/js/full_list.js +0 -242
  647. data/docs/api/js/jquery.js +0 -4
  648. data/docs/api/method_list.html +0 -5542
  649. data/docs/api/top-level-namespace.html +0 -112
  650. data/docs/assets/02-confirmation-dialog-browser-element-styled.3NEGM20-.png +0 -0
  651. data/docs/assets/02-confirmation-dialog-browser-element.DPsf0xUW.png +0 -0
  652. data/docs/assets/02-confirmation-dialog-browser.DH8ALFO4.png +0 -0
  653. data/docs/assets/02-confirmation-flow.D9gZ0S5U.png +0 -0
  654. data/docs/assets/DevEnvironment.DaFcVfwP.png +0 -0
  655. data/docs/assets/LogoStop.Gb3tDhL1.png +0 -0
  656. data/docs/assets/OverviewMetro.DUS-5fUZ.png +0 -0
  657. data/docs/assets/adrs.md.YglbWtQe.js +0 -1
  658. data/docs/assets/adrs.md.YglbWtQe.lean.js +0 -1
  659. data/docs/assets/ai.md.ChLnvDAX.js +0 -1
  660. data/docs/assets/ai.md.ChLnvDAX.lean.js +0 -1
  661. data/docs/assets/app.B8jAEB7R.js +0 -1
  662. data/docs/assets/assets.md.BEF6Oz6K.js +0 -19
  663. data/docs/assets/assets.md.BEF6Oz6K.lean.js +0 -1
  664. data/docs/assets/basic-form-with-violations.Cv6Y9-Q_.png +0 -0
  665. data/docs/assets/basic-form.DbHnu0oW.png +0 -0
  666. data/docs/assets/brut-js.md.BMz0X1Rz.js +0 -12
  667. data/docs/assets/brut-js.md.BMz0X1Rz.lean.js +0 -1
  668. data/docs/assets/business-logic.md.DbuaOYGU.js +0 -1
  669. data/docs/assets/business-logic.md.DbuaOYGU.lean.js +0 -1
  670. data/docs/assets/chunks/@localSearchIndexroot.DJ8mocCj.js +0 -1
  671. data/docs/assets/chunks/VPLocalSearchBox.gF-Po_fz.js +0 -8
  672. data/docs/assets/chunks/framework.C4nOkCZI.js +0 -18
  673. data/docs/assets/chunks/theme.BjPAOJkz.js +0 -2
  674. data/docs/assets/cli.md.DDMar_51.js +0 -122
  675. data/docs/assets/cli.md.DDMar_51.lean.js +0 -1
  676. data/docs/assets/components.md.Ber8UBM0.js +0 -96
  677. data/docs/assets/components.md.Ber8UBM0.lean.js +0 -1
  678. data/docs/assets/configuration.md.DrJ6YVoZ.js +0 -78
  679. data/docs/assets/configuration.md.DrJ6YVoZ.lean.js +0 -1
  680. data/docs/assets/css.md.K5rOCOQY.js +0 -21
  681. data/docs/assets/css.md.K5rOCOQY.lean.js +0 -1
  682. data/docs/assets/custom-element-tests.md.DiLe-eFw.js +0 -69
  683. data/docs/assets/custom-element-tests.md.DiLe-eFw.lean.js +0 -1
  684. data/docs/assets/database-access.md.Dc8l2Plf.js +0 -63
  685. data/docs/assets/database-access.md.Dc8l2Plf.lean.js +0 -1
  686. data/docs/assets/database-schema.md.BJ_JhXmO.js +0 -70
  687. data/docs/assets/database-schema.md.BJ_JhXmO.lean.js +0 -1
  688. data/docs/assets/deployment.md.CHTx2eTR.js +0 -55
  689. data/docs/assets/deployment.md.CHTx2eTR.lean.js +0 -1
  690. data/docs/assets/dev-env-protocol.DysDAtnz.png +0 -0
  691. data/docs/assets/dev-environment.md.B1S9p5ZK.js +0 -16
  692. data/docs/assets/dev-environment.md.B1S9p5ZK.lean.js +0 -1
  693. data/docs/assets/dir-structure.md.D1T2kGwj.js +0 -46
  694. data/docs/assets/dir-structure.md.D1T2kGwj.lean.js +0 -1
  695. data/docs/assets/doc-conventions.md.CDnWaEFg.js +0 -1
  696. data/docs/assets/doc-conventions.md.CDnWaEFg.lean.js +0 -1
  697. data/docs/assets/end-to-end-tests.md.BJJdNDYL.js +0 -28
  698. data/docs/assets/end-to-end-tests.md.BJJdNDYL.lean.js +0 -1
  699. data/docs/assets/features.md.BDWxnyNO.js +0 -154
  700. data/docs/assets/features.md.BDWxnyNO.lean.js +0 -1
  701. data/docs/assets/flash-and-session.md.CUsMxoNl.js +0 -79
  702. data/docs/assets/flash-and-session.md.CUsMxoNl.lean.js +0 -1
  703. data/docs/assets/form-constraints.md.KlfXSKm2.js +0 -90
  704. data/docs/assets/form-constraints.md.KlfXSKm2.lean.js +0 -1
  705. data/docs/assets/forms.md.RK0zkhm0.js +0 -64
  706. data/docs/assets/forms.md.RK0zkhm0.lean.js +0 -1
  707. data/docs/assets/getting-started.md.CGJ44juQ.js +0 -31
  708. data/docs/assets/getting-started.md.CGJ44juQ.lean.js +0 -1
  709. data/docs/assets/handlers.md.C5tUwmmo.js +0 -54
  710. data/docs/assets/handlers.md.C5tUwmmo.lean.js +0 -1
  711. data/docs/assets/hooks.md.CoiYCKRc.js +0 -80
  712. data/docs/assets/hooks.md.CoiYCKRc.lean.js +0 -1
  713. data/docs/assets/i18n.md.DxkCKhUw.js +0 -23
  714. data/docs/assets/i18n.md.DxkCKhUw.lean.js +0 -1
  715. data/docs/assets/index.md.DnphWyQd.js +0 -1
  716. data/docs/assets/index.md.DnphWyQd.lean.js +0 -1
  717. data/docs/assets/initial-home-page.DNIaYmgP.png +0 -0
  718. data/docs/assets/instrumentation.md.BcxjC4jd.js +0 -90
  719. data/docs/assets/instrumentation.md.BcxjC4jd.lean.js +0 -1
  720. data/docs/assets/javascript.md.D6fxhaQb.js +0 -31
  721. data/docs/assets/javascript.md.D6fxhaQb.lean.js +0 -1
  722. data/docs/assets/jobs.md.Bi3qb3v6.js +0 -25
  723. data/docs/assets/jobs.md.Bi3qb3v6.lean.js +0 -1
  724. data/docs/assets/keyword-injection.md.CqLnnzIz.js +0 -21
  725. data/docs/assets/keyword-injection.md.CqLnnzIz.lean.js +0 -1
  726. data/docs/assets/layouts.md.HEbeK7Jr.js +0 -68
  727. data/docs/assets/layouts.md.HEbeK7Jr.lean.js +0 -1
  728. data/docs/assets/lsp.md.bE9dW8n9.js +0 -1
  729. data/docs/assets/lsp.md.bE9dW8n9.lean.js +0 -1
  730. data/docs/assets/markdown-examples.md.BPmtHlc-.js +0 -33
  731. data/docs/assets/markdown-examples.md.BPmtHlc-.lean.js +0 -1
  732. data/docs/assets/middleware.md.BhOIsg59.js +0 -20
  733. data/docs/assets/middleware.md.BhOIsg59.lean.js +0 -1
  734. data/docs/assets/new-post-editor.DrHr-5oh.png +0 -0
  735. data/docs/assets/new-post-home-page.Bm34lyMg.png +0 -0
  736. data/docs/assets/overview.md.BpWAgPFH.js +0 -1
  737. data/docs/assets/overview.md.BpWAgPFH.lean.js +0 -1
  738. data/docs/assets/pages.md.B3sQXpEd.js +0 -45
  739. data/docs/assets/pages.md.B3sQXpEd.lean.js +0 -1
  740. data/docs/assets/recipes_alternate-layouts.md.C1QzVkA7.js +0 -22
  741. data/docs/assets/recipes_alternate-layouts.md.C1QzVkA7.lean.js +0 -1
  742. data/docs/assets/recipes_authentication.md.CyvoIW82.js +0 -157
  743. data/docs/assets/recipes_authentication.md.CyvoIW82.lean.js +0 -1
  744. data/docs/assets/recipes_custom-flash.md.6gFqf2uL.js +0 -26
  745. data/docs/assets/recipes_custom-flash.md.6gFqf2uL.lean.js +0 -1
  746. data/docs/assets/recipes_dev-env-secrets.md.DC_jVY9U.js +0 -12
  747. data/docs/assets/recipes_dev-env-secrets.md.DC_jVY9U.lean.js +0 -1
  748. data/docs/assets/recipes_form-errors.md.B5ptSzMO.js +0 -66
  749. data/docs/assets/recipes_form-errors.md.B5ptSzMO.lean.js +0 -1
  750. data/docs/assets/recipes_indexed-forms.md.BYYQGW2C.js +0 -74
  751. data/docs/assets/recipes_indexed-forms.md.BYYQGW2C.lean.js +0 -1
  752. data/docs/assets/recipes_migrations.md.Cid7-3cu.js +0 -97
  753. data/docs/assets/recipes_migrations.md.Cid7-3cu.lean.js +0 -1
  754. data/docs/assets/recipes_text-field-component.md.VhOsCtKI.js +0 -101
  755. data/docs/assets/recipes_text-field-component.md.VhOsCtKI.lean.js +0 -1
  756. data/docs/assets/roadmap.md.DqC1Y7Zt.js +0 -1
  757. data/docs/assets/roadmap.md.DqC1Y7Zt.lean.js +0 -1
  758. data/docs/assets/routes.md.C1dgIBtD.js +0 -21
  759. data/docs/assets/routes.md.C1dgIBtD.lean.js +0 -1
  760. data/docs/assets/security.md.Jn4SY1uK.js +0 -1
  761. data/docs/assets/security.md.Jn4SY1uK.lean.js +0 -1
  762. data/docs/assets/seed-data.md.UZW0WxYN.js +0 -14
  763. data/docs/assets/seed-data.md.UZW0WxYN.lean.js +0 -1
  764. data/docs/assets/spa.qejUdp-5.png +0 -0
  765. data/docs/assets/space-time-continuum.md.D9rYGDFH.js +0 -1
  766. data/docs/assets/space-time-continuum.md.D9rYGDFH.lean.js +0 -1
  767. data/docs/assets/style.B1z60PPQ.css +0 -1
  768. data/docs/assets/styled-form-with-server-side-violations.Bjxd8Dpv.png +0 -0
  769. data/docs/assets/styled-form-with-violations.Bv_sa9tg.png +0 -0
  770. data/docs/assets/styled-home-page-with-posts.Dd4kG89D.png +0 -0
  771. data/docs/assets/styled-home-page.BzdI7dWz.png +0 -0
  772. data/docs/assets/tutorial.md.BX6f6l00.js +0 -27
  773. data/docs/assets/tutorial.md.BX6f6l00.lean.js +0 -1
  774. data/docs/assets/tutorials_01-intro.md.CzZ3kpF_.js +0 -708
  775. data/docs/assets/tutorials_01-intro.md.CzZ3kpF_.lean.js +0 -1
  776. data/docs/assets/tutorials_02-dialog.md.DE5WfCXI.js +0 -274
  777. data/docs/assets/tutorials_02-dialog.md.DE5WfCXI.lean.js +0 -1
  778. data/docs/assets/unit-tests.md.vDsdBbO_.js +0 -13
  779. data/docs/assets/unit-tests.md.vDsdBbO_.lean.js +0 -1
  780. data/docs/assets/welcome-to-brut.VSWzl17-.png +0 -0
  781. data/docs/assets/why.md.4WpxdrQ2.js +0 -1
  782. data/docs/assets/why.md.4WpxdrQ2.lean.js +0 -1
  783. data/docs/assets/workspace-protocol.C0gXsoDb.png +0 -0
  784. data/docs/assets.html +0 -47
  785. data/docs/brut-css/brut.css +0 -1
  786. data/docs/brut-css/brut.max.css +0 -22372
  787. data/docs/brut-css/classes/appearances.html +0 -783
  788. data/docs/brut-css/classes/background-colors.html +0 -3529
  789. data/docs/brut-css/classes/border-colors.html +0 -3529
  790. data/docs/brut-css/classes/borders.html +0 -2293
  791. data/docs/brut-css/classes/dimensions.html +0 -2581
  792. data/docs/brut-css/classes/flex.html +0 -917
  793. data/docs/brut-css/classes/foreground-colors.html +0 -3261
  794. data/docs/brut-css/classes/junk-drawer.html +0 -431
  795. data/docs/brut-css/classes/layout.html +0 -668
  796. data/docs/brut-css/classes/lists.html +0 -331
  797. data/docs/brut-css/classes/positioning.html +0 -1751
  798. data/docs/brut-css/classes/spacings.html +0 -2633
  799. data/docs/brut-css/classes/typography.html +0 -2206
  800. data/docs/brut-css/customization/advanced-configuration.html +0 -204
  801. data/docs/brut-css/customization/breakpoints.html +0 -227
  802. data/docs/brut-css/customization/design-system.html +0 -197
  803. data/docs/brut-css/customization/pseudo-classes.html +0 -228
  804. data/docs/brut-css/docs.css +0 -98
  805. data/docs/brut-css/getting-started/core-concepts.html +0 -234
  806. data/docs/brut-css/getting-started/installation.html +0 -190
  807. data/docs/brut-css/getting-started/overview.html +0 -210
  808. data/docs/brut-css/getting-started/simple-example.html +0 -285
  809. data/docs/brut-css/index.html +0 -193
  810. data/docs/brut-css/prism-twilight.min.css +0 -1
  811. data/docs/brut-css/properties/colors.html +0 -1548
  812. data/docs/brut-css/properties/spacings.html +0 -614
  813. data/docs/brut-css/properties/typography.html +0 -777
  814. data/docs/brut-js/api/AjaxSubmit.html +0 -452
  815. data/docs/brut-js/api/AjaxSubmit.js.html +0 -550
  816. data/docs/brut-js/api/Autosubmit.html +0 -192
  817. data/docs/brut-js/api/Autosubmit.js.html +0 -114
  818. data/docs/brut-js/api/BaseCustomElement.html +0 -1091
  819. data/docs/brut-js/api/BaseCustomElement.js.html +0 -312
  820. data/docs/brut-js/api/BrutCustomElements.html +0 -172
  821. data/docs/brut-js/api/BufferedLogger.html +0 -173
  822. data/docs/brut-js/api/ConfirmSubmit.html +0 -286
  823. data/docs/brut-js/api/ConfirmSubmit.js.html +0 -188
  824. data/docs/brut-js/api/ConfirmationDialog.html +0 -425
  825. data/docs/brut-js/api/ConfirmationDialog.js.html +0 -194
  826. data/docs/brut-js/api/ConstraintViolationMessage.html +0 -498
  827. data/docs/brut-js/api/ConstraintViolationMessage.js.html +0 -191
  828. data/docs/brut-js/api/ConstraintViolationMessages.html +0 -590
  829. data/docs/brut-js/api/ConstraintViolationMessages.js.html +0 -149
  830. data/docs/brut-js/api/CopyToClipboard.html +0 -345
  831. data/docs/brut-js/api/CopyToClipboard.js.html +0 -147
  832. data/docs/brut-js/api/Form.html +0 -291
  833. data/docs/brut-js/api/Form.js.html +0 -198
  834. data/docs/brut-js/api/I18nTranslation.html +0 -409
  835. data/docs/brut-js/api/I18nTranslation.js.html +0 -115
  836. data/docs/brut-js/api/LocaleDetection.html +0 -312
  837. data/docs/brut-js/api/LocaleDetection.js.html +0 -168
  838. data/docs/brut-js/api/Logger.html +0 -702
  839. data/docs/brut-js/api/Logger.js.html +0 -141
  840. data/docs/brut-js/api/Message.html +0 -238
  841. data/docs/brut-js/api/Message.js.html +0 -113
  842. data/docs/brut-js/api/PrefixedLogger.html +0 -369
  843. data/docs/brut-js/api/RichString.html +0 -1049
  844. data/docs/brut-js/api/RichString.js.html +0 -167
  845. data/docs/brut-js/api/Tabs.html +0 -295
  846. data/docs/brut-js/api/Tabs.js.html +0 -219
  847. data/docs/brut-js/api/Toast.html +0 -270
  848. data/docs/brut-js/api/Toast.js.html +0 -153
  849. data/docs/brut-js/api/Tracing.html +0 -277
  850. data/docs/brut-js/api/Tracing.js.html +0 -298
  851. data/docs/brut-js/api/external-CustomElementRegistry.html +0 -140
  852. data/docs/brut-js/api/external-Performance.html +0 -138
  853. data/docs/brut-js/api/external-Promise.html +0 -138
  854. data/docs/brut-js/api/external-ValidityState.html +0 -138
  855. data/docs/brut-js/api/external-Window.html +0 -233
  856. data/docs/brut-js/api/external-fetch.html +0 -138
  857. data/docs/brut-js/api/global.html +0 -400
  858. data/docs/brut-js/api/index.html +0 -168
  859. data/docs/brut-js/api/index.js.html +0 -184
  860. data/docs/brut-js/api/module-testing.html +0 -383
  861. data/docs/brut-js/api/scripts/linenumber.js +0 -25
  862. data/docs/brut-js/api/scripts/prettify/Apache-License-2.0.txt +0 -202
  863. data/docs/brut-js/api/scripts/prettify/lang-css.js +0 -2
  864. data/docs/brut-js/api/scripts/prettify/prettify.js +0 -28
  865. data/docs/brut-js/api/styles/jsdoc-default.css +0 -327
  866. data/docs/brut-js/api/styles/prettify-jsdoc.css +0 -111
  867. data/docs/brut-js/api/styles/prettify-tomorrow.css +0 -132
  868. data/docs/brut-js/api/testing.AssetMetadata.html +0 -172
  869. data/docs/brut-js/api/testing.AssetMetadataLoader.html +0 -171
  870. data/docs/brut-js/api/testing.CustomElementTest.html +0 -679
  871. data/docs/brut-js/api/testing.DOMCreator.html +0 -171
  872. data/docs/brut-js/api/testing_AssetMetadata.js.html +0 -86
  873. data/docs/brut-js/api/testing_AssetMetadataLoader.js.html +0 -76
  874. data/docs/brut-js/api/testing_CustomElementTest.js.html +0 -286
  875. data/docs/brut-js/api/testing_DOMCreator.js.html +0 -96
  876. data/docs/brut-js/api/testing_index.js.html +0 -99
  877. data/docs/brut-js.html +0 -40
  878. data/docs/business-logic.html +0 -29
  879. data/docs/cli.html +0 -150
  880. data/docs/components.html +0 -124
  881. data/docs/configuration.html +0 -106
  882. data/docs/css.html +0 -49
  883. data/docs/custom-element-tests.html +0 -97
  884. data/docs/database-access.html +0 -91
  885. data/docs/database-schema.html +0 -98
  886. data/docs/deployment.html +0 -83
  887. data/docs/dev-environment.html +0 -44
  888. data/docs/dir-structure.html +0 -74
  889. data/docs/doc-conventions.html +0 -29
  890. data/docs/end-to-end-tests.html +0 -56
  891. data/docs/favicon.ico +0 -0
  892. data/docs/features.html +0 -182
  893. data/docs/flash-and-session.html +0 -107
  894. data/docs/form-constraints.html +0 -118
  895. data/docs/forms.html +0 -92
  896. data/docs/getting-started.html +0 -59
  897. data/docs/handlers.html +0 -82
  898. data/docs/hashmap.json +0 -1
  899. data/docs/hooks.html +0 -108
  900. data/docs/i18n.html +0 -51
  901. data/docs/index.html +0 -29
  902. data/docs/instrumentation.html +0 -118
  903. data/docs/javascript.html +0 -59
  904. data/docs/jobs.html +0 -53
  905. data/docs/keyword-injection.html +0 -49
  906. data/docs/layouts.html +0 -96
  907. data/docs/lsp.html +0 -29
  908. data/docs/markdown-examples.html +0 -61
  909. data/docs/middleware.html +0 -48
  910. data/docs/overview.html +0 -29
  911. data/docs/pages.html +0 -73
  912. data/docs/recipes/alternate-layouts.html +0 -50
  913. data/docs/recipes/authentication.html +0 -185
  914. data/docs/recipes/custom-flash.html +0 -54
  915. data/docs/recipes/dev-env-secrets.html +0 -40
  916. data/docs/recipes/form-errors.html +0 -94
  917. data/docs/recipes/indexed-forms.html +0 -102
  918. data/docs/recipes/migrations.html +0 -125
  919. data/docs/recipes/text-field-component.html +0 -129
  920. data/docs/roadmap.html +0 -29
  921. data/docs/routes.html +0 -49
  922. data/docs/security.html +0 -29
  923. data/docs/seed-data.html +0 -42
  924. data/docs/space-time-continuum.html +0 -29
  925. data/docs/tutorial.html +0 -55
  926. data/docs/tutorials/01-intro.html +0 -736
  927. data/docs/tutorials/02-dialog.html +0 -302
  928. data/docs/unit-tests.html +0 -41
  929. data/docs/vp-icons.css +0 -1
  930. data/docs/why.html +0 -29
  931. data/docs-todo.md +0 -32
  932. data/dx/bash_customizations +0 -6
  933. data/dx/build +0 -73
  934. data/dx/build.pre +0 -15
  935. data/dx/docker-compose.env +0 -22
  936. data/dx/dx.sh.lib +0 -24
  937. data/dx/exec +0 -75
  938. data/dx/setupkit.sh.lib +0 -144
  939. data/dx/show-help-in-app-container-then-wait.sh +0 -38
  940. data/lib/brut/cli/app.rb +0 -238
  941. data/lib/brut/cli/app_runner.rb +0 -252
  942. data/lib/brut/cli/command.rb +0 -258
  943. data/lib/brut/cli/execution_results.rb +0 -119
  944. data/lib/brut/front_end/layouts/_internal.html.erb +0 -68
  945. data/lib/brut/front_end/pages/_missing_page.html.erb +0 -17
  946. data/mkbrut/.gitignore +0 -16
  947. data/mkbrut/CODE_OF_CONDUCT.txt +0 -100
  948. data/mkbrut/Gemfile +0 -3
  949. data/mkbrut/Gemfile.lock +0 -20
  950. data/mkbrut/LICENSE.txt +0 -370
  951. data/mkbrut/README.md +0 -145
  952. data/mkbrut/Rakefile +0 -2
  953. data/mkbrut/bin/build +0 -36
  954. data/mkbrut/bin/ci +0 -19
  955. data/mkbrut/bin/docs +0 -19
  956. data/mkbrut/bin/publish +0 -129
  957. data/mkbrut/bin/rake +0 -16
  958. data/mkbrut/bin/setup +0 -30
  959. data/mkbrut/brut-welcome.png +0 -0
  960. data/mkbrut/deploy/.dockerignore +0 -2
  961. data/mkbrut/deploy/Dockerfile +0 -25
  962. data/mkbrut/dx +0 -1
  963. data/mkbrut/exe/mkbrut +0 -5
  964. data/mkbrut/lib/mkbrut/app_name.rb +0 -29
  965. data/mkbrut/lib/mkbrut/app_options.rb +0 -36
  966. data/mkbrut/lib/mkbrut/cli.rb +0 -189
  967. data/mkbrut/lib/mkbrut/erb_binding_delegate.rb +0 -20
  968. data/mkbrut/lib/mkbrut/ops.rb +0 -17
  969. data/mkbrut/lib/mkbrut/organization.rb +0 -5
  970. data/mkbrut/lib/mkbrut/segments.rb +0 -8
  971. data/mkbrut/lib/mkbrut/version.rb +0 -3
  972. data/mkbrut/lib/mkbrut.rb +0 -20
  973. data/mkbrut/mkbrut.gemspec +0 -34
  974. data/mkbrut/templates/Base/app/src/front_end/images/LogoPylon.png +0 -0
  975. data/mkbrut/templates/Base/bin/build-assets +0 -7
  976. data/mkbrut/templates/Base/bin/ci +0 -39
  977. data/mkbrut/templates/Base/bin/db +0 -9
  978. data/mkbrut/templates/Base/bin/scaffold +0 -9
  979. data/mkbrut/templates/Base/bin/setup +0 -287
  980. data/mkbrut/templates/Base/bin/test +0 -9
  981. data/mkbrut/templates/Base/bin/test-server +0 -29
  982. data/mkbrut/templates/Base/dx/prune +0 -19
  983. data/mkbrut/templates/Base/dx/start +0 -30
  984. data/mkbrut/templates/Base/dx/stop +0 -23
  985. data/mkbrut/templates/segments/Heroku/deploy/heroku_config.rb +0 -27
  986. data/specs/brut/front_end/forms/input.spec.rb +0 -978
  987. data/specs/brut/front_end/forms/radio_button_group_input.spec.rb +0 -54
  988. data/specs/brut/front_end/forms/select_input.spec.rb +0 -54
  989. data/specs/brut/instrumentation/methods.spec.rb +0 -399
  990. data/specs/brut/junk_drawer.spec.rb +0 -79
  991. data/specs/brut/tui/ansi_escape_code.spec.rb +0 -30
  992. data/specs/brut/tui/event_loop.spec.rb +0 -70
  993. data/specs/brut/tui/events/base_event.spec.rb +0 -26
  994. data/specs/brut/tui/events/event_bus.spec.rb +0 -141
  995. data/specs/brut/tui/events/exception.spec.rb +0 -19
  996. data/specs/brut/tui/events/test_event.rb +0 -5
  997. data/specs/spec_helper.rb +0 -31
  998. data/specs/support/matchers/have_constraint_violation.rb +0 -23
  999. data/specs/support/matchers.rb +0 -5
  1000. data/specs/support.rb +0 -3
  1001. /data/{mkbrut/lib/mkbrut → lib/brut/cli/apps/new}/prefixed_io.rb +0 -0
  1002. /data/{mkbrut/templates → templates}/Base/.dockerignore +0 -0
  1003. /data/{mkbrut/templates → templates}/Base/.env.development.erb +0 -0
  1004. /data/{mkbrut/templates → templates}/Base/.env.test.erb +0 -0
  1005. /data/{mkbrut/templates → templates}/Base/.gitignore +0 -0
  1006. /data/{mkbrut/templates → templates}/Base/.projections.json +0 -0
  1007. /data/{mkbrut/templates → templates}/Base/Dockerfile.dx +0 -0
  1008. /data/{mkbrut/templates → templates}/Base/Gemfile.erb +0 -0
  1009. /data/{mkbrut/templates → templates}/Base/Procfile.development +0 -0
  1010. /data/{mkbrut/templates → templates}/Base/Procfile.test +0 -0
  1011. /data/{mkbrut/templates → templates}/Base/README.md +0 -0
  1012. /data/{mkbrut/templates → templates}/Base/README.md.erb +0 -0
  1013. /data/{mkbrut/templates → templates}/Base/app/bootstrap.rb +0 -0
  1014. /data/{mkbrut/templates → templates}/Base/app/config/i18n/en/1_defaults.rb +0 -0
  1015. /data/{mkbrut/templates → templates}/Base/app/config/i18n/en/2_app.rb +0 -0
  1016. /data/{mkbrut/templates → templates}/Base/app/public/static/manifest.json.erb +0 -0
  1017. /data/{mkbrut/templates → templates}/Base/app/src/app.rb.erb +0 -0
  1018. /data/{mkbrut/templates → templates}/Base/app/src/back_end/data_models/app_data_model.rb +0 -0
  1019. /data/{mkbrut/templates → templates}/Base/app/src/back_end/data_models/db.rb +0 -0
  1020. /data/{mkbrut/templates → templates}/Base/app/src/back_end/data_models/migrations/20240101130000_citext.rb +0 -0
  1021. /data/{mkbrut/templates → templates}/Base/app/src/back_end/data_models/seed/seed_data.rb +0 -0
  1022. /data/{mkbrut/templates → templates}/Base/app/src/front_end/components/app_component.rb +0 -0
  1023. /data/{mkbrut/templates → templates}/Base/app/src/front_end/components/custom_element_registration.rb.erb +0 -0
  1024. /data/{mkbrut/templates → templates}/Base/app/src/front_end/css/index.css +0 -0
  1025. /data/{mkbrut/templates → templates}/Base/app/src/front_end/css/svgs.css +0 -0
  1026. /data/{mkbrut/templates → templates}/Base/app/src/front_end/forms/app_form.rb +0 -0
  1027. /data/{mkbrut/templates → templates}/Base/app/src/front_end/handlers/app_handler.rb +0 -0
  1028. /data/{brutrb.com → templates/Base/app/src/front_end}/images/LogoPylon.png +0 -0
  1029. /data/{mkbrut/templates → templates}/Base/app/src/front_end/images/LogoTransit.png +0 -0
  1030. /data/{mkbrut/templates → templates}/Base/app/src/front_end/images/apple-touch-icon-120x120.png +0 -0
  1031. /data/{mkbrut/templates → templates}/Base/app/src/front_end/images/apple-touch-icon-152x152.png +0 -0
  1032. /data/{mkbrut/templates → templates}/Base/app/src/front_end/images/apple-touch-icon-167x167.png +0 -0
  1033. /data/{mkbrut/templates → templates}/Base/app/src/front_end/images/apple-touch-icon-180x180.png +0 -0
  1034. /data/{mkbrut/templates → templates}/Base/app/src/front_end/images/favicon.ico +0 -0
  1035. /data/{mkbrut/templates → templates}/Base/app/src/front_end/images/icon.png +0 -0
  1036. /data/{mkbrut/templates → templates}/Base/app/src/front_end/images/mkicons.sh +0 -0
  1037. /data/{mkbrut/templates → templates}/Base/app/src/front_end/js/index.js +0 -0
  1038. /data/{mkbrut/templates → templates}/Base/app/src/front_end/layouts/blank_layout.rb +0 -0
  1039. /data/{mkbrut/templates → templates}/Base/app/src/front_end/layouts/default_layout.rb.erb +0 -0
  1040. /data/{mkbrut/templates → templates}/Base/app/src/front_end/pages/app_page.rb +0 -0
  1041. /data/{mkbrut/templates → templates}/Base/app/src/front_end/pages/home_page.rb +0 -0
  1042. /data/{mkbrut/templates → templates}/Base/app/src/front_end/support/app_session.rb +0 -0
  1043. /data/{mkbrut/templates → templates}/Base/app/src/front_end/svgs/README.md +0 -0
  1044. /data/{mkbrut/templates → templates}/Base/app/src/front_end/svgs/comment-button.svg +0 -0
  1045. /data/{mkbrut/templates → templates}/Base/bin/README.md.erb +0 -0
  1046. /data/{mkbrut/templates → templates}/Base/bin/console +0 -0
  1047. /data/{mkbrut/templates → templates}/Base/bin/dbconsole +0 -0
  1048. /data/{mkbrut/templates → templates}/Base/bin/dev +0 -0
  1049. /data/{mkbrut/templates → templates}/Base/bin/run +0 -0
  1050. /data/{mkbrut/templates → templates}/Base/bin/run.run +0 -0
  1051. /data/{mkbrut/templates → templates}/Base/bin/startup-message +0 -0
  1052. /data/{mkbrut/templates → templates}/Base/config.ru +0 -0
  1053. /data/{mkbrut/templates → templates}/Base/docker-compose.dx.yml +0 -0
  1054. /data/{mkbrut/templates → templates}/Base/dx/README.md +0 -0
  1055. /data/{mkbrut/templates → templates}/Base/dx/bash_customizations +0 -0
  1056. /data/{mkbrut/templates → templates}/Base/dx/bash_customizations.local +0 -0
  1057. /data/{mkbrut/templates → templates}/Base/dx/build +0 -0
  1058. /data/{mkbrut/templates → templates}/Base/dx/dx.sh.lib +0 -0
  1059. /data/{mkbrut/templates → templates}/Base/dx/exec +0 -0
  1060. /data/{dx → templates/Base/dx}/prune +0 -0
  1061. /data/{mkbrut/templates → templates}/Base/dx/show-help-in-app-container-then-wait.sh +0 -0
  1062. /data/{dx → templates/Base/dx}/start +0 -0
  1063. /data/{dx → templates/Base/dx}/stop +0 -0
  1064. /data/{mkbrut/templates → templates}/Base/package.json.erb +0 -0
  1065. /data/{mkbrut/templates → templates}/Base/puma.config.rb +0 -0
  1066. /data/{mkbrut/templates → templates}/Base/specs/e2e/home_page.spec.rb.erb +0 -0
  1067. /data/{mkbrut/templates → templates}/Base/specs/front_end/js/SpecHelper.js +0 -0
  1068. /data/{mkbrut/templates → templates}/Base/specs/front_end/pages/home_page.spec.rb +0 -0
  1069. /data/{mkbrut/templates → templates}/Base/specs/lint_factories.spec.rb +0 -0
  1070. /data/{mkbrut/templates → templates}/Base/specs/spec_helper.rb +0 -0
  1071. /data/{mkbrut/templates → templates}/Base/specs/support.rb +0 -0
  1072. /data/{mkbrut/templates → templates}/segments/BareBones/app/src/front_end/handlers/trigger_exception_handler.rb +0 -0
  1073. /data/{mkbrut/templates → templates}/segments/BareBones/app/src/front_end/js/Example.js.erb +0 -0
  1074. /data/{mkbrut/templates → templates}/segments/BareBones/specs/front_end/handlers/trigger_exception_handler.spec.rb +0 -0
  1075. /data/{mkbrut/templates → templates}/segments/BareBones/specs/front_end/js/Example.spec.js.erb +0 -0
  1076. /data/{mkbrut/templates → templates}/segments/Demo/app/src/back_end/data_models/db/guestbook_message.rb +0 -0
  1077. /data/{mkbrut/templates → templates}/segments/Demo/app/src/back_end/data_models/migrations/20250628194124_guestbook.rb +0 -0
  1078. /data/{mkbrut/templates → templates}/segments/Demo/app/src/front_end/components/flash_component.rb +0 -0
  1079. /data/{mkbrut/templates → templates}/segments/Demo/app/src/front_end/css/constraint-violations.css +0 -0
  1080. /data/{mkbrut/templates → templates}/segments/Demo/app/src/front_end/fonts/monaspace-xenon.ttf +0 -0
  1081. /data/{mkbrut/templates → templates}/segments/Demo/app/src/front_end/forms/guestbook_message_form.rb +0 -0
  1082. /data/{mkbrut/templates → templates}/segments/Demo/app/src/front_end/handlers/guestbook_message_handler.rb +0 -0
  1083. /data/{mkbrut/templates → templates}/segments/Demo/app/src/front_end/pages/guestbook_page/message_component.rb +0 -0
  1084. /data/{mkbrut/templates → templates}/segments/Demo/app/src/front_end/pages/guestbook_page.rb +0 -0
  1085. /data/{mkbrut/templates → templates}/segments/Demo/app/src/front_end/pages/new_guestbook_message_page.rb +0 -0
  1086. /data/{mkbrut/templates → templates}/segments/Demo/specs/back_end/data_models/db/guestbook_message.spec.rb +0 -0
  1087. /data/{mkbrut/templates → templates}/segments/Demo/specs/e2e/guest_message.spec.rb +0 -0
  1088. /data/{mkbrut/templates → templates}/segments/Demo/specs/factories/db/guestbook_message.factory.rb +0 -0
  1089. /data/{mkbrut/templates → templates}/segments/Demo/specs/front_end/components/flash_component.spec.rb +0 -0
  1090. /data/{mkbrut/templates → templates}/segments/Demo/specs/front_end/handlers/guestbook_message_handler.spec.rb +0 -0
  1091. /data/{mkbrut/templates → templates}/segments/Demo/specs/front_end/pages/guestbook_page/message_component.spec.rb +0 -0
  1092. /data/{mkbrut/templates → templates}/segments/Demo/specs/front_end/pages/guestbook_page.spec.rb +0 -0
  1093. /data/{mkbrut/templates → templates}/segments/Demo/specs/front_end/pages/new_guestbook_message_page.spec.rb +0 -0
  1094. /data/{mkbrut/templates → templates}/segments/Heroku/bin/deploy +0 -0
  1095. /data/{mkbrut/templates → templates}/segments/Heroku/deploy/docker-entrypoint +0 -0
  1096. /data/{mkbrut/templates → templates}/segments/Sidekiq/app/boot_sidekiq.rb +0 -0
  1097. /data/{mkbrut/templates → templates}/segments/Sidekiq/app/config/sidekiq.yml +0 -0
  1098. /data/{mkbrut/templates → templates}/segments/Sidekiq/app/src/back_end/jobs/app_job.rb +0 -0
  1099. /data/{mkbrut/templates → templates}/segments/Sidekiq/app/src/back_end/jobs/example_job.rb +0 -0
  1100. /data/{mkbrut/templates → templates}/segments/Sidekiq/app/src/back_end/segments/sidekiq_segment.rb +0 -0
  1101. /data/{mkbrut/templates → templates}/segments/Sidekiq/bin/run.sidekiq +0 -0
  1102. /data/{mkbrut/templates → templates}/segments/Sidekiq/specs/back_end/jobs/example_job.spec.rb +0 -0
  1103. /data/{mkbrut/templates → templates}/segments/Sidekiq/specs/integration/sidekiq_works.spec.rb +0 -0
data/docs/brut-css/classes/typography.html DELETED
@@ -1,2206 +0,0 @@
1
- <!doctype html>
2
- <html class="ma-0 pa-0 h-100" lang="en">
3
- <head>
4
- <link rel="stylesheet" href="/brut-css/brut.css">
5
- <link rel="stylesheet" href="/brut-css/docs.css">
6
- <link rel="stylesheet" href="/brut-css/prism-twilight.min.css">
7
- </head>
8
-
9
- <body class="flex flex-column ff-sans ma-0 pa-0 h-100">
10
- <header class="pos-sticky top-0 bg-gray-700 pa-3 z-5 shadow-2">
11
- <div class="flex gap-3 justify-between items-center">
12
- <h1><a href="/brut-css" class="black tdn">BrutCSS Reference Documentation</a></h1>
13
- <ul class="lst-none pl-0 flex gap-2 justify-end items-center">
14
- <form class="dn flex items-center gap-1 mr-3">
15
- <label>
16
- <input type="search" placeholder="e.g. padding-left" class="pa-2 br-2 ba bc-gray-600 bg-white-ish gray-200">
17
- <span class="sr-only">Search term</span>
18
- </label>
19
- <button class="ph-3 pv-2 bg-white gray-100 ba bc-gray-500 br-3 hover-bg-gray-800 pointer flex items-center justify-between">
20
- <span class="mr-2">Search</span>
21
- <kbd>&#8984;</kbd>
22
- <kbd>/</kbd>
23
- </button>
24
- </form>
25
- <li><a href="/" class="red-200 tdn hover-tdu">BrutRB</a></li>
26
- <span aria-hidden="true">&middot;</span>
27
- <li><a href="/brut-js" class="gray-200 tdn hover-tdu">BrutJS</a></li>
28
- <span aria-hidden="true">&middot;</span>
29
- <li><a href="https://github.com/thirdtank/brut/tree/main/brut-css" class="gray-200 tdn hover-tdu">Code</a></li>
30
- </ul>
31
- </div>
32
- </header>
33
- <main class="flex overflow-hidden flex-grow-1 flex-shrink-1 flex-basis-0 pos-relative">
34
- <nav class="overflow-y-auto ph-3 pb-2 pt-4 w-20 bg-gray-800 gray-200 h-100">
35
-
36
- <h3>Getting Started</h3>
37
- <ul class="pl-3">
38
-
39
- <li>
40
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/getting-started/overview.html">Overview</a>
41
- </li>
42
-
43
- <li>
44
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/getting-started/installation.html">Installation</a>
45
- </li>
46
-
47
- <li>
48
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/getting-started/core-concepts.html">Core Concepts</a>
49
- </li>
50
-
51
- <li>
52
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/getting-started/simple-example.html">Simple Example</a>
53
- </li>
54
-
55
- </ul>
56
-
57
- <h3>Properties</h3>
58
- <ul class="pl-3">
59
-
60
- <li>
61
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/properties/colors.html">Colors</a>
62
- </li>
63
-
64
- <li>
65
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/properties/spacings.html">Spacings</a>
66
- </li>
67
-
68
- <li>
69
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/properties/typography.html">Typography</a>
70
- </li>
71
-
72
- </ul>
73
-
74
- <h3>Classes</h3>
75
- <ul class="pl-3">
76
-
77
- <li>
78
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/appearances.html">Appearances</a>
79
- </li>
80
-
81
- <li>
82
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/borders.html">Borders</a>
83
- </li>
84
-
85
- <li>
86
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/foreground-colors.html">Foreground Colors</a>
87
- </li>
88
-
89
- <li>
90
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/background-colors.html">Background Colors</a>
91
- </li>
92
-
93
- <li>
94
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/border-colors.html">Border Colors</a>
95
- </li>
96
-
97
- <li>
98
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/dimensions.html">Dimensions</a>
99
- </li>
100
-
101
- <li>
102
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/flex.html">Flex</a>
103
- </li>
104
-
105
- <li>
106
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/layout.html">Layout</a>
107
- </li>
108
-
109
- <li>
110
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/lists.html">Lists</a>
111
- </li>
112
-
113
- <li>
114
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/positioning.html">Positioning</a>
115
- </li>
116
-
117
- <li>
118
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/spacings.html">Spacings</a>
119
- </li>
120
-
121
- <li>
122
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/typography.html">Typography</a>
123
- </li>
124
-
125
- <li>
126
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/classes/junk-drawer.html">Junk Drawer</a>
127
- </li>
128
-
129
- </ul>
130
-
131
- <h3>Customization</h3>
132
- <ul class="pl-3">
133
-
134
- <li>
135
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/customization/design-system.html">Design System</a>
136
- </li>
137
-
138
- <li>
139
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/customization/breakpoints.html">Breakpoints</a>
140
- </li>
141
-
142
- <li>
143
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/customization/pseudo-classes.html">Pseudo Classes</a>
144
- </li>
145
-
146
- <li>
147
- <a class="black-ish tdu tdn-ns hover-tdu-ns" href="/brut-css/customization/advanced-configuration.html">Advanced Configuration</a>
148
- </li>
149
-
150
- </ul>
151
-
152
-
153
- </nav>
154
- <section class="overflow-y-auto pt-4 h-100 flex-grow-1 flex-shrink-1 flex-basis-0 flex flex-column">
155
- <div class="ph-3 pv-2 flex items-start gap-2 justify-between">
156
-
157
- <article>
158
- <h2 class="}-5">Typography Classes</h2>
159
-
160
- <p>Typography classes. These allow you to control how text is displayed and rendered. In particular, this contains the modular scale of font sizes, but also contains many other text rendering options.</p>
161
-
162
-
163
-
164
- <h3 class="f-2 b">See Also</h3>
165
- <ul class="see-also">
166
-
167
- <li><p><a href="https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Text_styling/Web_fonts">Web Fonts</a> (external)</p>
168
- </li>
169
-
170
- <li><p><a href="/brut-css/properties/typography.html">Typography</a></p>
171
- </li>
172
-
173
- </ul>
174
-
175
-
176
- <h3 class="f-5 mt-4" id="class-group:font-family">Font Family</h3>
177
- <p class="p">
178
- <p>Font families for sans, serif, monospace, cursive, and fantasy. The idea is that your design would not have more than one font of each type, so you’d set custom properties with the fonts you like, then use e.g. <code>.ff-sans</code> anywhere you wanted Sans Serif and <code>ff-serif</code> anywhere you wanted yourt Serif font.</p>
179
-
180
- </p>
181
-
182
- <h4 class="f-2 b">See Also</h3>
183
- <ul class="see-also">
184
-
185
- <li><p><a href="/brut-css/properties/typography.html#property-group:font-family">Font Family</a></p>
186
- </li>
187
-
188
- </ul>
189
-
190
-
191
- <div class="mt-4 flex gap-3 items-center justify-between" id="ff-sans">
192
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ff-sans</code></h4>
193
- <pre class="f-3 highlighted-code"><span class="token selector">.ff-sans</span> <span class="token punctuation">{</span>
194
- <span class="token property">font-family</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--ff-sans<span class="token punctuation">)</span><span class="token punctuation">;</span>
195
- <span class="token punctuation">}</span></pre>
196
- </div>
197
- <div class="ml-3">
198
- <p class="p">
199
- <p>Set the contents in the chosen sans-serif font</p>
200
-
201
- </p>
202
-
203
- <h5 class="f-1 b">See Also</h3>
204
- <ul class="see-also">
205
-
206
- <li><p><a href="/brut-css/properties/typography.html#--ff-sans"><code>--ff-sans</code></a></p>
207
- </li>
208
-
209
- </ul>
210
-
211
-
212
- <h5 class="f-2 ttu">
213
-
214
- Example
215
-
216
- </h5>
217
-
218
-
219
- <h6 class="f-1 fw-bold mt-2">Typical</h6>
220
-
221
- <div class="mv-3 example">
222
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ff-sans<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
223
- <div class="example-demonstration">
224
-
225
- <p class="ff-sans">Things should be what they are</p>
226
-
227
- </div>
228
- </div>
229
-
230
-
231
- </div>
232
-
233
- <div class="mt-4 flex gap-3 items-center justify-between" id="ff-serif">
234
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ff-serif</code></h4>
235
- <pre class="f-3 highlighted-code"><span class="token selector">.ff-serif</span> <span class="token punctuation">{</span>
236
- <span class="token property">font-family</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--ff-serif<span class="token punctuation">)</span><span class="token punctuation">;</span>
237
- <span class="token punctuation">}</span></pre>
238
- </div>
239
- <div class="ml-3">
240
- <p class="p">
241
- <p>Set the contents in the chosen sans-serif font</p>
242
-
243
- </p>
244
-
245
-
246
- <h5 class="f-2 ttu">
247
-
248
- Example
249
-
250
- </h5>
251
-
252
-
253
- <div class="mv-3 example">
254
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ff-serif<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
255
- <div class="example-demonstration">
256
-
257
- <p class="ff-serif">Things should be what they are</p>
258
-
259
- </div>
260
- </div>
261
-
262
-
263
- </div>
264
-
265
- <div class="mt-4 flex gap-3 items-center justify-between" id="ff-mono">
266
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ff-mono</code></h4>
267
- <pre class="f-3 highlighted-code"><span class="token selector">.ff-mono</span> <span class="token punctuation">{</span>
268
- <span class="token property">font-family</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--ff-mono<span class="token punctuation">)</span><span class="token punctuation">;</span>
269
- <span class="token punctuation">}</span></pre>
270
- </div>
271
- <div class="ml-3">
272
- <p class="p">
273
- <p>Set the contents in the chosen monospace font</p>
274
-
275
- </p>
276
-
277
-
278
- <h5 class="f-2 ttu">
279
-
280
- Example
281
-
282
- </h5>
283
-
284
-
285
- <div class="mv-3 example">
286
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ff-mono<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
287
- <div class="example-demonstration">
288
-
289
- <p class="ff-mono">Things should be what they are</p>
290
-
291
- </div>
292
- </div>
293
-
294
-
295
- </div>
296
-
297
- <div class="mt-4 flex gap-3 items-center justify-between" id="ff-cursive">
298
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ff-cursive</code></h4>
299
- <pre class="f-3 highlighted-code"><span class="token selector">.ff-cursive</span> <span class="token punctuation">{</span>
300
- <span class="token property">font-family</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--ff-cursive<span class="token punctuation">)</span><span class="token punctuation">;</span>
301
- <span class="token punctuation">}</span></pre>
302
- </div>
303
- <div class="ml-3">
304
- <p class="p">
305
- <p>Set the contents in the chosen cursive/handwriting font</p>
306
-
307
- </p>
308
-
309
-
310
- <h5 class="f-2 ttu">
311
-
312
- Example
313
-
314
- </h5>
315
-
316
-
317
- <div class="mv-3 example">
318
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ff-cursive<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
319
- <div class="example-demonstration">
320
-
321
- <p class="ff-cursive">Things should be what they are</p>
322
-
323
- </div>
324
- </div>
325
-
326
-
327
- </div>
328
-
329
- <div class="mt-4 flex gap-3 items-center justify-between" id="ff-fantasy">
330
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ff-fantasy</code></h4>
331
- <pre class="f-3 highlighted-code"><span class="token selector">.ff-fantasy</span> <span class="token punctuation">{</span>
332
- <span class="token property">font-family</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--ff-fantasy<span class="token punctuation">)</span><span class="token punctuation">;</span>
333
- <span class="token punctuation">}</span></pre>
334
- </div>
335
- <div class="ml-3">
336
- <p class="p">
337
- <p>Set the contents in the chosen fantasy font</p>
338
-
339
- </p>
340
-
341
-
342
- <h5 class="f-2 ttu">
343
-
344
- Example
345
-
346
- </h5>
347
-
348
-
349
- <div class="mv-3 example">
350
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>ff-fantasy<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
351
- <div class="example-demonstration">
352
-
353
- <p class="ff-fantasy">Things should be what they are</p>
354
-
355
- </div>
356
- </div>
357
-
358
-
359
- </div>
360
-
361
-
362
- <h3 class="f-5 mt-4" id="class-scale:font-size">Font Size</h3>
363
- <p class="p">
364
- <p>The modular scale of font sizes. This provides 10 total steps, which should give you enough font sizes for any needed. 0 is the smallest and 9 is the largest.</p>
365
-
366
- </p>
367
-
368
-
369
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-0">
370
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-0</code></h4>
371
- <pre class="f-3 highlighted-code"><span class="token selector">.f-0</span> <span class="token punctuation">{</span>
372
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-0<span class="token punctuation">)</span><span class="token punctuation">;</span>
373
- <span class="token punctuation">}</span></pre>
374
- </div>
375
- <div class="ml-3">
376
- <p class="p">
377
- <p>The smallest font. Note that this is likely very small and not legible in all situations. It’s here in case you really need something quite tiny, but try to use <a href="/brut-css/classes/typography.html#f-1"><code>.f-1</code></a> if you can.</p>
378
-
379
- </p>
380
-
381
-
382
- <h5 class="f-2 ttu">
383
-
384
- Example
385
-
386
- </h5>
387
-
388
-
389
- <div class="mv-3 example">
390
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-0<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
391
- <div class="example-demonstration">
392
-
393
- <p class="f-0">Things should be what they are</p>
394
-
395
- </div>
396
- </div>
397
-
398
-
399
- </div>
400
-
401
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-1">
402
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-1</code></h4>
403
- <pre class="f-3 highlighted-code"><span class="token selector">.f-1</span> <span class="token punctuation">{</span>
404
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-1<span class="token punctuation">)</span><span class="token punctuation">;</span>
405
- <span class="token punctuation">}</span></pre>
406
- </div>
407
- <div class="ml-3">
408
- <p class="p">
409
- <p>The second smallest font, which you should use general when you need something smaller than the body font.</p>
410
-
411
- </p>
412
-
413
-
414
- <h5 class="f-2 ttu">
415
-
416
- Example
417
-
418
- </h5>
419
-
420
-
421
- <div class="mv-3 example">
422
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
423
- <div class="example-demonstration">
424
-
425
- <p class="f-1">Things should be what they are</p>
426
-
427
- </div>
428
- </div>
429
-
430
-
431
- </div>
432
-
433
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-2">
434
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-2</code></h4>
435
- <pre class="f-3 highlighted-code"><span class="token selector">.f-2</span> <span class="token punctuation">{</span>
436
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-2<span class="token punctuation">)</span><span class="token punctuation">;</span>
437
- <span class="token punctuation">}</span></pre>
438
- </div>
439
- <div class="ml-3">
440
- <p class="p">
441
- <p>The body font size, appropriate for all general text. By default, this should be <code>1rem</code>, which will match the user agent’s configured font size</p>
442
-
443
- </p>
444
-
445
-
446
- <h5 class="f-2 ttu">
447
-
448
- Example
449
-
450
- </h5>
451
-
452
-
453
- <div class="mv-3 example">
454
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
455
- <div class="example-demonstration">
456
-
457
- <p class="f-2">Things should be what they are</p>
458
-
459
- </div>
460
- </div>
461
-
462
-
463
- </div>
464
-
465
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-3">
466
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-3</code></h4>
467
- <pre class="f-3 highlighted-code"><span class="token selector">.f-3</span> <span class="token punctuation">{</span>
468
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-3<span class="token punctuation">)</span><span class="token punctuation">;</span>
469
- <span class="token punctuation">}</span></pre>
470
- </div>
471
- <div class="ml-3">
472
- <p class="p">
473
- <p>Third step of the scale, one steps larger than the body font.</p>
474
-
475
- </p>
476
-
477
-
478
- <h5 class="f-2 ttu">
479
-
480
- Example
481
-
482
- </h5>
483
-
484
-
485
- <div class="mv-3 example">
486
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
487
- <div class="example-demonstration">
488
-
489
- <p class="f-3">Things should be what they are</p>
490
-
491
- </div>
492
- </div>
493
-
494
-
495
- </div>
496
-
497
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-4">
498
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-4</code></h4>
499
- <pre class="f-3 highlighted-code"><span class="token selector">.f-4</span> <span class="token punctuation">{</span>
500
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-4<span class="token punctuation">)</span><span class="token punctuation">;</span>
501
- <span class="token punctuation">}</span></pre>
502
- </div>
503
- <div class="ml-3">
504
- <p class="p">
505
- <p>Fourth step of the scale, two steps larger than the body font.</p>
506
-
507
- </p>
508
-
509
-
510
- <h5 class="f-2 ttu">
511
-
512
- Example
513
-
514
- </h5>
515
-
516
-
517
- <div class="mv-3 example">
518
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-4<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
519
- <div class="example-demonstration">
520
-
521
- <p class="f-4">Things should be what they are</p>
522
-
523
- </div>
524
- </div>
525
-
526
-
527
- </div>
528
-
529
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-5">
530
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-5</code></h4>
531
- <pre class="f-3 highlighted-code"><span class="token selector">.f-5</span> <span class="token punctuation">{</span>
532
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-5<span class="token punctuation">)</span><span class="token punctuation">;</span>
533
- <span class="token punctuation">}</span></pre>
534
- </div>
535
- <div class="ml-3">
536
- <p class="p">
537
- <p>Fifth step of the scale, three steps larger than the body font.</p>
538
-
539
- </p>
540
-
541
-
542
- <h5 class="f-2 ttu">
543
-
544
- Example
545
-
546
- </h5>
547
-
548
-
549
- <div class="mv-3 example">
550
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
551
- <div class="example-demonstration">
552
-
553
- <p class="f-5">Things should be what they are</p>
554
-
555
- </div>
556
- </div>
557
-
558
-
559
- </div>
560
-
561
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-6">
562
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-6</code></h4>
563
- <pre class="f-3 highlighted-code"><span class="token selector">.f-6</span> <span class="token punctuation">{</span>
564
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-6<span class="token punctuation">)</span><span class="token punctuation">;</span>
565
- <span class="token punctuation">}</span></pre>
566
- </div>
567
- <div class="ml-3">
568
- <p class="p">
569
- <p>Sixth step of the scale, four steps larger than the body font.</p>
570
-
571
- </p>
572
-
573
-
574
- <h5 class="f-2 ttu">
575
-
576
- Example
577
-
578
- </h5>
579
-
580
-
581
- <div class="mv-3 example">
582
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
583
- <div class="example-demonstration">
584
-
585
- <p class="f-6">Things should be what they are</p>
586
-
587
- </div>
588
- </div>
589
-
590
-
591
- </div>
592
-
593
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-7">
594
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-7</code></h4>
595
- <pre class="f-3 highlighted-code"><span class="token selector">.f-7</span> <span class="token punctuation">{</span>
596
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-7<span class="token punctuation">)</span><span class="token punctuation">;</span>
597
- <span class="token punctuation">}</span></pre>
598
- </div>
599
- <div class="ml-3">
600
- <p class="p">
601
- <p>Seventh step of the scale, five steps larger than the body font.</p>
602
-
603
- </p>
604
-
605
-
606
- <h5 class="f-2 ttu">
607
-
608
- Example
609
-
610
- </h5>
611
-
612
-
613
- <div class="mv-3 example">
614
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-7<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
615
- <div class="example-demonstration">
616
-
617
- <p class="f-7">Things should be what they are</p>
618
-
619
- </div>
620
- </div>
621
-
622
-
623
- </div>
624
-
625
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-8">
626
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-8</code></h4>
627
- <pre class="f-3 highlighted-code"><span class="token selector">.f-8</span> <span class="token punctuation">{</span>
628
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-8<span class="token punctuation">)</span><span class="token punctuation">;</span>
629
- <span class="token punctuation">}</span></pre>
630
- </div>
631
- <div class="ml-3">
632
- <p class="p">
633
- <p>Eighth step of the scale, six steps larger than the body font.</p>
634
-
635
- </p>
636
-
637
-
638
- <h5 class="f-2 ttu">
639
-
640
- Example
641
-
642
- </h5>
643
-
644
-
645
- <div class="mv-3 example">
646
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-8<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
647
- <div class="example-demonstration">
648
-
649
- <p class="f-8">Things should be what they are</p>
650
-
651
- </div>
652
- </div>
653
-
654
-
655
- </div>
656
-
657
- <div class="mt-4 flex gap-3 items-center justify-between" id="f-9">
658
- <h4 class="f-4 fw-3 ws-nowrap"><code>.f-9</code></h4>
659
- <pre class="f-3 highlighted-code"><span class="token selector">.f-9</span> <span class="token punctuation">{</span>
660
- <span class="token property">font-size</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--fs-9<span class="token punctuation">)</span><span class="token punctuation">;</span>
661
- <span class="token punctuation">}</span></pre>
662
- </div>
663
- <div class="ml-3">
664
- <p class="p">
665
- <p>Largest size font</p>
666
-
667
- </p>
668
-
669
-
670
- <h5 class="f-2 ttu">
671
-
672
- Example
673
-
674
- </h5>
675
-
676
-
677
- <div class="mv-3 example">
678
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>f-9<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
679
- <div class="example-demonstration">
680
-
681
- <p class="f-9">Things should be what they are</p>
682
-
683
- </div>
684
- </div>
685
-
686
-
687
- </div>
688
-
689
-
690
- <h3 class="f-5 mt-4" id="class-scale:font-weights">Font Weights</h3>
691
- <p class="p">
692
- <p>Font Weights. These go from 1 to 9, representing 100’s, along with a normal class to undo any font weight. Note that, depending on your font, not every weight will look distinct.</p>
693
-
694
- </p>
695
-
696
-
697
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-normal">
698
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-normal</code></h4>
699
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-normal</span> <span class="token punctuation">{</span>
700
- <span class="token property">font-weight</span><span class="token punctuation">:</span> normal<span class="token punctuation">;</span>
701
- <span class="token punctuation">}</span></pre>
702
- </div>
703
- <div class="ml-3">
704
- <p class="p">
705
- <p>Normal font weight.</p>
706
-
707
- </p>
708
-
709
-
710
- <h5 class="f-2 ttu">
711
-
712
- Example
713
-
714
- </h5>
715
-
716
-
717
- <div class="mv-3 example">
718
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-normal<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
719
- <div class="example-demonstration">
720
-
721
- <p class="fw-normal">Things should be what they are</p>
722
-
723
- </div>
724
- </div>
725
-
726
-
727
- </div>
728
-
729
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-bold">
730
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-bold</code></h4>
731
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-bold</span> <span class="token punctuation">{</span>
732
- <span class="token property">font-weight</span><span class="token punctuation">:</span> bold<span class="token punctuation">;</span>
733
- <span class="token punctuation">}</span></pre>
734
- </div>
735
- <div class="ml-3">
736
- <p class="p">
737
- <p>Bold font weight.</p>
738
-
739
- </p>
740
-
741
-
742
- <h5 class="f-2 ttu">
743
-
744
- Example
745
-
746
- </h5>
747
-
748
-
749
- <div class="mv-3 example">
750
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-bold<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
751
- <div class="example-demonstration">
752
-
753
- <p class="fw-bold">Things should be what they are</p>
754
-
755
- </div>
756
- </div>
757
-
758
-
759
- </div>
760
-
761
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-1">
762
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-1</code></h4>
763
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-1</span> <span class="token punctuation">{</span>
764
- <span class="token property">font-weight</span><span class="token punctuation">:</span> 100<span class="token punctuation">;</span>
765
- <span class="token punctuation">}</span></pre>
766
- </div>
767
- <div class="ml-3">
768
- <p class="p">
769
- <p>Lightest font weight.</p>
770
-
771
- </p>
772
-
773
-
774
- <h5 class="f-2 ttu">
775
-
776
- Example
777
-
778
- </h5>
779
-
780
-
781
- <div class="mv-3 example">
782
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
783
- <div class="example-demonstration">
784
-
785
- <p class="fw-1">Things should be what they are</p>
786
-
787
- </div>
788
- </div>
789
-
790
-
791
- </div>
792
-
793
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-2">
794
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-2</code></h4>
795
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-2</span> <span class="token punctuation">{</span>
796
- <span class="token property">font-weight</span><span class="token punctuation">:</span> 200<span class="token punctuation">;</span>
797
- <span class="token punctuation">}</span></pre>
798
- </div>
799
- <div class="ml-3">
800
- <p class="p">
801
-
802
- </p>
803
-
804
-
805
- <h5 class="f-2 ttu">
806
-
807
- Example
808
-
809
- </h5>
810
-
811
-
812
- <div class="mv-3 example">
813
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
814
- <div class="example-demonstration">
815
-
816
- <p class="fw-2">Things should be what they are</p>
817
-
818
- </div>
819
- </div>
820
-
821
-
822
- </div>
823
-
824
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-3">
825
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-3</code></h4>
826
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-3</span> <span class="token punctuation">{</span>
827
- <span class="token property">font-weight</span><span class="token punctuation">:</span> 300<span class="token punctuation">;</span>
828
- <span class="token punctuation">}</span></pre>
829
- </div>
830
- <div class="ml-3">
831
- <p class="p">
832
-
833
- </p>
834
-
835
-
836
- <h5 class="f-2 ttu">
837
-
838
- Example
839
-
840
- </h5>
841
-
842
-
843
- <div class="mv-3 example">
844
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
845
- <div class="example-demonstration">
846
-
847
- <p class="fw-3">Things should be what they are</p>
848
-
849
- </div>
850
- </div>
851
-
852
-
853
- </div>
854
-
855
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-4">
856
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-4</code></h4>
857
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-4</span> <span class="token punctuation">{</span>
858
- <span class="token property">font-weight</span><span class="token punctuation">:</span> 400<span class="token punctuation">;</span>
859
- <span class="token punctuation">}</span></pre>
860
- </div>
861
- <div class="ml-3">
862
- <p class="p">
863
-
864
- </p>
865
-
866
-
867
- <h5 class="f-2 ttu">
868
-
869
- Example
870
-
871
- </h5>
872
-
873
-
874
- <div class="mv-3 example">
875
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-4<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
876
- <div class="example-demonstration">
877
-
878
- <p class="fw-4">Things should be what they are</p>
879
-
880
- </div>
881
- </div>
882
-
883
-
884
- </div>
885
-
886
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-5">
887
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-5</code></h4>
888
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-5</span> <span class="token punctuation">{</span>
889
- <span class="token property">font-weight</span><span class="token punctuation">:</span> 500<span class="token punctuation">;</span>
890
- <span class="token punctuation">}</span></pre>
891
- </div>
892
- <div class="ml-3">
893
- <p class="p">
894
-
895
- </p>
896
-
897
-
898
- <h5 class="f-2 ttu">
899
-
900
- Example
901
-
902
- </h5>
903
-
904
-
905
- <div class="mv-3 example">
906
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
907
- <div class="example-demonstration">
908
-
909
- <p class="fw-5">Things should be what they are</p>
910
-
911
- </div>
912
- </div>
913
-
914
-
915
- </div>
916
-
917
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-6">
918
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-6</code></h4>
919
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-6</span> <span class="token punctuation">{</span>
920
- <span class="token property">font-weight</span><span class="token punctuation">:</span> 600<span class="token punctuation">;</span>
921
- <span class="token punctuation">}</span></pre>
922
- </div>
923
- <div class="ml-3">
924
- <p class="p">
925
-
926
- </p>
927
-
928
-
929
- <h5 class="f-2 ttu">
930
-
931
- Example
932
-
933
- </h5>
934
-
935
-
936
- <div class="mv-3 example">
937
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
938
- <div class="example-demonstration">
939
-
940
- <p class="fw-6">Things should be what they are</p>
941
-
942
- </div>
943
- </div>
944
-
945
-
946
- </div>
947
-
948
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-7">
949
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-7</code></h4>
950
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-7</span> <span class="token punctuation">{</span>
951
- <span class="token property">font-weight</span><span class="token punctuation">:</span> 700<span class="token punctuation">;</span>
952
- <span class="token punctuation">}</span></pre>
953
- </div>
954
- <div class="ml-3">
955
- <p class="p">
956
-
957
- </p>
958
-
959
-
960
- <h5 class="f-2 ttu">
961
-
962
- Example
963
-
964
- </h5>
965
-
966
-
967
- <div class="mv-3 example">
968
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-7<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
969
- <div class="example-demonstration">
970
-
971
- <p class="fw-7">Things should be what they are</p>
972
-
973
- </div>
974
- </div>
975
-
976
-
977
- </div>
978
-
979
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-8">
980
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-8</code></h4>
981
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-8</span> <span class="token punctuation">{</span>
982
- <span class="token property">font-weight</span><span class="token punctuation">:</span> 800<span class="token punctuation">;</span>
983
- <span class="token punctuation">}</span></pre>
984
- </div>
985
- <div class="ml-3">
986
- <p class="p">
987
-
988
- </p>
989
-
990
-
991
- <h5 class="f-2 ttu">
992
-
993
- Example
994
-
995
- </h5>
996
-
997
-
998
- <div class="mv-3 example">
999
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-8<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1000
- <div class="example-demonstration">
1001
-
1002
- <p class="fw-8">Things should be what they are</p>
1003
-
1004
- </div>
1005
- </div>
1006
-
1007
-
1008
- </div>
1009
-
1010
- <div class="mt-4 flex gap-3 items-center justify-between" id="fw-9">
1011
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fw-9</code></h4>
1012
- <pre class="f-3 highlighted-code"><span class="token selector">.fw-9</span> <span class="token punctuation">{</span>
1013
- <span class="token property">font-weight</span><span class="token punctuation">:</span> 900<span class="token punctuation">;</span>
1014
- <span class="token punctuation">}</span></pre>
1015
- </div>
1016
- <div class="ml-3">
1017
- <p class="p">
1018
- <p>Heaviest font weight.</p>
1019
-
1020
- </p>
1021
-
1022
-
1023
- <h5 class="f-2 ttu">
1024
-
1025
- Example
1026
-
1027
- </h5>
1028
-
1029
-
1030
- <div class="mv-3 example">
1031
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fw-9<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1032
- <div class="example-demonstration">
1033
-
1034
- <p class="fw-9">Things should be what they are</p>
1035
-
1036
- </div>
1037
- </div>
1038
-
1039
-
1040
- </div>
1041
-
1042
-
1043
- <h3 class="f-5 mt-4" id="class-group:styles-variants">Styles Variants</h3>
1044
- <p class="p">
1045
- <p>Font styles and variants.</p>
1046
-
1047
- </p>
1048
-
1049
-
1050
- <div class="mt-4 flex gap-3 items-center justify-between" id="fs-normal">
1051
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fs-normal</code></h4>
1052
- <pre class="f-3 highlighted-code"><span class="token selector">.fs-normal</span> <span class="token punctuation">{</span>
1053
- <span class="token property">font-style</span><span class="token punctuation">:</span> normal<span class="token punctuation">;</span>
1054
- <span class="token punctuation">}</span></pre>
1055
- </div>
1056
- <div class="ml-3">
1057
- <p class="p">
1058
- <p>Normal styling, typically roman.</p>
1059
-
1060
- </p>
1061
-
1062
-
1063
- <h5 class="f-2 ttu">
1064
-
1065
- Example
1066
-
1067
- </h5>
1068
-
1069
-
1070
- <div class="mv-3 example">
1071
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fs-normal<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1072
- <div class="example-demonstration">
1073
-
1074
- <p class="fs-normal">Things should be what they are</p>
1075
-
1076
- </div>
1077
- </div>
1078
-
1079
-
1080
- </div>
1081
-
1082
- <div class="mt-4 flex gap-3 items-center justify-between" id="fs-italic">
1083
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fs-italic</code></h4>
1084
- <pre class="f-3 highlighted-code"><span class="token selector">.fs-italic</span> <span class="token punctuation">{</span>
1085
- <span class="token property">font-style</span><span class="token punctuation">:</span> italic<span class="token punctuation">;</span>
1086
- <span class="token punctuation">}</span></pre>
1087
- </div>
1088
- <div class="ml-3">
1089
- <p class="p">
1090
- <p>Italic or slanted styling, depend on the font.</p>
1091
-
1092
- </p>
1093
-
1094
-
1095
- <h5 class="f-2 ttu">
1096
-
1097
- Example
1098
-
1099
- </h5>
1100
-
1101
-
1102
- <div class="mv-3 example">
1103
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fs-italic<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1104
- <div class="example-demonstration">
1105
-
1106
- <p class="fs-italic">Things should be what they are</p>
1107
-
1108
- </div>
1109
- </div>
1110
-
1111
-
1112
- </div>
1113
-
1114
- <div class="mt-4 flex gap-3 items-center justify-between" id="fv-sc">
1115
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fv-sc</code></h4>
1116
- <pre class="f-3 highlighted-code"><span class="token selector">.fv-sc</span> <span class="token punctuation">{</span>
1117
- <span class="token property">font-variant</span><span class="token punctuation">:</span> small-caps<span class="token punctuation">;</span>
1118
- <span class="token punctuation">}</span></pre>
1119
- </div>
1120
- <div class="ml-3">
1121
- <p class="p">
1122
- <p>Small caps variant</p>
1123
-
1124
- </p>
1125
-
1126
-
1127
- <h5 class="f-2 ttu">
1128
-
1129
- Example
1130
-
1131
- </h5>
1132
-
1133
-
1134
- <div class="mv-3 example">
1135
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fv-sc<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1136
- <div class="example-demonstration">
1137
-
1138
- <p class="fv-sc">Things should be what they are</p>
1139
-
1140
- </div>
1141
- </div>
1142
-
1143
-
1144
- </div>
1145
-
1146
- <div class="mt-4 flex gap-3 items-center justify-between" id="fv-normal">
1147
- <h4 class="f-4 fw-3 ws-nowrap"><code>.fv-normal</code></h4>
1148
- <pre class="f-3 highlighted-code"><span class="token selector">.fv-normal</span> <span class="token punctuation">{</span>
1149
- <span class="token property">font-variant</span><span class="token punctuation">:</span> normal<span class="token punctuation">;</span>
1150
- <span class="token punctuation">}</span></pre>
1151
- </div>
1152
- <div class="ml-3">
1153
- <p class="p">
1154
- <p>Normal variant</p>
1155
-
1156
- </p>
1157
-
1158
-
1159
- <h5 class="f-2 ttu">
1160
-
1161
- Example
1162
-
1163
- </h5>
1164
-
1165
-
1166
- <div class="mv-3 example">
1167
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>fv-normal<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1168
- <div class="example-demonstration">
1169
-
1170
- <p class="fv-normal">Things should be what they are</p>
1171
-
1172
- </div>
1173
- </div>
1174
-
1175
-
1176
- </div>
1177
-
1178
-
1179
- <h3 class="f-5 mt-4" id="class-group:tracking">Tracking</h3>
1180
- <p class="p">
1181
- <p>Letterspacing/tracking. This scale is semantic, since you likely don’t need that many values to achnieve whatever design you are looking for.</p>
1182
-
1183
- </p>
1184
-
1185
-
1186
- <div class="mt-4 flex gap-3 items-center justify-between" id="tracked">
1187
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tracked</code></h4>
1188
- <pre class="f-3 highlighted-code"><span class="token selector">.tracked</span> <span class="token punctuation">{</span>
1189
- <span class="token property">letter-spacing</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--ls-tracked<span class="token punctuation">)</span><span class="token punctuation">;</span>
1190
- <span class="token punctuation">}</span></pre>
1191
- </div>
1192
- <div class="ml-3">
1193
- <p class="p">
1194
- <p>Slightly increased spacing, useful for cleaning up all-caps titles.</p>
1195
-
1196
- </p>
1197
-
1198
-
1199
- <h5 class="f-2 ttu">
1200
-
1201
- Example
1202
-
1203
- </h5>
1204
-
1205
-
1206
- <div class="mv-3 example">
1207
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tracked<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1208
- <div class="example-demonstration">
1209
-
1210
- <p class="tracked">Things should be what they are</p>
1211
-
1212
- </div>
1213
- </div>
1214
-
1215
-
1216
- </div>
1217
-
1218
- <div class="mt-4 flex gap-3 items-center justify-between" id="tracked-tight">
1219
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tracked-tight</code></h4>
1220
- <pre class="f-3 highlighted-code"><span class="token selector">.tracked-tight</span> <span class="token punctuation">{</span>
1221
- <span class="token property">letter-spacing</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--ls-tight<span class="token punctuation">)</span><span class="token punctuation">;</span>
1222
- <span class="token punctuation">}</span></pre>
1223
- </div>
1224
- <div class="ml-3">
1225
- <p class="p">
1226
- <p>Tight spacing.</p>
1227
-
1228
- </p>
1229
-
1230
-
1231
- <h5 class="f-2 ttu">
1232
-
1233
- Example
1234
-
1235
- </h5>
1236
-
1237
-
1238
- <div class="mv-3 example">
1239
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tracked-tight<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1240
- <div class="example-demonstration">
1241
-
1242
- <p class="tracked-tight">Things should be what they are</p>
1243
-
1244
- </div>
1245
- </div>
1246
-
1247
-
1248
- </div>
1249
-
1250
- <div class="mt-4 flex gap-3 items-center justify-between" id="tracked-mega">
1251
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tracked-mega</code></h4>
1252
- <pre class="f-3 highlighted-code"><span class="token selector">.tracked-mega</span> <span class="token punctuation">{</span>
1253
- <span class="token property">letter-spacing</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--ls-mega<span class="token punctuation">)</span><span class="token punctuation">;</span>
1254
- <span class="token punctuation">}</span></pre>
1255
- </div>
1256
- <div class="ml-3">
1257
- <p class="p">
1258
- <p>Significantly increased spacing, useful for special effects.</p>
1259
-
1260
- </p>
1261
-
1262
-
1263
- <h5 class="f-2 ttu">
1264
-
1265
- Example
1266
-
1267
- </h5>
1268
-
1269
-
1270
- <div class="mv-3 example">
1271
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tracked-mega<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1272
- <div class="example-demonstration">
1273
-
1274
- <p class="tracked-mega">Things should be what they are</p>
1275
-
1276
- </div>
1277
- </div>
1278
-
1279
-
1280
- </div>
1281
-
1282
- <div class="mt-4 flex gap-3 items-center justify-between" id="tracked-none">
1283
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tracked-none</code></h4>
1284
- <pre class="f-3 highlighted-code"><span class="token selector">.tracked-none</span> <span class="token punctuation">{</span>
1285
- <span class="token property">letter-spacing</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--ls-none<span class="token punctuation">)</span><span class="token punctuation">;</span>
1286
- <span class="token punctuation">}</span></pre>
1287
- </div>
1288
- <div class="ml-3">
1289
- <p class="p">
1290
- <p>Normal letter spacing.</p>
1291
-
1292
- </p>
1293
-
1294
-
1295
- <h5 class="f-2 ttu">
1296
-
1297
- Example
1298
-
1299
- </h5>
1300
-
1301
-
1302
- <div class="mv-3 example">
1303
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>tracked-none<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1304
- <div class="example-demonstration">
1305
-
1306
- <p class="tracked-none">Things should be what they are</p>
1307
-
1308
- </div>
1309
- </div>
1310
-
1311
-
1312
- </div>
1313
-
1314
-
1315
- <h3 class="f-5 mt-4" id="class-group:leading">Leading/Line Height</h3>
1316
- <p class="p">
1317
- <p>Line heights/leading. This is a semantic scale providing three useful values.</p>
1318
-
1319
- </p>
1320
-
1321
-
1322
- <div class="mt-4 flex gap-3 items-center justify-between" id="lh-solid">
1323
- <h4 class="f-4 fw-3 ws-nowrap"><code>.lh-solid</code></h4>
1324
- <pre class="f-3 highlighted-code"><span class="token selector">.lh-solid</span> <span class="token punctuation">{</span>
1325
- <span class="token property">line-height</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--lh-solid<span class="token punctuation">)</span><span class="token punctuation">;</span>
1326
- <span class="token punctuation">}</span></pre>
1327
- </div>
1328
- <div class="ml-3">
1329
- <p class="p">
1330
- <p>No line height, for creating solid blocks of text.</p>
1331
-
1332
- </p>
1333
-
1334
-
1335
- <h5 class="f-2 ttu">
1336
-
1337
- Example
1338
-
1339
- </h5>
1340
-
1341
-
1342
- <div class="mv-3 example">
1343
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lh-solid measure<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
1344
- A core tenet of design is that same should be same, while
1345
- different be then different. Meaning: if two elements are
1346
- intended to be the same sort of thing, or reference the
1347
- same sort of information, they should have clear
1348
- consonance and harmony. Conversely, if two elements are
1349
- unrelated, they should be quite clearly different.
1350
- <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1351
- <div class="example-demonstration">
1352
-
1353
- <p class="lh-solid measure">
1354
- A core tenet of design is that same should be same, while different be then different. Meaning: if two elements are intended to be the same sort of thing, or reference the same sort of information, they should have clear consonance and harmony. Conversely, if two elements are unrelated, they should be quite clearly different.
1355
- </p>
1356
-
1357
- </div>
1358
- </div>
1359
-
1360
-
1361
- </div>
1362
-
1363
- <div class="mt-4 flex gap-3 items-center justify-between" id="lh-title">
1364
- <h4 class="f-4 fw-3 ws-nowrap"><code>.lh-title</code></h4>
1365
- <pre class="f-3 highlighted-code"><span class="token selector">.lh-title</span> <span class="token punctuation">{</span>
1366
- <span class="token property">line-height</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--lh-title<span class="token punctuation">)</span><span class="token punctuation">;</span>
1367
- <span class="token punctuation">}</span></pre>
1368
- </div>
1369
- <div class="ml-3">
1370
- <p class="p">
1371
- <p>Leading appropriate for titles, which can be somewhat tighter than normal text.</p>
1372
-
1373
- </p>
1374
-
1375
-
1376
- <h5 class="f-2 ttu">
1377
-
1378
- Example
1379
-
1380
- </h5>
1381
-
1382
-
1383
- <div class="mv-3 example">
1384
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lh-title measure<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
1385
- A core tenet of design is that same should be same, while
1386
- different be then different. Meaning: if two elements are
1387
- intended to be the same sort of thing, or reference the
1388
- same sort of information, they should have clear
1389
- consonance and harmony. Conversely, if two elements are
1390
- unrelated, they should be quite clearly different.
1391
- <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1392
- <div class="example-demonstration">
1393
-
1394
- <p class="lh-title measure">
1395
- A core tenet of design is that same should be same, while different be then different. Meaning: if two elements are intended to be the same sort of thing, or reference the same sort of information, they should have clear consonance and harmony. Conversely, if two elements are unrelated, they should be quite clearly different.
1396
- </p>
1397
-
1398
- </div>
1399
- </div>
1400
-
1401
-
1402
- </div>
1403
-
1404
- <div class="mt-4 flex gap-3 items-center justify-between" id="lh-copy">
1405
- <h4 class="f-4 fw-3 ws-nowrap"><code>.lh-copy</code></h4>
1406
- <pre class="f-3 highlighted-code"><span class="token selector">.lh-copy</span> <span class="token punctuation">{</span>
1407
- <span class="token property">line-height</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--lh-copy<span class="token punctuation">)</span><span class="token punctuation">;</span>
1408
- <span class="token punctuation">}</span></pre>
1409
- </div>
1410
- <div class="ml-3">
1411
- <p class="p">
1412
- <p>Leading appropriate for copy or other longform text.</p>
1413
-
1414
- </p>
1415
-
1416
- <h5 class="f-1 b">See Also</h3>
1417
- <ul class="see-also">
1418
-
1419
- <li><p><a href="/brut-css/classes/typography.html#p"><code>.p</code></a></p>
1420
- </li>
1421
-
1422
- </ul>
1423
-
1424
-
1425
- <h5 class="f-2 ttu">
1426
-
1427
- Example
1428
-
1429
- </h5>
1430
-
1431
-
1432
- <div class="mv-3 example">
1433
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>lh-copy measure<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
1434
- A core tenet of design is that same should be same, while
1435
- different be then different. Meaning: if two elements are
1436
- intended to be the same sort of thing, or reference the
1437
- same sort of information, they should have clear
1438
- consonance and harmony. Conversely, if two elements are
1439
- unrelated, they should be quite clearly different.
1440
- <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1441
- <div class="example-demonstration">
1442
-
1443
- <p class="lh-copy measure">
1444
- A core tenet of design is that same should be same, while different be then different. Meaning: if two elements are intended to be the same sort of thing, or reference the same sort of information, they should have clear consonance and harmony. Conversely, if two elements are unrelated, they should be quite clearly different.
1445
- </p>
1446
- </div>
1447
- </div>
1448
-
1449
-
1450
- </div>
1451
-
1452
-
1453
- <h3 class="f-5 mt-4" id="class-group:text-align">Text Align</h3>
1454
- <p class="p">
1455
- <p>Text alignment.</p>
1456
-
1457
- </p>
1458
-
1459
-
1460
- <div class="mt-4 flex gap-3 items-center justify-between" id="tr">
1461
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tr</code></h4>
1462
- <pre class="f-3 highlighted-code"><span class="token selector">.tr</span> <span class="token punctuation">{</span>
1463
- <span class="token property">text-align</span><span class="token punctuation">:</span> right<span class="token punctuation">;</span>
1464
- <span class="token punctuation">}</span></pre>
1465
- </div>
1466
- <div class="ml-3">
1467
- <p class="p">
1468
- <p>Right alignment</p>
1469
-
1470
- </p>
1471
-
1472
-
1473
- <h5 class="f-2 ttu">
1474
-
1475
- Example
1476
-
1477
- </h5>
1478
-
1479
-
1480
- <div class="mv-3 example">
1481
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>w-100 tr<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1482
- <div class="example-demonstration">
1483
-
1484
- <p class="w-100 tr">Things should be what they are</p>
1485
-
1486
- </div>
1487
- </div>
1488
-
1489
-
1490
- </div>
1491
-
1492
- <div class="mt-4 flex gap-3 items-center justify-between" id="tc">
1493
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tc</code></h4>
1494
- <pre class="f-3 highlighted-code"><span class="token selector">.tc</span> <span class="token punctuation">{</span>
1495
- <span class="token property">text-align</span><span class="token punctuation">:</span> center<span class="token punctuation">;</span>
1496
- <span class="token punctuation">}</span></pre>
1497
- </div>
1498
- <div class="ml-3">
1499
- <p class="p">
1500
- <p>Center-aligned text.</p>
1501
-
1502
- </p>
1503
-
1504
-
1505
- <h5 class="f-2 ttu">
1506
-
1507
- Example
1508
-
1509
- </h5>
1510
-
1511
-
1512
- <div class="mv-3 example">
1513
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>w-100 tc<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1514
- <div class="example-demonstration">
1515
-
1516
- <p class="w-100 tc">Things should be what they are</p>
1517
-
1518
- </div>
1519
- </div>
1520
-
1521
-
1522
- </div>
1523
-
1524
- <div class="mt-4 flex gap-3 items-center justify-between" id="tl">
1525
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tl</code></h4>
1526
- <pre class="f-3 highlighted-code"><span class="token selector">.tl</span> <span class="token punctuation">{</span>
1527
- <span class="token property">text-align</span><span class="token punctuation">:</span> left<span class="token punctuation">;</span>
1528
- <span class="token punctuation">}</span></pre>
1529
- </div>
1530
- <div class="ml-3">
1531
- <p class="p">
1532
- <p>Left-aligned text.</p>
1533
-
1534
- </p>
1535
-
1536
-
1537
- <h5 class="f-2 ttu">
1538
-
1539
- Example
1540
-
1541
- </h5>
1542
-
1543
-
1544
- <div class="mv-3 example">
1545
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>w-100 tl<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1546
- <div class="example-demonstration">
1547
-
1548
- <p class="w-100 tl">Things should be what they are</p>
1549
-
1550
- </div>
1551
- </div>
1552
-
1553
-
1554
- </div>
1555
-
1556
-
1557
- <h3 class="f-5 mt-4" id="class-group:text-transform">Text Transform</h3>
1558
- <p class="p">
1559
- <p>Text transformations.</p>
1560
-
1561
- </p>
1562
-
1563
-
1564
- <div class="mt-4 flex gap-3 items-center justify-between" id="ttn">
1565
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ttn</code></h4>
1566
- <pre class="f-3 highlighted-code"><span class="token selector">.ttn</span> <span class="token punctuation">{</span>
1567
- <span class="token property">text-transform</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span>
1568
- <span class="token punctuation">}</span></pre>
1569
- </div>
1570
- <div class="ml-3">
1571
- <p class="p">
1572
-
1573
- </p>
1574
-
1575
-
1576
- </div>
1577
-
1578
- <div class="mt-4 flex gap-3 items-center justify-between" id="ttu">
1579
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ttu</code></h4>
1580
- <pre class="f-3 highlighted-code"><span class="token selector">.ttu</span> <span class="token punctuation">{</span>
1581
- <span class="token property">text-transform</span><span class="token punctuation">:</span> uppercase<span class="token punctuation">;</span>
1582
- <span class="token punctuation">}</span></pre>
1583
- </div>
1584
- <div class="ml-3">
1585
- <p class="p">
1586
-
1587
- </p>
1588
-
1589
-
1590
- </div>
1591
-
1592
- <div class="mt-4 flex gap-3 items-center justify-between" id="ttl">
1593
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ttl</code></h4>
1594
- <pre class="f-3 highlighted-code"><span class="token selector">.ttl</span> <span class="token punctuation">{</span>
1595
- <span class="token property">text-transform</span><span class="token punctuation">:</span> lowercase<span class="token punctuation">;</span>
1596
- <span class="token punctuation">}</span></pre>
1597
- </div>
1598
- <div class="ml-3">
1599
- <p class="p">
1600
-
1601
- </p>
1602
-
1603
-
1604
- </div>
1605
-
1606
- <div class="mt-4 flex gap-3 items-center justify-between" id="ttc">
1607
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ttc</code></h4>
1608
- <pre class="f-3 highlighted-code"><span class="token selector">.ttc</span> <span class="token punctuation">{</span>
1609
- <span class="token property">text-transform</span><span class="token punctuation">:</span> capitalize<span class="token punctuation">;</span>
1610
- <span class="token punctuation">}</span></pre>
1611
- </div>
1612
- <div class="ml-3">
1613
- <p class="p">
1614
-
1615
- </p>
1616
-
1617
-
1618
- </div>
1619
-
1620
- <div class="mt-4 flex gap-3 items-center justify-between" id="tdn">
1621
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tdn</code></h4>
1622
- <pre class="f-3 highlighted-code"><span class="token selector">.tdn</span> <span class="token punctuation">{</span>
1623
- <span class="token property">text-decoration</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span>
1624
- <span class="token punctuation">}</span></pre>
1625
- </div>
1626
- <div class="ml-3">
1627
- <p class="p">
1628
-
1629
- </p>
1630
-
1631
-
1632
- </div>
1633
-
1634
- <div class="mt-4 flex gap-3 items-center justify-between" id="tdu">
1635
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tdu</code></h4>
1636
- <pre class="f-3 highlighted-code"><span class="token selector">.tdu</span> <span class="token punctuation">{</span>
1637
- <span class="token property">text-decoration</span><span class="token punctuation">:</span> underline<span class="token punctuation">;</span>
1638
- <span class="token punctuation">}</span></pre>
1639
- </div>
1640
- <div class="ml-3">
1641
- <p class="p">
1642
-
1643
- </p>
1644
-
1645
-
1646
- </div>
1647
-
1648
- <div class="mt-4 flex gap-3 items-center justify-between" id="u">
1649
- <h4 class="f-4 fw-3 ws-nowrap"><code>.u</code></h4>
1650
- <pre class="f-3 highlighted-code"><span class="token selector">.u</span> <span class="token punctuation">{</span>
1651
- <span class="token property">text-decoration</span><span class="token punctuation">:</span> underline<span class="token punctuation">;</span>
1652
- <span class="token punctuation">}</span></pre>
1653
- </div>
1654
- <div class="ml-3">
1655
- <p class="p">
1656
-
1657
- </p>
1658
-
1659
-
1660
- </div>
1661
-
1662
- <div class="mt-4 flex gap-3 items-center justify-between" id="tds">
1663
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tds</code></h4>
1664
- <pre class="f-3 highlighted-code"><span class="token selector">.tds</span> <span class="token punctuation">{</span>
1665
- <span class="token property">text-decoration</span><span class="token punctuation">:</span> line-through<span class="token punctuation">;</span>
1666
- <span class="token punctuation">}</span></pre>
1667
- </div>
1668
- <div class="ml-3">
1669
- <p class="p">
1670
-
1671
- </p>
1672
-
1673
-
1674
- </div>
1675
-
1676
- <div class="mt-4 flex gap-3 items-center justify-between" id="tdo">
1677
- <h4 class="f-4 fw-3 ws-nowrap"><code>.tdo</code></h4>
1678
- <pre class="f-3 highlighted-code"><span class="token selector">.tdo</span> <span class="token punctuation">{</span>
1679
- <span class="token property">text-decoration</span><span class="token punctuation">:</span> overline<span class="token punctuation">;</span>
1680
- <span class="token punctuation">}</span></pre>
1681
- </div>
1682
- <div class="ml-3">
1683
- <p class="p">
1684
-
1685
- </p>
1686
-
1687
-
1688
- </div>
1689
-
1690
-
1691
- <h3 class="f-5 mt-4" id="class-scale:indent">Indent</h3>
1692
- <p class="p">
1693
- <p>Text indents. This is a seven-step scale with -3 to positive 3.</p>
1694
-
1695
- </p>
1696
-
1697
-
1698
- <div class="mt-4 flex gap-3 items-center justify-between" id="indent--3">
1699
- <h4 class="f-4 fw-3 ws-nowrap"><code>.indent--3</code></h4>
1700
- <pre class="f-3 highlighted-code"><span class="token selector">.indent--3</span> <span class="token punctuation">{</span>
1701
- <span class="token property">text-indent</span><span class="token punctuation">:</span> <span class="token function">calc</span><span class="token punctuation">(</span> -1 * <span class="token function">var</span><span class="token punctuation">(</span>--indent-3<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
1702
- <span class="token punctuation">}</span></pre>
1703
- </div>
1704
- <div class="ml-3">
1705
- <p class="p">
1706
-
1707
- </p>
1708
-
1709
-
1710
- </div>
1711
-
1712
- <div class="mt-4 flex gap-3 items-center justify-between" id="indent--2">
1713
- <h4 class="f-4 fw-3 ws-nowrap"><code>.indent--2</code></h4>
1714
- <pre class="f-3 highlighted-code"><span class="token selector">.indent--2</span> <span class="token punctuation">{</span>
1715
- <span class="token property">text-indent</span><span class="token punctuation">:</span> <span class="token function">calc</span><span class="token punctuation">(</span> -1 * <span class="token function">var</span><span class="token punctuation">(</span>--indent-2<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
1716
- <span class="token punctuation">}</span></pre>
1717
- </div>
1718
- <div class="ml-3">
1719
- <p class="p">
1720
-
1721
- </p>
1722
-
1723
-
1724
- </div>
1725
-
1726
- <div class="mt-4 flex gap-3 items-center justify-between" id="indent--1">
1727
- <h4 class="f-4 fw-3 ws-nowrap"><code>.indent--1</code></h4>
1728
- <pre class="f-3 highlighted-code"><span class="token selector">.indent--1</span> <span class="token punctuation">{</span>
1729
- <span class="token property">text-indent</span><span class="token punctuation">:</span> <span class="token function">calc</span><span class="token punctuation">(</span> -1 * <span class="token function">var</span><span class="token punctuation">(</span>--indent-1<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
1730
- <span class="token punctuation">}</span></pre>
1731
- </div>
1732
- <div class="ml-3">
1733
- <p class="p">
1734
-
1735
- </p>
1736
-
1737
-
1738
- </div>
1739
-
1740
- <div class="mt-4 flex gap-3 items-center justify-between" id="indent-0">
1741
- <h4 class="f-4 fw-3 ws-nowrap"><code>.indent-0</code></h4>
1742
- <pre class="f-3 highlighted-code"><span class="token selector">.indent-0</span> <span class="token punctuation">{</span>
1743
- <span class="token property">text-indent</span><span class="token punctuation">:</span> 0<span class="token punctuation">;</span>
1744
- <span class="token punctuation">}</span></pre>
1745
- </div>
1746
- <div class="ml-3">
1747
- <p class="p">
1748
-
1749
- </p>
1750
-
1751
-
1752
- </div>
1753
-
1754
- <div class="mt-4 flex gap-3 items-center justify-between" id="indent-1">
1755
- <h4 class="f-4 fw-3 ws-nowrap"><code>.indent-1</code></h4>
1756
- <pre class="f-3 highlighted-code"><span class="token selector">.indent-1</span> <span class="token punctuation">{</span>
1757
- <span class="token property">text-indent</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--indent-1<span class="token punctuation">)</span><span class="token punctuation">;</span>
1758
- <span class="token punctuation">}</span></pre>
1759
- </div>
1760
- <div class="ml-3">
1761
- <p class="p">
1762
-
1763
- </p>
1764
-
1765
-
1766
- </div>
1767
-
1768
- <div class="mt-4 flex gap-3 items-center justify-between" id="indent-2">
1769
- <h4 class="f-4 fw-3 ws-nowrap"><code>.indent-2</code></h4>
1770
- <pre class="f-3 highlighted-code"><span class="token selector">.indent-2</span> <span class="token punctuation">{</span>
1771
- <span class="token property">text-indent</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--indent-2<span class="token punctuation">)</span><span class="token punctuation">;</span>
1772
- <span class="token punctuation">}</span></pre>
1773
- </div>
1774
- <div class="ml-3">
1775
- <p class="p">
1776
-
1777
- </p>
1778
-
1779
-
1780
- </div>
1781
-
1782
- <div class="mt-4 flex gap-3 items-center justify-between" id="indent-3">
1783
- <h4 class="f-4 fw-3 ws-nowrap"><code>.indent-3</code></h4>
1784
- <pre class="f-3 highlighted-code"><span class="token selector">.indent-3</span> <span class="token punctuation">{</span>
1785
- <span class="token property">text-indent</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--indent-3<span class="token punctuation">)</span><span class="token punctuation">;</span>
1786
- <span class="token punctuation">}</span></pre>
1787
- </div>
1788
- <div class="ml-3">
1789
- <p class="p">
1790
-
1791
- </p>
1792
-
1793
-
1794
- </div>
1795
-
1796
-
1797
- <h3 class="f-5 mt-4" id="class-group:text-overflow">Text Overflow</h3>
1798
- <p class="p">
1799
- <p>Text overflow</p>
1800
-
1801
- </p>
1802
-
1803
-
1804
- <div class="mt-4 flex gap-3 items-center justify-between" id="truncate">
1805
- <h4 class="f-4 fw-3 ws-nowrap"><code>.truncate</code></h4>
1806
- <pre class="f-3 highlighted-code"><span class="token selector">.truncate</span> <span class="token punctuation">{</span>
1807
- <span class="token property">text-overflow</span><span class="token punctuation">:</span> ellipsis<span class="token punctuation">;</span>
1808
- <span class="token punctuation">}</span></pre>
1809
- </div>
1810
- <div class="ml-3">
1811
- <p class="p">
1812
-
1813
- </p>
1814
-
1815
-
1816
- </div>
1817
-
1818
- <div class="mt-4 flex gap-3 items-center justify-between" id="clip">
1819
- <h4 class="f-4 fw-3 ws-nowrap"><code>.clip</code></h4>
1820
- <pre class="f-3 highlighted-code"><span class="token selector">.clip</span> <span class="token punctuation">{</span>
1821
- <span class="token property">text-overflow</span><span class="token punctuation">:</span> clip<span class="token punctuation">;</span>
1822
- <span class="token punctuation">}</span></pre>
1823
- </div>
1824
- <div class="ml-3">
1825
- <p class="p">
1826
-
1827
- </p>
1828
-
1829
-
1830
- </div>
1831
-
1832
-
1833
- <h3 class="f-5 mt-4" id="class-group:whitespace">Whitespace</h3>
1834
- <p class="p">
1835
- <p>Whitespace</p>
1836
-
1837
- </p>
1838
-
1839
-
1840
- <div class="mt-4 flex gap-3 items-center justify-between" id="ws-normal">
1841
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ws-normal</code></h4>
1842
- <pre class="f-3 highlighted-code"><span class="token selector">.ws-normal</span> <span class="token punctuation">{</span>
1843
- <span class="token property">white-space</span><span class="token punctuation">:</span> normal<span class="token punctuation">;</span>
1844
- <span class="token punctuation">}</span></pre>
1845
- </div>
1846
- <div class="ml-3">
1847
- <p class="p">
1848
-
1849
- </p>
1850
-
1851
-
1852
- </div>
1853
-
1854
- <div class="mt-4 flex gap-3 items-center justify-between" id="ws-nowrap">
1855
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ws-nowrap</code></h4>
1856
- <pre class="f-3 highlighted-code"><span class="token selector">.ws-nowrap</span> <span class="token punctuation">{</span>
1857
- <span class="token property">white-space</span><span class="token punctuation">:</span> nowrap<span class="token punctuation">;</span>
1858
- <span class="token punctuation">}</span></pre>
1859
- </div>
1860
- <div class="ml-3">
1861
- <p class="p">
1862
-
1863
- </p>
1864
-
1865
-
1866
- </div>
1867
-
1868
- <div class="mt-4 flex gap-3 items-center justify-between" id="ws-pre">
1869
- <h4 class="f-4 fw-3 ws-nowrap"><code>.ws-pre</code></h4>
1870
- <pre class="f-3 highlighted-code"><span class="token selector">.ws-pre</span> <span class="token punctuation">{</span>
1871
- <span class="token property">white-space</span><span class="token punctuation">:</span> pre<span class="token punctuation">;</span>
1872
- <span class="token punctuation">}</span></pre>
1873
- </div>
1874
- <div class="ml-3">
1875
- <p class="p">
1876
-
1877
- </p>
1878
-
1879
-
1880
- </div>
1881
-
1882
-
1883
- <h3 class="f-5 mt-4" id="class-group:measure">Measure/Text Width</h3>
1884
- <p class="p">
1885
- <p>Maximum widths useful for text blocks.</p>
1886
-
1887
- </p>
1888
-
1889
-
1890
- <div class="mt-4 flex gap-3 items-center justify-between" id="measure">
1891
- <h4 class="f-4 fw-3 ws-nowrap"><code>.measure</code></h4>
1892
- <pre class="f-3 highlighted-code"><span class="token selector">.measure</span> <span class="token punctuation">{</span>
1893
- <span class="token property">max-width</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--tw<span class="token punctuation">)</span><span class="token punctuation">;</span>
1894
- <span class="token punctuation">}</span></pre>
1895
- </div>
1896
- <div class="ml-3">
1897
- <p class="p">
1898
- <p>A standard text width useful for any occassion. This should provide a comfortable reading experience for any font and size.</p>
1899
-
1900
- </p>
1901
-
1902
-
1903
- <h5 class="f-2 ttu">
1904
-
1905
- Example
1906
-
1907
- </h5>
1908
-
1909
-
1910
- <div class="mv-3 example">
1911
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>measure<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
1912
- A core tenet of design is that same should be same, while
1913
- different be then different. Meaning: if two elements are
1914
- intended to be the same sort of thing, or reference the
1915
- same sort of information, they should have clear
1916
- consonance and harmony. Conversely, if two elements are
1917
- unrelated, they should be quite clearly different.
1918
- <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1919
- <div class="example-demonstration">
1920
-
1921
- <p class="measure">
1922
- A core tenet of design is that same should be same, while different be then different. Meaning: if two elements are intended to be the same sort of thing, or reference the same sort of information, they should have clear consonance and harmony. Conversely, if two elements are unrelated, they should be quite clearly different.
1923
- </p>
1924
-
1925
- </div>
1926
- </div>
1927
-
1928
-
1929
- </div>
1930
-
1931
- <div class="mt-4 flex gap-3 items-center justify-between" id="measure-wide">
1932
- <h4 class="f-4 fw-3 ws-nowrap"><code>.measure-wide</code></h4>
1933
- <pre class="f-3 highlighted-code"><span class="token selector">.measure-wide</span> <span class="token punctuation">{</span>
1934
- <span class="token property">max-width</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--tw-wide<span class="token punctuation">)</span><span class="token punctuation">;</span>
1935
- <span class="token punctuation">}</span></pre>
1936
- </div>
1937
- <div class="ml-3">
1938
- <p class="p">
1939
- <p>A slighter wider, but still readable width.</p>
1940
-
1941
- </p>
1942
-
1943
-
1944
- <h5 class="f-2 ttu">
1945
-
1946
- Example
1947
-
1948
- </h5>
1949
-
1950
-
1951
- <div class="mv-3 example">
1952
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>measure-wide<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
1953
- A core tenet of design is that same should be same, while
1954
- different be then different. Meaning: if two elements are
1955
- intended to be the same sort of thing, or reference the
1956
- same sort of information, they should have clear
1957
- consonance and harmony. Conversely, if two elements are
1958
- unrelated, they should be quite clearly different.
1959
- <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
1960
- <div class="example-demonstration">
1961
-
1962
- <p class="measure-wide">
1963
- A core tenet of design is that same should be same, while different be then different. Meaning: if two elements are intended to be the same sort of thing, or reference the same sort of information, they should have clear consonance and harmony. Conversely, if two elements are unrelated, they should be quite clearly different.
1964
- </p>
1965
-
1966
- </div>
1967
- </div>
1968
-
1969
-
1970
- </div>
1971
-
1972
- <div class="mt-4 flex gap-3 items-center justify-between" id="measure-narrow">
1973
- <h4 class="f-4 fw-3 ws-nowrap"><code>.measure-narrow</code></h4>
1974
- <pre class="f-3 highlighted-code"><span class="token selector">.measure-narrow</span> <span class="token punctuation">{</span>
1975
- <span class="token property">max-width</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--tw-narrow<span class="token punctuation">)</span><span class="token punctuation">;</span>
1976
- <span class="token punctuation">}</span></pre>
1977
- </div>
1978
- <div class="ml-3">
1979
- <p class="p">
1980
- <p>A slighter narrower, but still readable width.</p>
1981
-
1982
- </p>
1983
-
1984
-
1985
- <h5 class="f-2 ttu">
1986
-
1987
- Example
1988
-
1989
- </h5>
1990
-
1991
-
1992
- <div class="mv-3 example">
1993
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>measure-narrow<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
1994
- A core tenet of design is that same should be same, while
1995
- different be then different. Meaning: if two elements are
1996
- intended to be the same sort of thing, or reference the
1997
- same sort of information, they should have clear
1998
- consonance and harmony. Conversely, if two elements are
1999
- unrelated, they should be quite clearly different.
2000
- <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
2001
- <div class="example-demonstration">
2002
-
2003
- <p class="measure-narrow">
2004
- A core tenet of design is that same should be same, while different be then different. Meaning: if two elements are intended to be the same sort of thing, or reference the same sort of information, they should have clear consonance and harmony. Conversely, if two elements are unrelated, they should be quite clearly different.
2005
- </p>
2006
-
2007
- </div>
2008
- </div>
2009
-
2010
-
2011
- </div>
2012
-
2013
-
2014
- <h3 class="f-5 mt-4" id="class-group:typography-aliases">Typography Aliases</h3>
2015
- <p class="p">
2016
- <p>Aliases to save precious keystrokes.</p>
2017
-
2018
- </p>
2019
-
2020
-
2021
- <div class="mt-4 flex gap-3 items-center justify-between" id="p">
2022
- <h4 class="f-4 fw-3 ws-nowrap"><code>.p</code></h4>
2023
- <pre class="f-3 highlighted-code"><span class="token selector">.p</span> <span class="token punctuation">{</span>
2024
- <span class="token property">max-width</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--tw<span class="token punctuation">)</span><span class="token punctuation">;</span>
2025
- <span class="token property">line-height</span><span class="token punctuation">:</span> <span class="token function">var</span><span class="token punctuation">(</span>--lh-copy<span class="token punctuation">)</span><span class="token punctuation">;</span>
2026
- <span class="token punctuation">}</span></pre>
2027
- </div>
2028
- <div class="ml-3">
2029
- <p class="p">
2030
- <p>Set reasonable typography for some text, namely, setting <a href="/brut-css/classes/typography.html#measure"><code>.measure</code></a> and <a href="/brut-css/classes/typography.html#lh-copy"><code>.lh-copy</code></a> at the same time.</p>
2031
-
2032
- </p>
2033
-
2034
-
2035
- <h5 class="f-2 ttu">
2036
-
2037
- Example
2038
-
2039
- </h5>
2040
-
2041
-
2042
- <div class="mv-3 example">
2043
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>p<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
2044
- A core tenet of design is that same should be same, while
2045
- different be then different. Meaning: if two elements are
2046
- intended to be the same sort of thing, or reference the
2047
- same sort of information, they should have clear
2048
- consonance and harmony. Conversely, if two elements are
2049
- unrelated, they should be quite clearly different.
2050
- <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span></pre>
2051
- <div class="example-demonstration">
2052
-
2053
- <div class="p">
2054
- A core tenet of design is that same should be same, while different be then different. Meaning: if two elements are intended to be the same sort of thing, or reference the same sort of information, they should have clear consonance and harmony. Conversely, if two elements are unrelated, they should be quite clearly different.
2055
- </div>
2056
-
2057
- </div>
2058
- </div>
2059
-
2060
-
2061
- </div>
2062
-
2063
- <div class="mt-4 flex gap-3 items-center justify-between" id="b">
2064
- <h4 class="f-4 fw-3 ws-nowrap"><code>.b</code></h4>
2065
- <pre class="f-3 highlighted-code"><span class="token selector">.b</span> <span class="token punctuation">{</span>
2066
- <span class="token property">font-weight</span><span class="token punctuation">:</span> bold<span class="token punctuation">;</span>
2067
- <span class="token punctuation">}</span></pre>
2068
- </div>
2069
- <div class="ml-3">
2070
- <p class="p">
2071
- <p>Shorthand for a bold font.</p>
2072
-
2073
- </p>
2074
-
2075
-
2076
- <h5 class="f-2 ttu">
2077
-
2078
- Example
2079
-
2080
- </h5>
2081
-
2082
-
2083
- <div class="mv-3 example">
2084
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>b<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
2085
- <div class="example-demonstration">
2086
-
2087
- <p class="b">Things should be what they are</p>
2088
-
2089
- </div>
2090
- </div>
2091
-
2092
-
2093
- </div>
2094
-
2095
- <div class="mt-4 flex gap-3 items-center justify-between" id="sc">
2096
- <h4 class="f-4 fw-3 ws-nowrap"><code>.sc</code></h4>
2097
- <pre class="f-3 highlighted-code"><span class="token selector">.sc</span> <span class="token punctuation">{</span>
2098
- <span class="token property">font-variant</span><span class="token punctuation">:</span> small-caps<span class="token punctuation">;</span>
2099
- <span class="token punctuation">}</span></pre>
2100
- </div>
2101
- <div class="ml-3">
2102
- <p class="p">
2103
- <p>Shorthand for small-caps</p>
2104
-
2105
- </p>
2106
-
2107
-
2108
- <h5 class="f-2 ttu">
2109
-
2110
- Example
2111
-
2112
- </h5>
2113
-
2114
-
2115
- <div class="mv-3 example">
2116
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>sc<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
2117
- <div class="example-demonstration">
2118
-
2119
- <p class="sc">Things should be what they are</p>
2120
-
2121
- </div>
2122
- </div>
2123
-
2124
-
2125
- </div>
2126
-
2127
- <div class="mt-4 flex gap-3 items-center justify-between" id="i">
2128
- <h4 class="f-4 fw-3 ws-nowrap"><code>.i</code></h4>
2129
- <pre class="f-3 highlighted-code"><span class="token selector">.i</span> <span class="token punctuation">{</span>
2130
- <span class="token property">font-style</span><span class="token punctuation">:</span> italic<span class="token punctuation">;</span>
2131
- <span class="token punctuation">}</span></pre>
2132
- </div>
2133
- <div class="ml-3">
2134
- <p class="p">
2135
- <p>Shorthand for italic</p>
2136
-
2137
- </p>
2138
-
2139
-
2140
- <h5 class="f-2 ttu">
2141
-
2142
- Example
2143
-
2144
- </h5>
2145
-
2146
-
2147
- <div class="mv-3 example">
2148
- <pre class="highlighted-code"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>p</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>i<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Things should be what they are<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>p</span><span class="token punctuation">></span></span></pre>
2149
- <div class="example-demonstration">
2150
-
2151
- <p class="i">Things should be what they are</p>
2152
-
2153
- </div>
2154
- </div>
2155
-
2156
-
2157
- </div>
2158
-
2159
-
2160
- </article>
2161
- <div class="z-5 ma-0 overflow-y-auto pa-2 w-20 h-100 pos-absolute top-0 right-2">
2162
- <div class="pa-3 ba bc-gray-700 bg-gray-900 br-3 shadow-1 ridiculous-liquid-glass-is-all-the-rage">
2163
- <h3>On this Page</h3>
2164
- <ul class="lst-none ma-0 pa-0">
2165
-
2166
- <li class="lh-copy"><a href="#class-group:font-family">Font Family</a></li>
2167
-
2168
- <li class="lh-copy"><a href="#class-scale:font-size">Font Size</a></li>
2169
-
2170
- <li class="lh-copy"><a href="#class-scale:font-weights">Font Weights</a></li>
2171
-
2172
- <li class="lh-copy"><a href="#class-group:styles-variants">Styles Variants</a></li>
2173
-
2174
- <li class="lh-copy"><a href="#class-group:tracking">Tracking</a></li>
2175
-
2176
- <li class="lh-copy"><a href="#class-group:leading">Leading/Line Height</a></li>
2177
-
2178
- <li class="lh-copy"><a href="#class-group:text-align">Text Align</a></li>
2179
-
2180
- <li class="lh-copy"><a href="#class-group:text-transform">Text Transform</a></li>
2181
-
2182
- <li class="lh-copy"><a href="#class-scale:indent">Indent</a></li>
2183
-
2184
- <li class="lh-copy"><a href="#class-group:text-overflow">Text Overflow</a></li>
2185
-
2186
- <li class="lh-copy"><a href="#class-group:whitespace">Whitespace</a></li>
2187
-
2188
- <li class="lh-copy"><a href="#class-group:measure">Measure/Text Width</a></li>
2189
-
2190
- <li class="lh-copy"><a href="#class-group:typography-aliases">Typography Aliases</a></li>
2191
-
2192
- </ul>
2193
- </div>
2194
- </div>
2195
- </div>
2196
- <footer class="bg-black white mt-auto">
2197
- <p class="tc">
2198
- Copyright &copy; 2025 David Bryant Copeland.
2199
- </p>
2200
- </footer>
2201
- </section>
2202
- </main>
2203
- </body>
2204
-
2205
- </html>
2206
-