bullet_train-themes-tester 1.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 (61) hide show
  1. checksums.yaml +7 -0
  2. data/.bt-link +0 -0
  3. data/MIT-LICENSE +20 -0
  4. data/README.md +28 -0
  5. data/Rakefile +8 -0
  6. data/app/assets/config/bullet_train_themes_tester_manifest.js +0 -0
  7. data/app/assets/stylesheets/tailwindcss/base.css +1 -0
  8. data/app/assets/stylesheets/tailwindcss/components.css +1 -0
  9. data/app/assets/stylesheets/tailwindcss/utilities.css +1 -0
  10. data/app/assets/stylesheets/tester/actiontext.css +26 -0
  11. data/app/assets/stylesheets/tester/application.css +33 -0
  12. data/app/assets/stylesheets/tester/electron.css +46 -0
  13. data/app/assets/stylesheets/tester/fields/cloudinary_image.css +58 -0
  14. data/app/assets/stylesheets/tester/fields/date_field.css +19 -0
  15. data/app/assets/stylesheets/tester/fields/index.css +5 -0
  16. data/app/assets/stylesheets/tester/fields/phone_field.css +7 -0
  17. data/app/assets/stylesheets/tester/fields/super_select.css +103 -0
  18. data/app/assets/stylesheets/tester/fields/trix_editor.css +90 -0
  19. data/app/assets/stylesheets/tester/mailer.scss +359 -0
  20. data/app/assets/stylesheets/tester/tailwind/colors.css +100 -0
  21. data/app/assets/stylesheets/tester/tailwind/components.css +151 -0
  22. data/app/assets/stylesheets/tester/tailwind/dark-mode.css +218 -0
  23. data/app/assets/stylesheets/tester/tailwind/utilities.css +49 -0
  24. data/app/assets/stylesheets/tester/turn.css +44 -0
  25. data/app/assets/stylesheets/tester.tailwind.css +5 -0
  26. data/app/javascript/application.tester.js +0 -0
  27. data/app/views/themes/tester/_alert.html.erb +13 -0
  28. data/app/views/themes/tester/_box.html.erb +66 -0
  29. data/app/views/themes/tester/_breadcrumb.html.erb +23 -0
  30. data/app/views/themes/tester/_cell.html.erb +41 -0
  31. data/app/views/themes/tester/_decision_line.html.erb +12 -0
  32. data/app/views/themes/tester/_line.html.erb +3 -0
  33. data/app/views/themes/tester/_notices.html.erb +15 -0
  34. data/app/views/themes/tester/_page.html.erb +12 -0
  35. data/app/views/themes/tester/_title.html.erb +18 -0
  36. data/app/views/themes/tester/attributes/_base.html.erb +30 -0
  37. data/app/views/themes/tester/attributes/_block.html.erb +9 -0
  38. data/app/views/themes/tester/breadcrumbs/_actions.html.erb +22 -0
  39. data/app/views/themes/tester/commentary/_box.html.erb +13 -0
  40. data/app/views/themes/tester/conversations/_card.html.erb +21 -0
  41. data/app/views/themes/tester/conversations/_comment.html.erb +26 -0
  42. data/app/views/themes/tester/conversations/_message.html.erb +136 -0
  43. data/app/views/themes/tester/conversations/_thread_border.html.erb +3 -0
  44. data/app/views/themes/tester/fields/_field.html.erb +81 -0
  45. data/app/views/themes/tester/forms/_errors.html.erb +14 -0
  46. data/app/views/themes/tester/layouts/_account.html.erb +138 -0
  47. data/app/views/themes/tester/layouts/_devise.html.erb +11 -0
  48. data/app/views/themes/tester/layouts/_head.html.erb +8 -0
  49. data/app/views/themes/tester/layouts/_mailer.html.erb +429 -0
  50. data/app/views/themes/tester/memberships/_photos.html.erb +18 -0
  51. data/app/views/themes/tester/menu/_heading.html.erb +3 -0
  52. data/app/views/themes/tester/menu/_item.html.erb +16 -0
  53. data/app/views/themes/tester/menu/_section.html.erb +7 -0
  54. data/app/views/themes/tester/workflow/_box.html.erb +30 -0
  55. data/config/routes.rb +2 -0
  56. data/lib/bullet_train/themes/tester/engine.rb +12 -0
  57. data/lib/bullet_train/themes/tester/version.rb +7 -0
  58. data/lib/bullet_train/themes/tester.rb +15 -0
  59. data/lib/tasks/bullet_train/themes/tester_tasks.rake +53 -0
  60. data/tailwind.tester.config.js +80 -0
  61. metadata +132 -0
@@ -0,0 +1,218 @@
1
+ @layer utilities {
2
+ @media (prefers-color-scheme: dark) {
3
+ /**
4
+ * Color overrides
5
+ **/
6
+ .bg-primary-900 {
7
+ /* TODO We can't really do this. We need to just append a transparency class to these elements. */
8
+ background-color: rgba(0, 0, 0, 0.15);
9
+ }
10
+
11
+ .bg-dark-gradient {
12
+ &:before {
13
+ background: linear-gradient(to bottom right, var(--dark-gradient-from), var(--dark-gradient-to) 100%);
14
+ }
15
+ background: linear-gradient(to bottom right, var(--dark-gradient-from), var(--dark-gradient-to) 100%);
16
+ }
17
+
18
+ /**
19
+ * General
20
+ **/
21
+ .button {
22
+ @apply ring-offset-darkPrimary-700;
23
+ }
24
+
25
+ .table {
26
+ th {
27
+ @apply text-darkPrimary-400;
28
+ }
29
+
30
+ tbody {
31
+ @apply border-gray-500;
32
+
33
+ tr {
34
+ border-top: 1px solid theme('colors.darkPrimary.500');
35
+ }
36
+
37
+ td {
38
+ @apply text-gray-400;
39
+
40
+ a,
41
+ input[type="submit"] {
42
+ @apply text-darkAccent-200;
43
+ }
44
+ }
45
+ }
46
+ }
47
+
48
+ /**
49
+ * Form components
50
+ **/
51
+ .button-secondary {
52
+ @apply text-darkAccent-200;
53
+ }
54
+
55
+ .button-alternative {
56
+ @apply bg-black-400 border-black-400 text-white;
57
+
58
+ &:hover {
59
+ @apply bg-black-300 border-black-200 text-white;
60
+ }
61
+ }
62
+
63
+ /**
64
+ * Custom components
65
+ **/
66
+ /* Color picker */
67
+ .pcr-app {
68
+ @apply bg-darkPrimary-800 border border-solid border-darkPrimary-900;
69
+
70
+ .pcr-interaction .pcr-result {
71
+ @apply text-darkPrimary-300 border border-solid border-darkPrimary-900 bg-darkPrimary-800;
72
+
73
+ &:focus {
74
+ box-shadow: 0 0 0 1px theme('colors.primary.500'), 0 0 0 3px theme('colors.primary.500');
75
+ }
76
+ }
77
+ }
78
+
79
+ /* Date range picker */
80
+ .daterangepicker {
81
+ @apply bg-darkPrimary-800 border-darkPrimary-900;
82
+
83
+ &::before {
84
+ border-bottom-color: theme('colors.darkPrimary.900');
85
+ }
86
+
87
+ &::after {
88
+ border-bottom-color: theme('colors.darkPrimary.800');
89
+ }
90
+
91
+ .calendar-table {
92
+ @apply bg-darkPrimary-800 text-darkPrimary-300;
93
+
94
+ /* navigation arrows */
95
+ .available {
96
+ span {
97
+ @apply border-primary-500;
98
+ }
99
+ }
100
+ }
101
+
102
+ /* Clear and Apply buttons wrapper */
103
+ .drp-buttons {
104
+ border-top-color: theme('colors.darkPrimary.900');
105
+ @apply text-darkPrimary-300;
106
+ }
107
+
108
+ th {
109
+ &.available:hover {
110
+ @apply bg-darkPrimary-600;
111
+ }
112
+ }
113
+
114
+ td {
115
+ &.off {
116
+ @apply bg-darkPrimary-800 text-white;
117
+ }
118
+
119
+ &.available:hover {
120
+ @apply bg-darkPrimary-600;
121
+ }
122
+ }
123
+
124
+ .hourselect, .minuteselect, .ampmselect {
125
+ @apply text-darkPrimary-300 border-darkPrimary-900 bg-darkPrimary-800 !important;
126
+ }
127
+ }
128
+
129
+ /* Phone field */
130
+ .iti__country-list {
131
+ @apply bg-darkPrimary-800 border border-solid border-darkPrimary-900;
132
+ }
133
+
134
+ /* Select2 */
135
+ .select2-container {
136
+ .select2-selection__rendered {
137
+ @apply text-darkPrimary-300 !important;
138
+ }
139
+
140
+ .select2-dropdown {
141
+ @apply bg-darkPrimary-700;
142
+ }
143
+
144
+ .select2-search__field {
145
+ @apply bg-darkPrimary-800 border-darkPrimary-900 !important;
146
+ }
147
+
148
+ .select2-selection--multiple, .select2-selection--single {
149
+ @apply bg-darkPrimary-800 focus:ring-primary-500 border-darkPrimary-900 !important;
150
+ @apply text-darkPrimary-300;
151
+ }
152
+
153
+ /* For the selected options in the multiple select2 component */
154
+ .select2-selection__choice {
155
+ @apply bg-primary-500 border-primary-500 !important;
156
+ @apply text-white;
157
+
158
+ .select2-selection__choice__remove {
159
+ @apply text-white;
160
+
161
+ &:hover {
162
+ @apply text-white;
163
+ }
164
+ }
165
+ }
166
+
167
+ .select2-results__option {
168
+ @apply text-darkPrimary-300;
169
+ }
170
+ }
171
+
172
+ /* Trix Editor */
173
+ trix-editor {
174
+ @apply bg-darkPrimary-800 border-darkPrimary-900 !important;
175
+
176
+ &:focus, &:active {
177
+ @apply border-primary-500 !important;
178
+ }
179
+ }
180
+
181
+ trix-toolbar {
182
+ .trix-button-group, .trix-button {
183
+ @apply border-darkPrimary-900 !important;
184
+ }
185
+ }
186
+
187
+ .tribute-container {
188
+ ul {
189
+ @apply bg-darkPrimary-800 border-darkPrimary-900 !important;
190
+ }
191
+ }
192
+
193
+ .trix-dialogs {
194
+ @apply bg-darkPrimary-800 border-darkPrimary-900 !important;
195
+ }
196
+
197
+ .trix-content a[href^="bullettrain://"] {
198
+ @apply text-white bg-darkPrimary-500;
199
+ }
200
+
201
+ /* CKEditor */
202
+ .ck {
203
+ --ck-color-base-background: theme('colors.darkPrimary.800');
204
+ --ck-color-base-border: theme('colors.darkPrimary.900');
205
+ --ck-color-toolbar-background: theme('colors.darkPrimary.800');
206
+ --ck-color-toolbar-border: theme('colors.darkPrimary.900');
207
+ --ck-color-text: theme('colors.darkPrimary.300');
208
+
209
+ .ck-editor__editable:not(.ck-editor__nested-editable) {
210
+ @apply shadow-none;
211
+
212
+ &.ck-focused {
213
+ @apply shadow-none;
214
+ }
215
+ }
216
+ }
217
+ }
218
+ }
@@ -0,0 +1,49 @@
1
+ @layer utilities {
2
+ .text-2xs {
3
+ @apply uppercase;
4
+ font-size: 0.65rem;
5
+ line-height: 0.9rem;
6
+ letter-spacing: 1px;
7
+ }
8
+
9
+ .space-y {
10
+ @apply space-y-5;
11
+ }
12
+
13
+ .space-x {
14
+ @apply space-x-3;
15
+ }
16
+
17
+ .gap-y {
18
+ @apply gap-y-5;
19
+ }
20
+
21
+ .gap-x {
22
+ @apply gap-x-4;
23
+ }
24
+
25
+ .bg-dark-gradient {
26
+ background-image: linear-gradient(to bottom, var(--primary-700) 0%, var(--primary-800) 100%);
27
+ }
28
+
29
+ .bg-dark-awesome-gradient {
30
+ background-image: linear-gradient(to bottom right, darken(#D7BBEA, 45%) 10%, #0e369a 100%);
31
+ }
32
+
33
+ .bg-light-gradient {
34
+ &:before {
35
+ content: "";
36
+ position: fixed;
37
+ z-index: -1;
38
+ background: linear-gradient(to bottom right, var(--light-gradient-from), var(--light-gradient-to));
39
+ top: 0px;
40
+ left: 0px;
41
+ bottom: 0px;
42
+ right: 0px;
43
+ }
44
+ }
45
+
46
+ [hidden] {
47
+ display: none !important;
48
+ }
49
+ }
@@ -0,0 +1,44 @@
1
+ [data-turn-exit],
2
+ [data-turn-enter] {
3
+ animation-timing-function: cubic-bezier(0.65, 0.05, 0.35, 1);
4
+ animation-fill-mode: forwards;
5
+ }
6
+
7
+ html.turn-exit [data-turn-exit] {
8
+ animation-name: fade-out-up;
9
+ animation-duration: .3s;
10
+ }
11
+
12
+ html.turn-enter [data-turn-enter] {
13
+ animation-name: fade-in-up;
14
+ animation-duration: .6s;
15
+ }
16
+
17
+ html.turn-before-exit [data-turn-exit],
18
+ html.turn-exit [data-turn-exit] {
19
+ will-change: transform, opacity;
20
+ }
21
+
22
+ @keyframes fade-out-up {
23
+ 0% {
24
+ opacity: 1;
25
+ transform: translateZ(0)
26
+ }
27
+
28
+ 100% {
29
+ opacity: 0;
30
+ transform: translate3d(0, -4rem, 0)
31
+ }
32
+ }
33
+
34
+ @keyframes fade-in-up {
35
+ 0% {
36
+ opacity: 0;
37
+ transform: translate3d(0, 4rem, 0)
38
+ }
39
+
40
+ 100% {
41
+ opacity: 1;
42
+ transform: translateZ(0)
43
+ }
44
+ }
@@ -0,0 +1,5 @@
1
+ @import "tailwindcss/base";
2
+ @import "tailwindcss/components";
3
+ @import "tailwindcss/utilities";
4
+
5
+ @import "tester/application";
File without changes
@@ -0,0 +1,13 @@
1
+ <% color ||= 'yellow' %>
2
+
3
+ <div class="rounded-md bg-<%= color %>-400 border border-<%= color %>-500 py-4 px-5 mb-3">
4
+ <h3 class="text-sm text-<%= color %>-900 font-light">
5
+ <%= yield %>
6
+ </h3>
7
+ </div>
8
+
9
+ <% # we have to list out the evaluations we want possible above so purgecss includes them in production. %>
10
+ <% if false %>
11
+ <div class="bg-yellow-400 border-yellow-500 text-yellow-900"></div>
12
+ <div class="bg-red-400 border-red-500 text-red-900"></div>
13
+ <% end %>
@@ -0,0 +1,66 @@
1
+ <% yield p = np %>
2
+
3
+ <% divider ||= nil %>
4
+ <% no_background ||= false %>
5
+ <% title_size ||= "text-xl" %>
6
+ <% body = p.content_for(:body) || p.content_for(:raw_body) %>
7
+ <% pagy ||= nil %>
8
+
9
+ <div class="<%= "bg-white rounded-md shadow dark:bg-darkPrimary-700" unless no_background %> overflow-hidden">
10
+ <div class="py-6 px-8 space-y-2 <%= 'border-b shadow-sm dark:border-darkPrimary-600' if divider %>">
11
+ <% if p.content_for? :title %>
12
+ <h2 class="<%= title_size %> font-semibold dark:text-white">
13
+ <%= p.content_for :title %>
14
+ </h2>
15
+ <% end %>
16
+
17
+ <% if p.content_for? :description %>
18
+ <p class="text-gray-400 font-light leading-normal">
19
+ <%= p.content_for :description %>
20
+ </p>
21
+ <% end %>
22
+ </div>
23
+
24
+ <div class="space-y-4">
25
+ <% if p.content_for? :table %>
26
+ <div class="box-table <%= divider ? 'mt-4' : '-mt-1' %> pb-0.5">
27
+ <%= p.content_for :table %>
28
+ </div>
29
+ <% end %>
30
+
31
+ <% if body %>
32
+ <div class="<%= "pt-7 px-8 space-y-7 #{p.content_for?(:actions) ? 'pb-3' : 'pb-7'}" unless p.content_for?(:raw_body) %>">
33
+ <div class="space-y-4 <%= '-mt-4' unless divider %>">
34
+ <%= body %>
35
+ </div>
36
+ </div>
37
+ <% end %>
38
+
39
+ <% if p.content_for? :actions || pagy %>
40
+ <div class="pb-7 px-8 space-y-7">
41
+ <div class="sm:flex">
42
+ <div class="flex-1 space-x">
43
+ <%= p.content_for :actions %>
44
+ </div>
45
+ <% if pagy && pagy.pages > 1 %>
46
+ <div class="flex-0 mt-3 sm:mt-0">
47
+ <%== pagy_nav(pagy) %>
48
+ </div>
49
+ <% end %>
50
+ </div>
51
+ </div>
52
+ <% end %>
53
+ </div>
54
+
55
+ <% if p.content_for? :footer %>
56
+ <div class="py-4 px-8 bg-gray-50 border-t dark:bg-darkPrimary-800 dark:border-darkPrimary-600">
57
+ <%= p.content_for :footer %>
58
+ </div>
59
+ <% end %>
60
+
61
+ <% if p.content_for? :raw_footer %>
62
+ <div class="bg-gray-50 dark:bg-darkPrimary-800">
63
+ <%= p.content_for :raw_footer %>
64
+ </div>
65
+ <% end %>
66
+ </div>
@@ -0,0 +1,23 @@
1
+ <% first ||= false %>
2
+ <% url ||= nil %>
3
+
4
+ <% # convert [:account, model] "urls" to strings. %>
5
+ <% url = url.is_a?(String) ? url : main_app.url_for(url) if url %>
6
+
7
+ <li>
8
+ <div class="flex items-center">
9
+ <!-- Heroicon name: chevron-right -->
10
+ <svg class="flex-shrink-0 h-3 w-3 text-gray-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
11
+ <path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd" />
12
+ </svg>
13
+
14
+ <% item_style = "ml-3 text-gray-500 uppercase text-2xs tracking-widest" %>
15
+
16
+ <% # don't link to the same page we're already on. %>
17
+ <% if url && url != request.url %>
18
+ <%= link_to label, url, class: "#{item_style} hover:text-gray-700 hover:underline dark:text-primary-300" %>
19
+ <% else %>
20
+ <span class="<%= item_style %>"><%= label %></span>
21
+ <% end %>
22
+ </div>
23
+ </li>
@@ -0,0 +1,41 @@
1
+ <% yield p = np %>
2
+
3
+ <% completion_percent ||= nil %>
4
+
5
+ <div class="py-4 px-8 w-full space-y-3">
6
+ <div class="flex space-x-4">
7
+ <% if p.content_for? :memberships %>
8
+ <div class="flex-0">
9
+ <%= p.content_for :memberships %>
10
+ </div>
11
+ <% end %>
12
+
13
+ <div class="flex-1">
14
+ <div class="flex">
15
+ <div class="flex-1 space-y-4 py-1">
16
+ <div>
17
+ <%= p.content_for :title %>
18
+ </div>
19
+ </div>
20
+
21
+ <% if p.content_for? :actions %>
22
+ <div class="flex-0">
23
+ <%= p.content_for :actions %>
24
+ </div>
25
+ <% end %>
26
+ </div>
27
+
28
+ <% if completion_percent %>
29
+ <div class="mt-3 h-4 bg-gray-100 shadow-inner rounded w-full">
30
+ <div class="h-4 animate-pulse bg-primary-500 rounded" style="width: <%= completion_percent %>%"></div>
31
+ </div>
32
+ <% end %>
33
+
34
+ <% if p.content_for? :status %>
35
+ <div class="<% "mt-2" if completion_percent %> uppercase text-xs text-gray-400">
36
+ <%= p.content_for :status %>
37
+ </div>
38
+ <% end %>
39
+ </div>
40
+ </div>
41
+ </div>
@@ -0,0 +1,12 @@
1
+ <% label ||= t('global.or') %>
2
+
3
+ <div class="relative">
4
+ <div class="absolute inset-0 flex items-center">
5
+ <div class="w-full border-t border-gray-300 dark:border-gray-500"></div>
6
+ </div>
7
+ <div class="relative flex justify-center">
8
+ <span class="px-2 bg-white text-gray-500 uppercase text-xs dark:text-gray-300 dark:bg-darkPrimary-700">
9
+ <%= label %>
10
+ </span>
11
+ </div>
12
+ </div>
@@ -0,0 +1,3 @@
1
+ <div class="border-b border-gray-200 pb-4 dark:border-gray-500" style="position: relative;">
2
+ <div style="background-color: var(--primary-500); width: 26px; height: 4px; position: absolute; left: 0; bottom: -2px; border: 1px solid var(--primary-500); border-radius: 1px;"></div>
3
+ </div>
@@ -0,0 +1,15 @@
1
+ <% attributes ||= [] %>
2
+ <% attributes.select! { |attribute| form.object.errors[attribute].any? } %>
3
+
4
+ <% if notice.present? %>
5
+ <%= render 'account/shared/alert' do %>
6
+ <%= notice %>
7
+ <% end %>
8
+ <% end %>
9
+
10
+ <% if alert.present? || flash[:error] %>
11
+ <%= render 'account/shared/alert', color: 'red' do %>
12
+ <%= alert %>
13
+ <%= flash[:error] %>
14
+ <% end %>
15
+ <% end %>
@@ -0,0 +1,12 @@
1
+ <% yield p = np %>
2
+
3
+ <%= render 'account/shared/title' do |cp| %>
4
+ <% cp.content_for :title, p.content_for(:title) %>
5
+ <% cp.content_for :actions, p.content_for(:actions) %>
6
+ <% end %>
7
+
8
+ <%= render 'account/shared/notices' %>
9
+
10
+ <div class="space-y-8 py-4 xl:py-8 xl:px-8">
11
+ <%= p.yield :body %>
12
+ </div>
@@ -0,0 +1,18 @@
1
+ <% yield p = np %>
2
+
3
+ <div class="flex flex-row items-center">
4
+ <div class="flex-auto">
5
+ <h1 class="font-semibold text-base dark:text-white">
6
+ <%= p.content_for(:title) %>
7
+ </h1>
8
+ </div>
9
+ <div class="flex-auto text-right leading-none">
10
+ <% if p.content_for? :actions %>
11
+ <%= p.content_for :actions %>
12
+ <% end %>
13
+ </div>
14
+ </div>
15
+
16
+ <div class="mb-4">
17
+ <%= render "shared/line" %>
18
+ </div>
@@ -0,0 +1,30 @@
1
+ <% yield p = np %>
2
+
3
+ <% url ||= nil %>
4
+ <% strategy ||= current_attributes_strategy || :none %>
5
+
6
+ <% body = capture do %>
7
+ <% if url.present? %>
8
+ <% link_to url do %>
9
+ <%= p.content_for :body %>
10
+ <% end %>
11
+ <% else %>
12
+ <%= p.content_for :body %>
13
+ <% end %>
14
+ <% end %>
15
+
16
+ <% case strategy %>
17
+ <% when :label %>
18
+ <div>
19
+ <label class="block text-2xs font-semibold py-2 dark:text-white">
20
+ <%= p.content_for :heading %>
21
+ </label>
22
+ <div class="dark:text-gray-400">
23
+ <%= body %>
24
+ </div>
25
+ </div>
26
+
27
+ <% else %>
28
+ <%= body %>
29
+
30
+ <% end %>
@@ -0,0 +1,9 @@
1
+ <% object ||= current_attributes_object %>
2
+ <% strategy ||= current_attributes_strategy || :none %>
3
+ <% url ||= nil %>
4
+
5
+ <% if object.send(attribute).present? %>
6
+ <%= render 'shared/attributes/attribute', object: object, attribute: attribute, strategy: strategy, url: url do %>
7
+ <pre><%= object.send(attribute) %></pre>
8
+ <% end %>
9
+ <% end %>
@@ -0,0 +1,22 @@
1
+ <% yield p = np %>
2
+
3
+ <% p.helpers do
4
+ def account_controller_name_with_namespace
5
+ params[:controller].gsub(/^account\//, '')
6
+ end
7
+ end %>
8
+
9
+ <%
10
+ # don't add controller-specific actions in this file. instead, include them right below where this partial is
11
+ # included. see `app/views/account/teams/_breadcrumbs.html.erb` for an example.
12
+ %>
13
+
14
+ <% if p.account_controller_name_with_namespace == only_for %>
15
+ <% label = if action_name == 'edit'
16
+ ot("#{p.account_controller_name_with_namespace}.breadcrumbs.edit") || t('breadcrumbs.actions.edit')
17
+ elsif action_name == 'new'
18
+ ot("#{p.account_controller_name_with_namespace}.breadcrumbs.new") || t('breadcrumbs.actions.new')
19
+ end %>
20
+
21
+ <%= render 'account/shared/breadcrumb', label: label if label %>
22
+ <% end %>
@@ -0,0 +1,13 @@
1
+ <% yield p = np %>
2
+
3
+ <div class="-m-0.5">
4
+ <div class="border-2 border-dashed rounded-lg border-yellow-300 bg-yellow-100 dark:bg-opacity-10 dark:border-yellow-200 dark:border-opacity-70 -m-3 p-3 xl:py-4 xl:px-4 xl:-mx-4">
5
+ <%= p.content_for :content %>
6
+
7
+ <div class="py-3 px-3 space-y-2 pt-6">
8
+ <p class="text-yellow-600 dark:text-yellow-200 font-light leading-normal">
9
+ <%= p.content_for :commentary %>
10
+ </p>
11
+ </div>
12
+ </div>
13
+ </div>
@@ -0,0 +1,21 @@
1
+ <% conversation ||= subscription.conversation %>
2
+
3
+ <div class="<%= 'border-l-primary-500 border-l-4 border-primary-600' if subscription.unread? %>">
4
+
5
+ <%= link_to [:account, current_user, :conversations, :subscriptions, conversation_id: subscription.conversation.id], class: "#{current_conversation ? 'bg-gray-100 border-l ' : 'bg-white'} h-28 p-1 flex border-b-2 cursor-pointer hover:no-underline hover:bg-gray-50 relative items-center" do %>
6
+ <div class="md:w-1/4 w-1/5 lg:inline-block md:hidden flex-shrink-0">
7
+ <img src="<%= membership_profile_photo_url(conversation.last_message&.membership || current_membership) %>" title="<%= current_membership.name %>" alt="<%= current_membership.name %>" class="md:w-14 md:h-14 w-12 h-12 rounded-full mx-auto border-1 border-white border-2 flex-none">
8
+ </div>
9
+ <div class="w-4/5 md:w-full lg:w-4/5 pl-4 pr-1 flex-initial truncate">
10
+ <p class="text-xs text-gray-300 text-right hover:no-underline"><%= "#{time_ago_in_words conversation.last_message.created_at} ago" unless conversation.last_message.nil? %></p>
11
+ <h2 class="<%= subscription.unread? ? 'font-bold text-gray-800' : 'font-semibold text-gray-600' %> "><%= conversation.subject&.label_string %></h2>
12
+ <div class="text-gray-300">
13
+ <%= conversation.last_message&.user&.label_string %>
14
+ </div>
15
+ <div class="h-8 text-gray-400 text-sm pt-1 hover:no-underline truncate">
16
+ <%= Nokogiri::HTML.fragment(conversation.last_message.body).text unless conversation.last_message.nil? %>
17
+ </div>
18
+ </div>
19
+
20
+ <% end %>
21
+ </div>
@@ -0,0 +1,26 @@
1
+ <% new_message ||= false %>
2
+ <% current_user_message = message.membership.user == current_user %>
3
+ <% avatar = capture do %>
4
+ <img src="<%= membership_profile_photo_url(message.membership) %>" title="<%= message.membership.name %>" alt="<%= message.membership.name %>" class="w-10 h-10 rounded-full <%= current_user_message ? 'order-2' : 'order-1' %>">
5
+ <% end %>
6
+
7
+ <div class="flex py-3 px-2 text-gray-700 <%= message.reply? ? 'border w-full bg-gray-50 rounded-md' : 'border-b' %> <%= 'opacity-30' if new_message %>">
8
+ <div class="mr-3 min-w-max"><%= avatar %></div>
9
+ <div class="flex flex-col w-full">
10
+ <div class=""><span class="uppercase font-bold text-gray-500"><%= message.user.name %></span><span class="font-extralight text-xs text-gray-400"> &bull; <%= time_ago_in_words message.created_at %> ago</span></div>
11
+ <div class="py-2"><%= trix_sanitize message.body %></div>
12
+ <% if message.replies.any? %>
13
+ <div class="space-y-2 mt-2 mb-2">
14
+ <% message.replies.oldest.each do |reply| %>
15
+ <%= render 'account/shared/comment', message: reply %>
16
+ <% end %>
17
+ </div>
18
+ <% end %>
19
+ <% unless message.reply? %>
20
+ <%= turbo_frame_tag "reply_#{message.id}" do %>
21
+ <%= link_to "Reply", [:reply, :account, message], class: "font-light text-sm text-gray-400 hover:text-gray-500 pt-2" %>
22
+ <% end %>
23
+ <% end %>
24
+ </div>
25
+
26
+ </div>