pvincent
/
easy-going-rails
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

navbar tailwind

main
pvincent 5 months ago
parent
091314ceb9
commit
965346d90d
13 changed files with 47 additions and 24 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 10
      .vscode/settings.json
  2. 4
      TODO.md
  3. 2
      app/assets/stylesheets/application.tailwind.css
  4. 5
      app/assets/stylesheets/application.turbo.css
  5. 21
      app/assets/stylesheets/navbar.css
  6. 0
      app/assets/stylesheets/toastify.css
  7. 5
      app/assets/stylesheets/turbo.css
  8. 2
      app/javascript/controllers/application.js
  9. 8
      app/javascript/controllers/toast_controller.js
  10. 5
      app/views/layouts/_navbar.html.erb
  11. 1
      app/views/layouts/_notification.html.erb
  12. 6
      app/views/layouts/application.html.erb
  13. 2
      app/views/scores/index.html.erb

10
.vscode/settings.json
View File

@ -2,21 +2,18 @@
// All of these settings are scoped only to the Ruby language // All of these settings are scoped only to the Ruby language
"[ruby]": { "[ruby]": {
"editor.defaultFormatter": "Shopify.ruby-lsp", // Use the Ruby LSP as the default formatter "editor.defaultFormatter": "Shopify.ruby-lsp", // Use the Ruby LSP as the default formatter
"editor.formatOnSave": true, // Format files automatically when saving
"editor.tabSize": 2, // Use 2 spaces for indentation
"editor.insertSpaces": true, // Use spaces and not tabs for indentantion
"editor.semanticHighlighting.enabled": true, // Enable semantic highlighting "editor.semanticHighlighting.enabled": true, // Enable semantic highlighting
"editor.formatOnType": true // Enable formatting while typing "editor.formatOnType": true // Enable formatting while typing
}, },
"[erb]": { "[erb]": {
"editor.defaultFormatter": "aliariff.vscode-erb-beautify", "editor.defaultFormatter": "aliariff.vscode-erb-beautify",
"editor.formatOnSave": true
}, },
"emmet.includeLanguages": { "emmet.includeLanguages": {
"erb": "html" "erb": "html"
}, },
"files.associations": { "files.associations": {
"*.html.erb": "erb"
"*.html.erb": "erb",
"*.tailwind.css": "tailwindcss"
}, },
"vscode-erb-beautify.keepBlankLines": 1, "vscode-erb-beautify.keepBlankLines": 1,
"inlineFold.regex": "(class=|className=|class:\\s*)(({(`|))|(['\"`]))(.*?)(\\2|(\\4)})", // inline AlpineJs `class: ` "inlineFold.regex": "(class=|className=|class:\\s*)(({(`|))|(['\"`]))(.*?)(\\2|(\\4)})", // inline AlpineJs `class: `
@ -32,4 +29,7 @@
}, },
// --------------------------------------------------------- // ---------------------------------------------------------
"terminal.integrated.shellIntegration.enabled": false, "terminal.integrated.shellIntegration.enabled": false,
"editor.formatOnSave": true,
"editor.tabSize": 2, // Use 2 spaces for indentation
"editor.insertSpaces": true, // Use spaces and not tabs for indentantion
} }

4
TODO.md
View File

@ -1,8 +1,6 @@
TODO TODO
==== ====
* [ ] Flash message
* [ ] https://reinteractive.com/articles/how-to-create-flash-messages-in-Rails-7
* [ ] Tailwind * [ ] Tailwind
* [ ] copy TailAdmin (or WindMill) layout * [ ] copy TailAdmin (or WindMill) layout
* [ ] https://demo.tailadmin.com/crm * [ ] https://demo.tailadmin.com/crm
@ -26,6 +24,8 @@ TODO
New Notes New Notes
--------- ---------
* [x] Flash message
* [x] https://reinteractive.com/articles/how-to-create-flash-messages-in-Rails-7
* [x] Minitest * [x] Minitest
* [x] Formatter * [x] Formatter
* [x] wrap warning containing \n * [x] wrap warning containing \n

2
app/assets/stylesheets/application.tailwind.css
View File

@ -10,4 +10,4 @@
} }
} }
*/
*/

5
app/assets/stylesheets/application.turbo.css
View File

@ -1,5 +0,0 @@
.turbo-progress-bar {
height: 10px;
background: rgb(0,0,0);
background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,192,250,1) 35%, rgba(0,32,249,1) 100%);
}

21
app/assets/stylesheets/navbar.css
View File

@ -0,0 +1,21 @@
nav {
background-color: black;
color: azure;
p {
background-color: aqua;
}
p:hover {
background-color: blueviolet;
}
&:hover p {
background-color: yellow;
}
}
p {
background-color: red;
}

0
app/assets/stylesheets/application.toastify.css → app/assets/stylesheets/toastify.css
View File

5
app/assets/stylesheets/turbo.css
View File

@ -0,0 +1,5 @@
.turbo-progress-bar {
height: 10px;
background: rgb(0, 0, 0);
background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 192, 250, 1) 35%, rgba(0, 32, 249, 1) 100%);
}

2
app/javascript/controllers/application.js
View File

@ -4,6 +4,6 @@ const application = Application.start()
// Configure Stimulus development experience // Configure Stimulus development experience
application.debug = true application.debug = true
window.Stimulus = application
window.Stimulus = application
export { application } export { application }

8
app/javascript/controllers/toast_controller.js
View File

@ -1,8 +0,0 @@
import { Controller } from "@hotwired/stimulus"
export default class extends Controller {
connect() {
console.log('toast.js: ', this.element)
this.element.textContent = "Toast #1"
}
}

5
app/views/layouts/_navbar.html.erb
View File

@ -0,0 +1,5 @@
<nav>
Navigation2
<p>paragraph</p>
<i>italic</i>
</nav>

1
app/views/layouts/_notification.html.erb
View File

@ -1,3 +1,4 @@
NOTIFICATION
<% if flash.count.positive? %> <% if flash.count.positive? %>
<script data-turbo-temporary> <script data-turbo-temporary>
document.addEventListener('turbo:load',(e)=>{ document.addEventListener('turbo:load',(e)=>{

6
app/views/layouts/application.html.erb
View File

@ -1,7 +1,10 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title><%=Rails.configuration.application_title%></title>
<!--TITLE -->
<title>
<%=Rails.configuration.application_title%>
</title>
<!--META --> <!--META -->
<%= csrf_meta_tags %> <%= csrf_meta_tags %>
@ -19,6 +22,7 @@
<body> <body>
<%=render 'layouts/navbar' %>
<%=render 'layouts/notification' %> <%=render 'layouts/notification' %>
<main class="m-8 flex flex-col"> <main class="m-8 flex flex-col">

2
app/views/scores/index.html.erb
View File

@ -1,7 +1,7 @@
<div class="w-full bg-cyan-200 p-4"> <div class="w-full bg-cyan-200 p-4">
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<h1 class="font-bold text-4xl">Scores</h1>
<h1 class="font-bold text-4xl">List of Scores</h1>
<%= link_to "New score", new_score_path, class: "rounded-lg py-3 px-5 bg-blue-600 text-white block font-medium" %> <%= link_to "New score", new_score_path, class: "rounded-lg py-3 px-5 bg-blue-600 text-white block font-medium" %>
</div> </div>

Write Preview
Loading…
Cancel
Save