Dictionary index and show styling

This commit is contained in:
maddiebaka 2023-10-23 11:37:20 -04:00
parent 366921b1d3
commit e73a6b3fc9
5 changed files with 62 additions and 8 deletions

View File

@ -15,3 +15,35 @@
*/
@import "bootstrap";
$nord0: #2e3440;
$nord1: #3b4252;
$nord2: #434c5e;
$nord3: #4c566a;
// Snow Storm
$nord4: #D8DEE9;
$nord9: #5e81ac;
a, a:visited {
color: $nord0;
text-decoration: none;
}
a:hover {
color: $nord3;
text-decoration: underline;
}
.dictionary-index-links {
font-size: 40px;
//color: #000;
font-weight: bold;
}
.selected-letter {
color: $nord9;
display: inline;
}

View File

@ -1,10 +1,14 @@
module DictionaryHelper
LETTERS = ['i', 'u', 'e', 'o', 'a', 'm', 'n', 'p', 't', 'k', 's', 'w', 'l', 'j'].sort
def alphabetical_links
def alphabetical_links(letter = nil)
LETTERS.map do |l|
link_to l.to_s, dictionary_path(l)
if l == letter then
"<p class=\"selected-letter\">#{l.to_s}</p>"
else
link_to l.to_s, dictionary_path(l)#, class: "dictionary_index_links text-center"
end
end.join("\n")
end
end

View File

@ -0,0 +1,11 @@
<hr>
<div class="text-center mx-1 dictionary-index-links">
«
<% unless defined?(letter) %>
<%= sanitize alphabetical_links, tags: ["a", "div", "p"] %>
<% else %>
<%= sanitize alphabetical_links(letter), tags: ["a", "div", "p"] %>
<% end %>
»
</div>
<hr>

View File

@ -1,6 +1,11 @@
<%= sanitize alphabetical_links, tags: ["a"] %>
<h1 class="text-center">Index</h1>
<%= render "alphabetical_links" %>
<p><%= @parts_of_speech.count %> parts of speech entries in database</p>
<p><%= @words.count %> word entries in database</p>
<div class="p-4">
<p><%= @parts_of_speech.count %> parts of speech entries in database</p>
<p><%= @words.count %> word entries in database</p>
</div>
<%= render "partsofspeech", parts_of_speech: @parts_of_speech %>
<div class="p-4">
<%= render "partsofspeech", parts_of_speech: @parts_of_speech %>
</div>

View File

@ -1,9 +1,11 @@
<div>
<h1><%= @letter.to_s %></h1>
<h1 class="text-center"><b><%= @letter.to_s %></b></h1>
</div>
<%= render "alphabetical_links", letter: @letter %>
<% @words.each do |word| %>
<div>
<div class="dictionary-entry p-4">
<h2><%= word.word %></h2>
<%= render "definitions", word: word %>
</div>