API tools faq
paste
Secretprtay

author_styled

Secretprtay
Feb 4th, 2022 (edited)
186
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
Rails 3.58 KB | None | 0 0
raw download clone embed print report
  1. # app/views/layouts/application.html.erb
  2.  
  3. <!DOCTYPE html>
  4. <html>
  5. <head>
  6.   <title>ChatHotwire</title>
  7.   <meta name="viewport" content="width=device-width,initial-scale=1">
  8.   <%= csrf_meta_tags %>
  9.   <%= csp_meta_tag %>
  10.  
  11.   <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
  12.   <%= javascript_include_tag "application", "data-turbo-track": "reload", defer: true %>
  13.   <style>
  14.     <%= ".message-author_#{current_user&.id}" %> {
  15.       background-color: #007bff !important;
  16.       padding: 10px;
  17.     }
  18.   </style>
  19. </head>
  20.  
  21. <body>
  22. <div class="flex flex-col h-screen">
  23.   <nav class="bg-gray-800">
  24.     <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
  25.       <div class="flex items-center justify-between h-16">
  26.         <div class="flex items-center">
  27.           <div class="flex-shrink-0">
  28.             <a href="/">
  29.               <img class="h-8 w-8" src="https://tailwindui.com/img/logos/workflow-mark-indigo-500.svg" alt="Workflow">
  30.             </a>
  31.           </div>
  32.           <div class="hidden md:block">
  33.             <div class="ml-10 flex items-baseline space-x-4">
  34.               <% if current_user.present? %>
  35.                 <%= link_to "Sign out", destroy_user_session_path, data: { "turbo-method": :delete }, class: "text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium" %>
  36.               <% else %>
  37.                 <%= link_to 'Sign in', new_user_session_path, class: 'text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium' %>
  38.                 <%= link_to 'Sign up', new_user_registration_path, class: 'text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium' %>
  39.               <% end %>
  40.             </div>
  41.           </div>
  42.         </div>
  43.       </div>
  44.     </div>
  45.  
  46.     <div class="md:hidden" id="mobile-menu">
  47.       <div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
  48.         <% if current_user.present? %>
  49.           <%= link_to "Sign out", destroy_user_session_path, data: { "turbo-method": :delete }, class: "text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium" %>
  50.         <% else %>
  51.           <%= link_to "Sign in", new_user_session_path, class: "text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium" %>
  52.           <%= link_to "Sign up", new_user_registration_path, class: "text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium" %>
  53.         <% end %>
  54.       </div>
  55.     </div>
  56.   </nav>
  57.  
  58.   <header class="bg-white shadow">
  59.     <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
  60.       <h1 class="text-3xl font-bold text-gray-900">
  61.         Chat
  62.       </h1>
  63.     </div>
  64.   </header>
  65.   <main>
  66.     <div class="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
  67.       <%= yield %>
  68.     </div>
  69.   </main>
  70. </div>
  71. </body>
  72. </html>
  73.  
  74. # app/views/messages/_message.html.erb
  75. <div class="shadow overflow-hidden border-b border-gray-200 sm:rounded-lg my-4 py-2 pl-1 author_<%= message.user.id %>">
  76.   <div class="flex flex-row">
  77.     <div class="basis-1/12"><%= l(message.created_at, format: :short) %></div>
  78.     <div class="basis-3/12"><%= message.user.email %></div>
  79.     <div class="basis-7/12"><%= message.body %></div>
  80.     <div class="basis-1/12">
  81.       <%= link_to like_message_path(message), data: { "turbo-method": :post } do %>
  82.         <%= render partial: "messages/heart", locals: { user: user, message: message } %>
  83.         <%= render partial: "messages/likes_count", locals: { message: message } %>
  84.       <% end %>
  85.     </div>
  86.   </div>
  87. </div>
  88.  
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!