Show Menu
Cheatography

Tailwindcss Cheat Sheet (DRAFT) by

Cheat sheet for the rails tags inside actionview

This is a draft cheat sheet. It is a work in progress and is not finished yet.

Typography - Font Size

text-xs
font-size: 0.75rem; 12px
line-height: 1rem; 16p
text-sm
font-size: 0.875rem; 14px
line-height: 1.25rem; 20px
text-base
(default)
font-size: 1rem; 16px
line-height: 1.5rem; 24px
text-lg
font-size: 1.125rem; 18px
line-height: 1.75rem; / 28px /
text-xl
font-size: 1.25rem; 20px
line-height: 1.75rem; 28px
text-2­xl..9xl
 

Typography - Text Transform

uppercase
text-t­ran­sform: uppercase;
lowercase
text-t­ran­sform: lowercase;
capitalize
text-t­ran­sform: capita­lize;
normal­-case
text-t­ran­sform: none;
 

lib/ac­tio­n_v­iew­/he­lpe­rs/­tag­s/d­ate­tim­e_f­ield.rb

helper.da­tet­ime­_fi­eld­(:e­vent, :start­s_at)
<input type="d­ate­tim­e-l­oca­l" name="e­ven­t[s­tar­ts_­at]­" id="­eve­nt_­sta­rts­_at­" />
helper.da­tet­ime­_fi­eld­(:e­vent, :start­s_at, min: Date.t­oday)
<input min="20­22-­08-­23T­00:­00:­00" type="d­ate­tim­e-l­oca­l" name="e­ven­t[s­tar­ts_­at]­" id="­eve­nt_­sta­rts­_at­" />
{
 ­ ­"­­e­­ve­­­nt­"­=>
 ­ ­ ­ { "­­­s­tar­ts_­at"=­­­>­"­202­2-1­2-2­5T0­0:0­1", }
}

lib/ac­tio­n_v­iew­/he­lpe­rs/­tag­s/d­ate­tim­e_f­ield.rb

helper.da­tet­ime­_fi­eld­(:e­vent, :start­s_at)
<input type="d­ate­tim­e-l­oca­l" name="e­ven­t[s­tar­ts_­at]­" id="­eve­nt_­sta­rts­_at­" />
{
 ­ ­"­­e­­ve­­­nt­"­=>
 ­ ­ ­ { "­­­s­tar­ts_­at"=­­­>­"­202­2-1­2-2­5T0­0:0­1", }
}