Skip to content

Add Tailwind styled scaffold templates #71

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Sep 29, 2021
Merged

Add Tailwind styled scaffold templates #71

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e48dc28
Add Tailwind styled scaffold templates
BakiVernes Aug 20, 2021
bfb324a
Match templates to rails main branch
BakiVernes Sep 12, 2021
f14aa08
Support Rails 6
dixpac Sep 13, 2021
9c5aaa3
Remove commented out code from engine.rb
dixpac Sep 13, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Match templates to rails main branch
  • Loading branch information
@BakiVernes
BakiVernes committed Sep 12, 2021
commit bfb324a3201a2a69e2ee15b8fe719d66459ff76a
8 changes: 4 additions & 4 deletions lib/templates/erb/scaffold/_form.html.erb.tt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,13 @@
<%% end %>

<% attributes.each do |attribute| -%>
<div class="field my-5">
<div class="my-5">
<% if attribute.password_digest? -%>
<%%= form.label :password %>
<%%= form.password_field :password %>
</div>

<div class="field my-5">
<div class="my-5">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't think these div's are aligned properly, yeah?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When we generate the scaffold the divs are indeed properly aligned as shown in a fresh rails/main app:

image

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have had to add that extra indentation for .tt files that I have worked on in the past too so that the generated files look right as you showed above. That's not the only quirk it has for lining up code. Variables and things also have to be lined up weird so they generate in the correct location. I have never understood why, but would like to look into it more. Any suggestions on where I could dive deeper on this?

<%%= form.label :password_confirmation %>
<%%= form.password_field :password_confirmation, class: "block shadow rounded-md border border-gray-200 outline-none px-3 py-2 mt-2 w-full" %>
<% elsif attribute.attachments? -%>
Expand All @@ -37,7 +37,7 @@
</div>

<% end -%>
<div class="actions inline">
<div class="inline">
<%%= form.submit class: "rounded-lg py-3 px-5 bg-blue-600 text-white inline-block font-medium" %>
</div>
<%% end %>
<%% end %>
26 changes: 4 additions & 22 deletions lib/templates/erb/scaffold/index.html.erb.tt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,29 +4,11 @@
<%% end %>

<div class="flex justify-between items-center">
<h1 class="text-lg font-bold text-4xl"><%= human_name %></h1>
<h1 class="text-lg font-bold text-4xl"><%= human_name.pluralize %></h1>
<%%= link_to 'New <%= human_name.downcase %>', new_<%= singular_route_name %>_path, class: "rounded-lg py-3 px-5 bg-blue-600 text-white block font-medium" %>
</div>

<table class="min-w-full">
<thead class="border-b-2 border-gray-200">
<tr class="text-gray-500 uppercase text-left">
<% attributes.reject(&:password_digest?).each do |attribute| -%>
<th class="pt-6 pb-2 font-normal"><%= attribute.human_name %></th>
<% end -%>
</tr>
</thead>

<tbody>
<%% @<%= plural_table_name %>.each do |<%= singular_table_name %>| %>
<tr class="align-top border-b border-gray-200">
<% attributes.reject(&:password_digest?).each do |attribute| -%>
<td class="py-6 pr-3"><%%= <%= singular_table_name %>.<%= attribute.column_name %> %></td>
<% end -%>
<td class="py-6 pr-3"><%%= link_to 'Show', <%= model_resource_name %>, class: "rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %></td>
<td class="py-6 pr-3"><%%= link_to 'Edit', edit_<%= singular_route_name %>_path(<%= singular_table_name %>), class: "rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %></td>
</tr>
<%% end %>
</tbody>
</table>
<div id="<%= plural_table_name %>" class="min-w-full">
<%%= render @<%= plural_table_name %> %>
</div>
</div>
22 changes: 22 additions & 0 deletions lib/templates/erb/scaffold/partial.html.erb.tt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<div id="<%%= dom_id <%= singular_table_name %> %>">
<% attributes.reject(&:password_digest?).each do |attribute| -%>
<p class="my-5">
<strong class="block font-medium mb-1"><%= attribute.human_name %>:</strong>
<% if attribute.attachment? -%>
<%%= link_to <%= singular_table_name %>.<%= attribute.column_name %>.filename, <%= singular_table_name %>.<%= attribute.column_name %> if <%= singular_table_name %>.<%= attribute.column_name %>.attached? %>
<% elsif attribute.attachments? -%>
<%% <%= singular_table_name %>.<%= attribute.column_name %>.each do |<%= attribute.singular_name %>| %>
<div><%%= link_to <%= attribute.singular_name %>.filename, <%= attribute.singular_name %> %></div>
<%% end %>
<% else -%>
<%%= <%= singular_table_name %>.<%= attribute.column_name %> %>
<% end -%>
</p>

<% end -%>
<%% if action_name != "show" %>
<%%= link_to "Show this <%= human_name.downcase %>", <%= singular_table_name %>, class: "rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
<%%= link_to 'Edit this <%= human_name.downcase %>', edit_<%= singular_table_name %>_path(<%= singular_table_name %>), class: "rounded-lg py-3 ml-2 px-5 bg-gray-100 inline-block font-medium" %>
<hr class="mt-6">
<%% end %>
</div>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add CR

13 changes: 4 additions & 9 deletions lib/templates/erb/scaffold/show.html.erb.tt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,12 @@
<p class="py-2 px-3 bg-green-50 mb-5 text-green-500 font-medium rounded-lg inline-block" id="notice"><%%= notice %></p>
<%% end %>

<% attributes.reject(&:password_digest?).each do |attribute| -%>
<p class="my-5">
<strong class="block font-medium mb-1"><%= attribute.human_name %>:</strong>
<%%= @<%= singular_table_name %>.<%= attribute.column_name %> %>
</p>
<% end -%>
<%%= render @<%= singular_table_name %> %>

<%%= link_to 'Edit', edit_<%= singular_table_name %>_path(@<%= singular_table_name %>), class: "mt-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
<%%= link_to 'Edit this <%= singular_table_name %>', edit_<%= singular_table_name %>_path(@<%= singular_table_name %>), class: "mt-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
<div class="inline-block ml-2">
<%%= button_to 'Delete', <%= singular_table_name %>_path(@<%= singular_table_name %>), method: :delete, class: "mt-2 rounded-lg py-3 px-5 bg-gray-100 font-medium" %>
<%%= button_to 'Delete this <%= singular_table_name %>', <%= singular_table_name %>_path(@<%= singular_table_name %>), method: :delete, data: { confirm: "Are you sure you want to delete this <%= singular_table_name %>?" }, class: "mt-2 rounded-lg py-3 px-5 bg-gray-100 font-medium" %>
</div>
<%%= link_to 'Back', <%= index_helper %>_path, class: "ml-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
<%%= link_to 'Back to <%= plural_table_name %>', <%= index_helper %>_path, class: "ml-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
</div>
</div>