easyfaa 0.20.0 → 1.0.0

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 (207) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +131 -468
  3. data/README.md +49 -222
  4. data/app/assets/fonts/easy/outfit-latin-ext.woff2 +0 -0
  5. data/app/assets/fonts/easy/outfit-latin.woff2 +0 -0
  6. data/app/assets/images/easy/favicon.ico +0 -0
  7. data/app/assets/images/easy/favicon.svg +11 -0
  8. data/app/assets/images/easy/sprite.svg +52 -0
  9. data/app/assets/javascripts/easy/add_rows.js +38 -0
  10. data/app/assets/javascripts/easy/flyer.js +100 -0
  11. data/app/assets/javascripts/easy/highlight.js +54 -0
  12. data/app/assets/javascripts/easy/konami.js +73 -0
  13. data/app/assets/javascripts/easy/modal.js +49 -0
  14. data/app/assets/javascripts/easy/pin_code.js +43 -0
  15. data/app/assets/javascripts/easy/report_sort.js +57 -0
  16. data/app/assets/javascripts/easy/rotating_placeholder.js +35 -0
  17. data/app/assets/javascripts/easy/step_foot.js +17 -0
  18. data/app/assets/javascripts/easy/switches.js +96 -0
  19. data/app/assets/javascripts/easy/switches_address.js +39 -0
  20. data/app/assets/javascripts/easy/tabs.js +35 -0
  21. data/app/assets/javascripts/easy/theme.js +41 -0
  22. data/app/assets/stylesheets/easy/base.css +42 -0
  23. data/app/assets/stylesheets/easy/components.css +533 -0
  24. data/app/assets/stylesheets/easy/layout.css +47 -0
  25. data/app/assets/stylesheets/easy/tokens.css +11 -0
  26. data/app/controllers/easyfaa/errors_controller.rb +41 -0
  27. data/app/helpers/easyfaa/easy_helper.rb +58 -0
  28. data/app/models/aircraft_avatar.rb +61 -0
  29. data/app/views/easy/_ad_card.html.erb +16 -0
  30. data/app/views/easy/_ad_list.html.erb +11 -0
  31. data/app/views/easy/_flyer.html.erb +10 -0
  32. data/app/views/easy/_logo.html.erb +15 -0
  33. data/app/views/easy/_modal.html.erb +17 -0
  34. data/app/views/easy/_part_tabs.html.erb +24 -0
  35. data/app/views/easy/_pin_code.html.erb +10 -0
  36. data/app/views/easy/_report_head.html.erb +28 -0
  37. data/app/views/easy/mailer/_button.html.erb +10 -0
  38. data/app/views/easy/mailer/_card.html.erb +23 -0
  39. data/app/views/easy/mailer/_code.html.erb +28 -0
  40. data/app/views/easy/mailer/_code.text.erb +19 -0
  41. data/app/views/easy/mailer/_frame.html.erb +35 -0
  42. data/app/views/easy/mailer/_text.html.erb +7 -0
  43. data/app/views/easyfaa/errors/show.html.erb +17 -0
  44. data/app/views/layouts/easy/site.html.erb +55 -0
  45. data/app/views/layouts/easyfaa/errors.html.erb +30 -0
  46. data/config/aircraft_avatars.yml +26 -0
  47. data/lib/easyfaa/engine.rb +16 -43
  48. data/lib/easyfaa/version.rb +2 -2
  49. data/lib/easyfaa.rb +14 -35
  50. metadata +52 -181
  51. data/app/views/layouts/easyfaa.html.erb +0 -24
  52. data/app/views/recourses/_head.html.erb +0 -3
  53. data/art/autopilot.svg +0 -9
  54. data/art/cube.svg +0 -9
  55. data/art/design.svg +0 -8
  56. data/art/down.html.erb +0 -95
  57. data/art/easyfaa.svg +0 -7
  58. data/art/fountain.svg +0 -9
  59. data/art/goldrush.svg +0 -7
  60. data/art/houston.svg +0 -8
  61. data/art/icons.txt +0 -185
  62. data/art/index.html.erb +0 -157
  63. data/config/locales/easyfaa.en.yml +0 -7
  64. data/lib/easyfaa/copy.rb +0 -5
  65. data/lib/easyfaa/down.rb +0 -19
  66. data/lib/easyfaa/helpers/flows.rb +0 -53
  67. data/lib/easyfaa/helpers/heads.rb +0 -60
  68. data/lib/easyfaa/helpers/logos.rb +0 -43
  69. data/lib/easyfaa/helpers.rb +0 -11
  70. data/lib/easyfaa/marks.rb +0 -16
  71. data/public/404.html +0 -118
  72. data/public/_headers +0 -28
  73. data/public/bh/css/bh.css +0 -1
  74. data/public/bh/js/bh.js +0 -152
  75. data/public/bh/theme/bootstrap.css +0 -10
  76. data/public/bh/theme/dawn.css +0 -189
  77. data/public/bh/theme/dracula.css +0 -189
  78. data/public/bh/theme/gruvbox.css +0 -189
  79. data/public/bh/theme/monokai.css +0 -190
  80. data/public/bh/theme/nord.css +0 -189
  81. data/public/bh/theme/one_dark.css +0 -189
  82. data/public/bh/theme/solarized.css +0 -188
  83. data/public/bh/theme/tokyo_night.css +0 -189
  84. data/public/css/easyfaa.css +0 -1
  85. data/public/down/autopilot.html +0 -87
  86. data/public/down/cube.html +0 -87
  87. data/public/down/design.html +0 -87
  88. data/public/down/easyfaa.html +0 -84
  89. data/public/down/fountain.html +0 -87
  90. data/public/down/goldrush.html +0 -87
  91. data/public/down/houston.html +0 -87
  92. data/public/favicon/autopilot-180.png +0 -0
  93. data/public/favicon/autopilot-192.png +0 -0
  94. data/public/favicon/autopilot-512.png +0 -0
  95. data/public/favicon/autopilot-96.png +0 -0
  96. data/public/favicon/autopilot-dev.svg +0 -9
  97. data/public/favicon/autopilot.ico +0 -0
  98. data/public/favicon/autopilot.svg +0 -9
  99. data/public/favicon/autopilot.webmanifest +0 -12
  100. data/public/favicon/cube-180.png +0 -0
  101. data/public/favicon/cube-192.png +0 -0
  102. data/public/favicon/cube-512.png +0 -0
  103. data/public/favicon/cube-96.png +0 -0
  104. data/public/favicon/cube-dev.svg +0 -9
  105. data/public/favicon/cube.ico +0 -0
  106. data/public/favicon/cube.svg +0 -9
  107. data/public/favicon/cube.webmanifest +0 -12
  108. data/public/favicon/design-180.png +0 -0
  109. data/public/favicon/design-192.png +0 -0
  110. data/public/favicon/design-512.png +0 -0
  111. data/public/favicon/design-96.png +0 -0
  112. data/public/favicon/design-dev.svg +0 -8
  113. data/public/favicon/design.ico +0 -0
  114. data/public/favicon/design.svg +0 -8
  115. data/public/favicon/design.webmanifest +0 -12
  116. data/public/favicon/easyfaa-180.png +0 -0
  117. data/public/favicon/easyfaa-192.png +0 -0
  118. data/public/favicon/easyfaa-512.png +0 -0
  119. data/public/favicon/easyfaa-96.png +0 -0
  120. data/public/favicon/easyfaa-dev.svg +0 -7
  121. data/public/favicon/easyfaa.ico +0 -0
  122. data/public/favicon/easyfaa.svg +0 -7
  123. data/public/favicon/easyfaa.webmanifest +0 -12
  124. data/public/favicon/fountain-180.png +0 -0
  125. data/public/favicon/fountain-192.png +0 -0
  126. data/public/favicon/fountain-512.png +0 -0
  127. data/public/favicon/fountain-96.png +0 -0
  128. data/public/favicon/fountain-dev.svg +0 -9
  129. data/public/favicon/fountain.ico +0 -0
  130. data/public/favicon/fountain.svg +0 -9
  131. data/public/favicon/fountain.webmanifest +0 -12
  132. data/public/favicon/goldrush-180.png +0 -0
  133. data/public/favicon/goldrush-192.png +0 -0
  134. data/public/favicon/goldrush-512.png +0 -0
  135. data/public/favicon/goldrush-96.png +0 -0
  136. data/public/favicon/goldrush-dev.svg +0 -7
  137. data/public/favicon/goldrush.ico +0 -0
  138. data/public/favicon/goldrush.svg +0 -7
  139. data/public/favicon/goldrush.webmanifest +0 -12
  140. data/public/favicon/houston-180.png +0 -0
  141. data/public/favicon/houston-192.png +0 -0
  142. data/public/favicon/houston-512.png +0 -0
  143. data/public/favicon/houston-96.png +0 -0
  144. data/public/favicon/houston-dev.svg +0 -8
  145. data/public/favicon/houston.ico +0 -0
  146. data/public/favicon/houston.svg +0 -8
  147. data/public/favicon/houston.webmanifest +0 -12
  148. data/public/favicon.ico +0 -0
  149. data/public/font/bootstrap-icons-6LILWPE2.woff2 +0 -0
  150. data/public/font/bootstrap-icons-FRBPO3H7.woff2 +0 -0
  151. data/public/font/ibm-plex-sans-500-latin-LA7QXWWL.woff2 +0 -0
  152. data/public/font/ibm-plex-sans-500-latin-ext-X4QHZICY.woff2 +0 -0
  153. data/public/font/ibm-plex-sans-500-latin-ext.woff2 +0 -0
  154. data/public/font/ibm-plex-sans-500-latin.woff2 +0 -0
  155. data/public/font/ibm-plex-sans-500-vietnamese-24B6BSND.woff2 +0 -0
  156. data/public/font/ibm-plex-sans-500-vietnamese.woff2 +0 -0
  157. data/public/index.html +0 -165
  158. data/public/js/easyfaa.js +0 -1
  159. data/public/logo/autopilot.png +0 -0
  160. data/public/logo/autopilot.svg +0 -9
  161. data/public/logo/cube.png +0 -0
  162. data/public/logo/cube.svg +0 -9
  163. data/public/logo/design.png +0 -0
  164. data/public/logo/design.svg +0 -8
  165. data/public/logo/easyfaa.png +0 -0
  166. data/public/logo/easyfaa.svg +0 -7
  167. data/public/logo/fountain.png +0 -0
  168. data/public/logo/fountain.svg +0 -9
  169. data/public/logo/goldrush.png +0 -0
  170. data/public/logo/goldrush.svg +0 -7
  171. data/public/logo/houston.png +0 -0
  172. data/public/logo/houston.svg +0 -8
  173. data/public/page/400.html +0 -118
  174. data/public/page/404.html +0 -118
  175. data/public/page/406-unsupported-browser.html +0 -118
  176. data/public/page/422.html +0 -118
  177. data/public/page/500.html +0 -118
  178. data/public/site.webmanifest +0 -12
  179. data/public/theme/bootstrap.css +0 -10
  180. data/public/theme/dawn.css +0 -189
  181. data/public/theme/dracula.css +0 -189
  182. data/public/theme/gruvbox.css +0 -189
  183. data/public/theme/monokai.css +0 -190
  184. data/public/theme/nord.css +0 -189
  185. data/public/theme/one_dark.css +0 -189
  186. data/public/theme/solarized.css +0 -188
  187. data/public/theme/tokyo_night.css +0 -189
  188. data/public/v0.20.0/bh/css/bh.css +0 -1
  189. data/public/v0.20.0/bh/js/bh.js +0 -152
  190. data/public/v0.20.0/bh/theme/bootstrap.css +0 -10
  191. data/public/v0.20.0/bh/theme/dawn.css +0 -189
  192. data/public/v0.20.0/bh/theme/dracula.css +0 -189
  193. data/public/v0.20.0/bh/theme/gruvbox.css +0 -189
  194. data/public/v0.20.0/bh/theme/monokai.css +0 -190
  195. data/public/v0.20.0/bh/theme/nord.css +0 -189
  196. data/public/v0.20.0/bh/theme/one_dark.css +0 -189
  197. data/public/v0.20.0/bh/theme/solarized.css +0 -188
  198. data/public/v0.20.0/bh/theme/tokyo_night.css +0 -189
  199. data/public/v0.20.0/css/easyfaa.css +0 -1
  200. data/public/v0.20.0/font/bootstrap-icons-FRBPO3H7.woff2 +0 -0
  201. data/public/v0.20.0/font/ibm-plex-sans-500-latin-LA7QXWWL.woff2 +0 -0
  202. data/public/v0.20.0/font/ibm-plex-sans-500-latin-ext-X4QHZICY.woff2 +0 -0
  203. data/public/v0.20.0/font/ibm-plex-sans-500-latin-ext.woff2 +0 -0
  204. data/public/v0.20.0/font/ibm-plex-sans-500-latin.woff2 +0 -0
  205. data/public/v0.20.0/font/ibm-plex-sans-500-vietnamese-24B6BSND.woff2 +0 -0
  206. data/public/v0.20.0/font/ibm-plex-sans-500-vietnamese.woff2 +0 -0
  207. data/public/v0.20.0/js/easyfaa.js +0 -1
data/art/icons.txt DELETED
@@ -1,185 +0,0 @@
1
- # Every Bootstrap Icon a easyfaa page may draw: the ones unicon names for its concepts,
2
- # and the few written out by name in recourse and here. The icon font and its stylesheet
3
- # are cut down to these by rake icons; a name missing here is a blank box on a page.
4
- airplane
5
- alarm
6
- archive
7
- arrow-clockwise
8
- arrow-counterclockwise
9
- arrow-down
10
- arrow-left
11
- arrow-right
12
- arrow-up
13
- arrows-angle-contract
14
- arrows-angle-expand
15
- award
16
- bag
17
- bank
18
- bar-chart
19
- battery
20
- bell
21
- bicycle
22
- book
23
- bookmark
24
- bookmark-fill
25
- box
26
- box-arrow-in-right
27
- box-arrow-right
28
- briefcase
29
- brush
30
- building
31
- bus-front
32
- c-circle
33
- calendar
34
- calendar-check
35
- camera
36
- camera-video
37
- car-front
38
- card-checklist
39
- cart
40
- cash
41
- chat
42
- check
43
- check-circle
44
- check-circle-fill
45
- check2-square
46
- chevron-down
47
- chevron-left
48
- chevron-right
49
- chevron-up
50
- circle
51
- clipboard
52
- clock
53
- cloud
54
- cloud-rain
55
- collection-play
56
- compass
57
- copy
58
- credit-card
59
- dash
60
- display
61
- download
62
- droplet
63
- emoji-smile
64
- envelope
65
- exclamation-triangle
66
- eye
67
- eye-slash
68
- file-earmark
69
- file-earmark-text
70
- fingerprint
71
- fire
72
- flag
73
- folder
74
- funnel
75
- gear
76
- geo
77
- geo-alt
78
- gift
79
- globe
80
- graph-up
81
- grid
82
- grip-vertical
83
- hammer
84
- hand-thumbs-down
85
- hand-thumbs-up
86
- hdd-rack
87
- headphones
88
- heart
89
- hospital
90
- hourglass
91
- house
92
- image
93
- inbox
94
- infinity
95
- info-circle
96
- key
97
- keyboard
98
- laptop
99
- layout-sidebar
100
- lightbulb
101
- lightning
102
- link
103
- list
104
- list-ul
105
- lock
106
- magic
107
- map
108
- megaphone
109
- mic
110
- moon
111
- moon-fill
112
- music-note
113
- palette
114
- paperclip
115
- pause
116
- pen
117
- pencil
118
- people
119
- percent
120
- person
121
- person-circle
122
- person-dash
123
- person-plus
124
- person-rolodex
125
- person-vcard
126
- phone
127
- pie-chart
128
- play
129
- plus
130
- power
131
- printer
132
- puzzle
133
- qr-code
134
- question-circle
135
- receipt
136
- repeat
137
- reply
138
- rulers
139
- scissors
140
- search
141
- send
142
- share
143
- shield
144
- shop
145
- shuffle
146
- signpost-split
147
- skip-forward
148
- sliders
149
- snow
150
- sort-down
151
- sort-up
152
- soundwave
153
- speedometer
154
- square
155
- star
156
- sticky
157
- stop
158
- stopwatch
159
- sun
160
- sun-fill
161
- table
162
- tag
163
- telephone
164
- terminal
165
- three-dots
166
- ticket
167
- tools
168
- train-front
169
- trash
170
- tree
171
- trophy
172
- truck
173
- unlock
174
- upc
175
- upload
176
- volume-up
177
- wallet
178
- wifi
179
- window
180
- wrench
181
- x
182
- x-circle
183
- x-lg
184
- zoom-in
185
- zoom-out
data/art/index.html.erb DELETED
@@ -1,157 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang='en'>
3
- <head>
4
- <meta charset='utf-8'>
5
- <title>easyfaa design</title>
6
- <meta name='viewport' content='width=device-width, initial-scale=1'>
7
- <meta name='color-scheme' content='light dark'>
8
- <meta name='description' content='Every asset a easyfaa app loads, and every component the easyfaa gem draws, in one place.'>
9
- <link rel='icon' href='favicon/design.svg' type='image/svg+xml'>
10
- <link rel='icon' href='favicon/design-96.png' type='image/png' sizes='96x96'>
11
- <link rel='apple-touch-icon' href='favicon/design-180.png'>
12
- <link rel='manifest' href='site.webmanifest'>
13
- <!-- The same files every easyfaa page loads, under the version the head helper
14
- pins a host to, so the page is drawn by the bytes it hands out rather than by
15
- whatever was last built. Relative, so it reads the same on staging, on production
16
- and from a folder on disk. -->
17
- <link rel='stylesheet' href='v<%= version %>/bh/css/bh.css'>
18
- <link rel='stylesheet' href='v<%= version %>/css/easyfaa.css'>
19
- <link rel='stylesheet' href='v<%= version %>/bh/theme/bootstrap.css' data-recourse-theme=''>
20
- <script type='module' src='v<%= version %>/bh/js/bh.js'></script>
21
- <script type='module' src='v<%= version %>/js/easyfaa.js'></script>
22
- <style>
23
- /* The page's own chrome and nothing else: everything shown below is styled by
24
- the pinned easyfaa.css alone, which is the point of showing it. */
25
- .design-section { padding-block: 2rem; border-block-end: var(--bs-border-width) solid var(--bs-border-color); }
26
- .design-section > p { max-width: 48rem; margin-inline: auto; }
27
- .design-subsection { margin-block-start: 2.5rem; padding-block-start: 1.5rem; border-block-start: var(--bs-border-width) dashed var(--bs-border-color); }
28
- .design-mark { width: 1.5rem; height: 1.5rem; }
29
- .design-logo { width: 2.5rem; height: 2.5rem; }
30
- .design-url { font-family: var(--bs-font-monospace); font-size: var(--bs-font-size-sm); color: var(--bs-fg-2); overflow-wrap: anywhere; }
31
- .design-shell { height: 18rem; border: var(--bs-border-width) solid var(--bs-border-color); border-radius: var(--bs-radius-3); overflow: hidden; }
32
- .design-shell .recourse-shell { height: 100%; }
33
- .chat-thread { max-width: 36rem; margin-inline: auto; }
34
- </style>
35
- </head>
36
- <body class='text-center'>
37
- <header class='container-fluid px-3 py-3 border-bottom d-flex flex-wrap justify-content-center align-items-baseline gap-3'>
38
- <a class='lockup plex' href='#'><svg aria-hidden='true' style='width: 1.0515em; height: 1.0515em; top: 0.18625em' viewBox='0 0 512 512'><g fill='none' stroke='#5aa9e6' stroke-width='28' stroke-linecap='round' stroke-linejoin='round' transform='rotate(45 256 256)'><path d='M196 60 L316 60 L316 372 L196 372 Z'/><path d='M196 120 L316 120'/><path d='M196 372 L256 470 L316 372'/><path d='M232 431 L256 470 L280 431 Z' fill='#0b1e3a'/></g></svg>design</a>
39
- <nav class='fg-2'>the <a href='#lockup'>lockups</a>, <a href='#theme'>themes</a>, <a href='#page'>pages</a>, <a href='#favicon'>icons</a> shared by <a href='https://pro.houseaccount.com/bookings' title='Fountain'><img class='design-mark' src='logo/fountain.svg' alt='Fountain'></a> <a href='https://gold.houseaccount.com/specialty_matches' title='Goldrush'><img class='design-mark' src='logo/goldrush.svg' alt='Goldrush'></a> <a href='https://providers.houseaccount.com/providers' title='Houston'><img class='design-mark' src='logo/houston.svg' alt='Houston'></a> <a href='https://checkout.houseaccount.com/providers' title='Autopilot'><img class='design-mark' src='logo/autopilot.svg' alt='Autopilot'></a></nav>
40
- </header>
41
-
42
- <main class='container-fluid px-3'>
43
- <section class='design-section'>
44
- <h1 class='plex'>Multiple apps, same front-end</h1>
45
- <div class='row g-3 mx-auto' style='max-width: 60rem'>
46
- <div class='col-12 md:col-6'>
47
- <div class='card p-3'>
48
- <strong>Stylesheet</strong>
49
- <a class='design-url' href='css/easyfaa.css'><span class='d-none sm:d-inline'>https://design.easyfaa.com/</span>css/easyfaa.css</a>
50
- <span class='small fg-2 mt-1'>bh's Bootstrap 6, then the icon subset and the brand</span>
51
- </div>
52
- </div>
53
- <div class='col-12 md:col-6'>
54
- <div class='card p-3'>
55
- <strong>Script</strong>
56
- <a class='design-url' href='js/easyfaa.js'><span class='d-none sm:d-inline'>https://design.easyfaa.com/</span>js/easyfaa.js</a>
57
- <span class='small fg-2 mt-1'>bh's bundle, and the controller that paints the wall</span>
58
- </div>
59
- </div>
60
- <div class='col-12'>
61
- <div class='card p-3'>
62
- <strong>Pinned to a version — the latest is <%= version %></strong>
63
- <span class='design-url'><a href='v<%= version %>/css/easyfaa.css'>v<%= version %>/css/easyfaa.css</a> · <a href='v<%= version %>/js/easyfaa.js'>v<%= version %>/js/easyfaa.js</a> · <a href='v<%= version %>/bh/theme/nord.css'>v<%= version %>/bh/theme/nord.css</a></span>
64
- </div>
65
- </div>
66
- </div>
67
- </section>
68
-
69
- <section class='design-section' id='theme'>
70
- <h2>Themes</h2>
71
- <button type='button' class='btn btn-outline theme-primary' data-controller='scheme' data-action='scheme#rotate'
72
- data-scheme-themes-value='["bootstrap","dawn","dracula","gruvbox","monokai","nord","one_dark","solarized","tokyo_night"]'
73
- data-scheme-path-value='v<%= version %>/bh/theme' data-scheme-storage-value='recourse-scheme'>
74
- <span class='recourse-scheme-light'><i class='bi bi-moon-fill'></i> Switch to dark</span>
75
- <span class='recourse-scheme-dark'><i class='bi bi-sun-fill'></i> Switch to light</span>
76
- </button>
77
- </section>
78
-
79
- <section class='design-section' id='lockup'>
80
- <h2>Lockups</h2>
81
- <p class='fg-2'>A mark beside its name, as one word and one link. Each drawing fills its 512 grid
82
- differently, so equal sizes never align: every mark is rendered at a box of its own and pushed
83
- down by its own nudge, and its ink then stands on the baseline and reaches IBM Plex Sans's ascender.
84
- The two blues are the mark's rather than the theme's, so a lockup reads the same in every app.</p>
85
- <div class='d-flex flex-wrap justify-content-center align-items-baseline gap-4 mt-3'>
86
- <%- mark.each_key do |app| -%>
87
- <a class='lockup plex' href='logo/<%= app %>.svg'><%= mark[app] %><%- if app == :easyfaa -%><span class='easy'>easy</span>faa<%- else -%><%= app %><%- end -%></a>
88
- <%- end -%>
89
- </div>
90
- <p class='fg-2 mt-4 mb-0'>At three sizes, to show the seating holds:</p>
91
- <div class='d-flex flex-wrap justify-content-center align-items-baseline gap-4 mt-2'>
92
- <a class='lockup plex' href='#lockup' style='font-size: 14px'><%= mark[:fountain] %>fountain</a>
93
- <a class='lockup plex' href='#lockup'><%= mark[:fountain] %>fountain</a>
94
- <a class='lockup plex' href='#lockup' style='font-size: 34px'><%= mark[:fountain] %>fountain</a>
95
- </div>
96
- </section>
97
-
98
- <section class='design-section' id='component'>
99
- <h2>Components</h2>
100
- <p class='fg-2'>They are not this gem's. The form that dresses every field, the combobox, the
101
- 6-digit code, the phone field, the dialog, the toasts, the thread of messages and the
102
- twenty-two Stimulus controllers all live in <strong>bh</strong>, which is Bootstrap 6 for any
103
- Rails app and has no opinion about this house. This gem depends on it and bundles it, so the
104
- stylesheet and the script above already carry every one of them — and bh's own page draws each
105
- beside the line of Ruby that produces it.</p>
106
- <p class='mt-3'><a href='https://claudiob.github.io/bh/'>Bootstrap Helpers</a></p>
107
- </section>
108
-
109
- <section class='design-section' id='page'>
110
- <h2>Error pages</h2>
111
- <ul class='list-unstyled d-flex flex-wrap justify-content-center gap-3'>
112
- <li><a href='page/400'>400 Bad request</a></li>
113
- <li><a href='page/404'>404 Not found</a></li>
114
- <li><a href='page/406-unsupported-browser'>406 Unsupported browser</a></li>
115
- <li><a href='page/422'>422 Unprocessable</a></li>
116
- <li><a href='page/500'>500 Server error</a></li>
117
- </ul>
118
- <h3 class='h5 design-subsection'>Down</h3>
119
- <p class='fg-2'>What an app shows while it is down — its own mark in the middle, the house's at
120
- the foot. The engine answers <code>/down.html</code> with the right one, and Heroku's
121
- <code>MAINTENANCE_PAGE_URL</code> points here, where the app is not.</p>
122
- <ul class='list-unstyled d-flex flex-wrap justify-content-center gap-3'>
123
- <%- mark.each_key do |app| -%>
124
- <li><a href='down/<%= app %>'><%= app %></a></li>
125
- <%- end -%>
126
- </ul>
127
- </section>
128
-
129
- <section class='design-section' id='favicon'>
130
- <h2>Icons</h2>
131
- <div class='table-responsive'>
132
- <table class='table table-hover mx-auto' style='max-width: 60rem'>
133
- <thead><tr><th scope='col'>Logo</th><th scope='col'>App</th><th scope='col'>.svg</th><th scope='col'>-dev.svg</th><th scope='col'>-96.png</th><th scope='col'>-180.png</th><th scope='col'>-192.png</th><th scope='col'>-512.png</th><th scope='col'>.ico</th><th scope='col'>.webmanifest</th></tr></thead>
134
- <tbody>
135
- <tr><td><img class='design-logo' src='logo/easyfaa.svg' alt=''></td><th scope='row'>easyfaa</th><td><img src='favicon/easyfaa.svg' width='24' alt=''></td><td><img src='favicon/easyfaa-dev.svg' width='24' alt=''></td><td><img src='favicon/easyfaa-96.png' width='24' alt=''></td><td><img src='favicon/easyfaa-180.png' width='24' alt=''></td><td><img src='favicon/easyfaa-192.png' width='24' alt=''></td><td><img src='favicon/easyfaa-512.png' width='24' alt=''></td><td><a href='favicon/easyfaa.ico'>ico</a></td><td><a href='favicon/easyfaa.webmanifest'>manifest</a></td></tr>
136
- <tr><td><img class='design-logo' src='logo/cube.svg' alt=''></td><th scope='row'>cube</th><td><img src='favicon/cube.svg' width='24' alt=''></td><td><img src='favicon/cube-dev.svg' width='24' alt=''></td><td><img src='favicon/cube-96.png' width='24' alt=''></td><td><img src='favicon/cube-180.png' width='24' alt=''></td><td><img src='favicon/cube-192.png' width='24' alt=''></td><td><img src='favicon/cube-512.png' width='24' alt=''></td><td><a href='favicon/cube.ico'>ico</a></td><td><a href='favicon/cube.webmanifest'>manifest</a></td></tr>
137
- <tr><td><img class='design-logo' src='logo/fountain.svg' alt=''></td><th scope='row'>fountain</th><td><img src='favicon/fountain.svg' width='24' alt=''></td><td><img src='favicon/fountain-dev.svg' width='24' alt=''></td><td><img src='favicon/fountain-96.png' width='24' alt=''></td><td><img src='favicon/fountain-180.png' width='24' alt=''></td><td><img src='favicon/fountain-192.png' width='24' alt=''></td><td><img src='favicon/fountain-512.png' width='24' alt=''></td><td><a href='favicon/fountain.ico'>ico</a></td><td><a href='favicon/fountain.webmanifest'>manifest</a></td></tr>
138
- <tr><td><img class='design-logo' src='logo/goldrush.svg' alt=''></td><th scope='row'>goldrush</th><td><img src='favicon/goldrush.svg' width='24' alt=''></td><td><img src='favicon/goldrush-dev.svg' width='24' alt=''></td><td><img src='favicon/goldrush-96.png' width='24' alt=''></td><td><img src='favicon/goldrush-180.png' width='24' alt=''></td><td><img src='favicon/goldrush-192.png' width='24' alt=''></td><td><img src='favicon/goldrush-512.png' width='24' alt=''></td><td><a href='favicon/goldrush.ico'>ico</a></td><td><a href='favicon/goldrush.webmanifest'>manifest</a></td></tr>
139
- <tr><td><img class='design-logo' src='logo/houston.svg' alt=''></td><th scope='row'>houston</th><td><img src='favicon/houston.svg' width='24' alt=''></td><td><img src='favicon/houston-dev.svg' width='24' alt=''></td><td><img src='favicon/houston-96.png' width='24' alt=''></td><td><img src='favicon/houston-180.png' width='24' alt=''></td><td><img src='favicon/houston-192.png' width='24' alt=''></td><td><img src='favicon/houston-512.png' width='24' alt=''></td><td><a href='favicon/houston.ico'>ico</a></td><td><a href='favicon/houston.webmanifest'>manifest</a></td></tr>
140
- <tr><td><img class='design-logo' src='logo/design.svg' alt=''></td><th scope='row'>design</th><td><img src='favicon/design.svg' width='24' alt=''></td><td><img src='favicon/design-dev.svg' width='24' alt=''></td><td><img src='favicon/design-96.png' width='24' alt=''></td><td><img src='favicon/design-180.png' width='24' alt=''></td><td><img src='favicon/design-192.png' width='24' alt=''></td><td><img src='favicon/design-512.png' width='24' alt=''></td><td><a href='favicon/design.ico'>ico</a></td><td><a href='favicon/design.webmanifest'>manifest</a></td></tr>
141
- <tr><td><img class='design-logo' src='logo/autopilot.svg' alt=''></td><th scope='row'>autopilot</th><td><img src='favicon/autopilot.svg' width='24' alt=''></td><td><img src='favicon/autopilot-dev.svg' width='24' alt=''></td><td><img src='favicon/autopilot-96.png' width='24' alt=''></td><td><img src='favicon/autopilot-180.png' width='24' alt=''></td><td><img src='favicon/autopilot-192.png' width='24' alt=''></td><td><img src='favicon/autopilot-512.png' width='24' alt=''></td><td><a href='favicon/autopilot.ico'>ico</a></td><td><a href='favicon/autopilot.webmanifest'>manifest</a></td></tr>
142
- </tbody>
143
- </table>
144
- </div>
145
- </section>
146
- </main>
147
-
148
- <footer class='container-fluid px-3 py-4 small fg-2 d-flex flex-column align-items-center gap-2'>
149
- <code>gem install easyfaa</code>
150
- <div class='d-flex flex-wrap justify-content-center gap-3'>
151
- <a href='https://github.com/easyfaa/design'>Source</a>
152
- <a href='https://rubydoc.info/gems/easyfaa'>Reference</a>
153
- <a href='https://rubygems.org/gems/easyfaa'>RubyGems</a>
154
- </div>
155
- </footer>
156
- </body>
157
- </html>
@@ -1,7 +0,0 @@
1
- en:
2
- easyfaa:
3
- one_time_code: |-
4
- Enter this 6-digit code to proceed: %{pin}
5
-
6
- @%{host} #%{pin}
7
- spoken_one_time_code: 'Enter this 6-digit code to proceed: %{pin}'
data/lib/easyfaa/copy.rb DELETED
@@ -1,5 +0,0 @@
1
- module Easyfaa
2
- # Words the house says the same way in every app, in each of the voices they are said in:
3
- # `written` for a screen or a text, `spoken` for a voice reading them out.
4
- Copy = Data.define :written, :spoken
5
- end
data/lib/easyfaa/down.rb DELETED
@@ -1,19 +0,0 @@
1
- require 'rack/files'
2
-
3
- module Easyfaa
4
- # Answers `/down.html` with the page the host shows while it is down: its own where it is
5
- # one of the family, the house's otherwise.
6
- class Down
7
- def initialize(app)
8
- @app = app
9
- @files = Rack::Files.new Engine.root.join('public/down').to_s
10
- end
11
-
12
- # The page where the path asks for it, and the host otherwise.
13
- def call(env)
14
- return @app.call env unless env['PATH_INFO'] == '/down.html'
15
-
16
- @files.call env.merge('PATH_INFO' => "/#{Easyfaa.app}.html")
17
- end
18
- end
19
- end
@@ -1,53 +0,0 @@
1
- module Easyfaa
2
- module Helpers
3
- # The page of a signup flow: the house's mark over the wall it stands on, a title, a line,
4
- # one card, and the way out under it.
5
- module Flows
6
- # How wide the card is unless a page says otherwise: as wide as a thread, a table or a
7
- # contract wants. A page asking one question says a narrower one.
8
- WIDTH = '75rem'
9
-
10
- # Draws the page around the card's content: the lockup over what the view said in
11
- # `content_for` — its `:title`, its `:subtitle`, how wide the card is in `:width` — and
12
- # the `links` under the card joined by a middot. No subtitle draws no line and no links
13
- # no foot: a page says only what it has. The mark and the wall are not asked for, being
14
- # what a house flow is; every other option is an attribute of the column.
15
- # @param href [String] where the lockup over the page leads.
16
- # @param links [Array<String>] the way out, and whatever else stands beside it.
17
- # @param options [Hash] anything else the column carries.
18
- # @return [String] the page.
19
- def flow(href: Logos::HOME, links: [], **options, &)
20
- parts = [
21
- tag.header(easyfaa_logo(href: href)),
22
- *easyfaa_flow_words,
23
- easyfaa_flow_card(content_for(:width), &),
24
- easyfaa_flow_links(links),
25
- ]
26
- classes = class_names 'flow', options[:class]
27
-
28
- tag.div safe_join(parts.compact), class: classes, data: { controller: 'wall' },
29
- **options.except(:class)
30
- end
31
-
32
- private
33
-
34
- def easyfaa_flow_words
35
- [tag.h1(content_for(:title)), (tag.p content_for :subtitle if content_for? :subtitle)]
36
- end
37
-
38
- def easyfaa_flow_card(width, &)
39
- width = width.presence || WIDTH
40
- style = "--flow-width: #{width}" unless width == WIDTH
41
-
42
- tag.div capture(&), class: 'flow-card p-3 md:p-4 mx-auto', style:
43
- end
44
-
45
- def easyfaa_flow_links(pieces)
46
- pieces = Array(pieces).compact_blank
47
- return if pieces.empty?
48
-
49
- tag.footer safe_join(pieces, tag.span('·', class: 'fg-2', aria: { hidden: true }))
50
- end
51
- end
52
- end
53
- end
@@ -1,60 +0,0 @@
1
- module Easyfaa
2
- module Helpers
3
- # What every easyfaa page puts in its `<head>`.
4
- module Heads
5
- # One line per tag, each at the depth a head's children sit at in a layout indented
6
- # by two: `<html>`, then `<head>`, then these.
7
- INDENT = "\n "
8
-
9
- # The stylesheet and the script every page needs, and the icons `app` is known by —
10
- # this app unless said, since a page a customer reads may wear the house's mark rather
11
- # than the app's. Both files at this version's own path, which never changes and so is
12
- # kept for a year. A page refresh Turbo is sent morphs the page in place and keeps the
13
- # scroll, so an answer landing in a thread leaves the reader where they were.
14
- def easyfaa_head_tags(app = Easyfaa.app)
15
- safe_join [
16
- tag.meta(name: 'viewport', content: 'width=device-width, initial-scale=1'),
17
- tag.meta(name: 'color-scheme', content: 'light dark'),
18
- tag.meta(name: 'turbo-refresh-method', content: 'morph'),
19
- tag.meta(name: 'turbo-refresh-scroll', content: 'preserve'),
20
- easyfaa_layer,
21
- easyfaa_icons(app),
22
- ], INDENT
23
- end
24
-
25
- # bh's layer and the house's on top of it, in that order: every rule and every
26
- # controller here is written against what bh draws, so bh goes first. bh's files are
27
- # served by its own engine, under a path of its own.
28
- def easyfaa_layer
29
- safe_join [
30
- tag.link(rel: 'stylesheet', href: "#{Bh::Engine::PREFIX}css/bh.css"),
31
- tag.script('', type: 'module', src: "#{Bh::Engine::PREFIX}js/bh.js"),
32
- easyfaa_tags,
33
- ], INDENT
34
- end
35
-
36
- # The house's own two files, for a page that already links bh's. At this version's own
37
- # path, which never changes and so is kept for a year.
38
- def easyfaa_tags
39
- safe_join [
40
- tag.link(rel: 'stylesheet', href: "/v#{VERSION}/css/easyfaa.css"),
41
- tag.script('', type: 'module', src: "/v#{VERSION}/js/easyfaa.js"),
42
- ], INDENT
43
- end
44
-
45
- # The icons a tab, a home screen and a saved app know `app` by — this app unless said:
46
- # the SVG, its dev variant while developing, the 96px PNG, the apple touch icon and the
47
- # web manifest, one to a line.
48
- def easyfaa_icons(app = Easyfaa.app)
49
- mark = Rails.env.development? ? "#{app}-dev" : app
50
-
51
- safe_join [
52
- tag.link(rel: 'icon', href: "/favicon/#{mark}.svg", type: 'image/svg+xml'),
53
- tag.link(rel: 'icon', href: "/favicon/#{app}-96.png", type: 'image/png', sizes: '96x96'),
54
- tag.link(rel: 'apple-touch-icon', href: "/favicon/#{app}-180.png"),
55
- tag.link(rel: 'manifest', href: "/favicon/#{app}.webmanifest"),
56
- ], INDENT
57
- end
58
- end
59
- end
60
- end
@@ -1,43 +0,0 @@
1
- # `squish` and `html_safe`, for the marks read once at load, before any Rails has booted.
2
- require 'active_support/core_ext/string/filters'
3
- require 'active_support/core_ext/string/output_safety'
4
-
5
- module Easyfaa
6
- module Helpers
7
- # An app's mark and its name, drawn as one word wherever a page signs itself.
8
- module Logos
9
- # Where a logo leads unless told otherwise: the house's front door.
10
- HOME = 'https://easyfaa.com/'
11
-
12
- # Every drawing the logos are made of, read once from the art the icons render from.
13
- DRAWINGS = MARKS.keys.to_h do |app|
14
- drawing = File.read File.expand_path("../../../art/#{app}.svg", __dir__)
15
- [app, drawing.sub('<svg ', "<svg aria-hidden='true' ").squish.html_safe]
16
- end.freeze
17
-
18
- # The mark and the name of `app` — the house's horizon and `easyfaa` by default — as a
19
- # link to `href`. Every other option is an attribute of the link, `class` included.
20
- def easyfaa_logo(app: :easyfaa, href: HOME, **options)
21
- classes = class_names 'lockup plex', options[:class]
22
- words = safe_join [easyfaa_logo_mark(app), easyfaa_logo_word(app)]
23
-
24
- tag.a words, class: classes, **options.except(:class), href:
25
- end
26
-
27
- private
28
-
29
- def easyfaa_logo_mark(app)
30
- size, shift = MARKS.fetch(app).map { |px| (px / 48).round 4 }
31
- style = "width: #{size}em; height: #{size}em; top: #{shift}em"
32
-
33
- DRAWINGS.fetch(app).sub('<svg ', "<svg style='#{style}' ").html_safe
34
- end
35
-
36
- def easyfaa_logo_word(app)
37
- return app.to_s unless app == :easyfaa
38
-
39
- safe_join [tag.span('easy', class: 'easy'), 'faa']
40
- end
41
- end
42
- end
43
- end
@@ -1,11 +0,0 @@
1
- require 'bh'
2
- require_relative 'helpers/flows'
3
- require_relative 'helpers/heads'
4
- require_relative 'helpers/logos'
5
-
6
- module Easyfaa
7
- # Everything a view may call, in one module the engine puts on every Action View.
8
- module Helpers
9
- include Flows, Heads, Logos
10
- end
11
- end
data/lib/easyfaa/marks.rb DELETED
@@ -1,16 +0,0 @@
1
- module Easyfaa
2
- # How each app's mark sits beside its name in a lockup, measured at 48px: the box the
3
- # drawing is rendered at, and how far down it is pushed so its ink stands on the baseline
4
- # and reaches IBM Plex Sans's ascender. Every drawing is a different shape inside its 512
5
- # grid, so equal sizes never align; these do. The house's own is the one exception: 0.8em
6
- # and dropped 0.16em, so the horizon centres on the lowercase rather than standing on it.
7
- MARKS = {
8
- autopilot: [46.36, 5.42],
9
- cube: [38.96, 1.72],
10
- design: [50.47, 8.94],
11
- easyfaa: [38.4, 7.68],
12
- fountain: [39.54, 2.01],
13
- goldrush: [49.50, 11.02],
14
- houston: [39.73, 2.11],
15
- }.freeze
16
- end