bterkuile/fizzy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Clean up, be more BEM-like

Browse Source
This commit is contained in:
Jason Zimdars
2025-01-28 18:07:04 -06:00
parent c7503c2663
commit b3c7f553b4
2 changed files with 40 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/assets/stylesheets/events.css
+38 -38
View File
@@ -8,6 +8,44 @@
padding-block-start: var(--block-space);
}
.events__index {
--row-gap: calc(4 * var(--block-space));
}
.events--none {
.events + & {
padding-block-start: calc(4 * var(--block-space));
}
}
.event {
--column-gap: 0.7ch;
--panel-border-radius: 0.5em;
--panel-padding: 0.6em 1.2em 0.6em 0.6em;
--panel-size: auto;
margin: var(--inline-space);
}
.event--related {
box-shadow: 0 0 0.3em 0.3em var(--bubble-color) !important;
}
.event__grid-item {
background-color: var(--color-selected);
block-size: 100%;
border-radius: 0;
display: flex;
inline-size: 100%;
}
.event__grid-column-title {
background-color: var(--color-bg);
inset-block-start: 0;
padding-block: var(--grid-lines);
z-index: 1;
}
.event__wrapper {
align-content: end;
display: grid;
@@ -26,41 +64,3 @@
align-self: start;
}
}
.event {
--column-gap: 0.7ch;
--panel-border-radius: 0.5em;
--panel-padding: 0.6em 1.2em 0.6em 0.6em;
--panel-size: auto;
margin: var(--inline-space);
}
.events--none {
.events + & {
padding-block-start: calc(4 * var(--block-space));
}
}
.event-grid-item {
background-color: var(--color-selected);
block-size: 100%;
border-radius: 0;
display: flex;
inline-size: 100%;
}
.events__index {
--row-gap: calc(4 * var(--block-space));
}
.event-grid-column-title {
background-color: var(--color-bg);
inset-block-start: 0;
padding-block: var(--grid-lines);
z-index: 1;
}
.event--related {
box-shadow: 0 0 0.3em 0.3em var(--bubble-color) !important;
}
app/helpers/events_helper.rb
+2 -2
View File
@@ -38,14 +38,14 @@ module EventsHelper
def render_event_grid_cells(day, columns: 4, rows: 24)
safe_join((2..rows + 1).map do |row|
(1..columns).map do |col|
tag.div class: class_names("event-grid-item"), style: "grid-area: #{row}/#{col};"
tag.div class: class_names("event__grid-item"), style: "grid-area: #{row}/#{col};"
end
end.flatten)
end
def render_column_headers
[ "Touched", "Discussed", "Added", "Popped" ].map do |header|
content_tag(:h3, header, class: "event-grid-column-title margin-block-end-half position-sticky")
content_tag(:h3, header, class: "event__grid-column-title margin-block-end-half position-sticky")
end.join.html_safe
end
end