Skip to content

Commit

Permalink
Row layout improvements (#358)
Browse files Browse the repository at this point in the history
Change audio player to the proper one and remove some padding

Signed-off-by: Matt Stratton <matt.stratton@hey.com>
  • Loading branch information
mattstratton authored Apr 15, 2021
1 parent 506bc4e commit 3bf20c0
Show file tree
Hide file tree
Showing 10 changed files with 68 additions and 55 deletions.
19 changes: 6 additions & 13 deletions layouts/partials/row-taxonomy.html
Original file line number Diff line number Diff line change
Expand Up @@ -44,33 +44,26 @@ <h3><a href="{{ .Permalink }}" class= "grid_episode_title">{{ .Title }}</a></h3>
</div>
<div class = "row homepage_episode_row">
{{- if .Params.episode_image -}}
<div class = "col-md-4">
<div class = "col-md-3 homepage_episode_row_image">
<a href="{{ .Permalink }}"><img class = "img-fluid" src = "{{ .Params.episode_image | absURL }}" /></a>
</div>
<div class = "col-md-8">
<div class = "col-md-9 homepage_episode_row_description">
{{- if ge (countrunes .Description ) ($.Scratch.Get "truncate") -}}
<p class = "hompage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
<p class = "homepage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
{{- else -}}
<p class = "hompage_episode_description">{{ .Description | markdownify }}</p>
<p class = "homepage_episode_description">{{ .Description | markdownify }}</p>
{{- end -}}
</div>
{{- else -}}
<div class = "col">
{{- if ge (countrunes .Description ) ($.Scratch.Get "truncate") -}}
<p class = "hompage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
<p class = "homepage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
{{- else -}}
<p class = "hompage_episode_description">{{ .Description | markdownify }}</p>
<p class = "homepage_episode_description">{{ .Description | markdownify }}</p>
{{- end -}}
</div>
{{- end -}}
</div>
{{- with .Params.podcast_file -}}
<div class = "row homepage_episode_row">
<div class = "col-md-12 player_row">
<audio src="{{ $.Site.Params.media_prefix }}{{ . }}" preload="auto" />
</div>
</div>
{{- end -}}

{{- end -}}
</div>
Expand Down
19 changes: 6 additions & 13 deletions layouts/partials/row-upcoming.html
Original file line number Diff line number Diff line change
Expand Up @@ -44,33 +44,26 @@ <h3><a href="{{ .Permalink }}" class= "grid_episode_title">{{ .Title }}</a></h3>
</div>
<div class = "row homepage_episode_row">
{{- if .Params.episode_image -}}
<div class = "col-md-4">
<div class = "col-md-3 homepage_episode_row_image">
<a href="{{ .Permalink }}"><img class = "img-fluid" src = "{{ .Params.episode_image | absURL }}" /></a>
</div>
<div class = "col-md-8">
<div class = "col-md-9 homepage_episode_row_description">
{{- if ge (countrunes .Description ) ($.Scratch.Get "truncate") -}}
<p class = "hompage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
<p class = "homepage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
{{- else -}}
<p class = "hompage_episode_description">{{ .Description | markdownify }}</p>
<p class = "homepage_episode_description">{{ .Description | markdownify }}</p>
{{- end -}}
</div>
{{- else -}}
<div class = "col">
{{- if ge (countrunes .Description ) ($.Scratch.Get "truncate") -}}
<p class = "hompage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
<p class = "homepage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
{{- else -}}
<p class = "hompage_episode_description">{{ .Description | markdownify }}</p>
<p class = "homepage_episode_description">{{ .Description | markdownify }}</p>
{{- end -}}
</div>
{{- end -}}
</div>
{{- with .Params.podcast_file -}}
<div class = "row homepage_episode_row">
<div class = "col-md-12 player_row">
<audio src="{{ $.Site.Params.media_prefix }}{{ . }}" preload="auto" />
</div>
</div>
{{- end -}}

{{- end -}}
</div>
Expand Down
30 changes: 12 additions & 18 deletions layouts/partials/row.html
Original file line number Diff line number Diff line change
Expand Up @@ -111,10 +111,10 @@ <h2><a href="{{ .Permalink }}" class= "row_latest_episode_title">{{ .Title }}</a
</div>
{{- if .Params.episode_image -}}
<div class = "row homepage_episode_row">
<div class = "col-md-4">
<div class = "col-md-3">
<a href="{{ .Permalink }}"><img class = "img-fluid" src = "{{ .Params.episode_image | absURL }}" /></a>
</div>
<div class = "col-md-8">
<div class = "col-md-9">
{{- if ge (countrunes .Description ) ($.Scratch.Get "truncate") -}}
<p class = "hompage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
{{- else -}}
Expand All @@ -133,9 +133,11 @@ <h2><a href="{{ .Permalink }}" class= "row_latest_episode_title">{{ .Title }}</a
{{- end -}}
{{- end -}}
{{- with .Params.podcast_file -}}
<div class = "row">
<div class = "row homepage_episode_row">
<div class = "col-md-12">
<audio src="{{ $.Site.Params.media_prefix }}{{ . }}" preload="auto" />
<audio id="player2" style="width: 100%" controls preload="none">
<source src="{{ $.Site.Params.media_prefix }}{{ . }}" type="audio/mp3">
</audio>
</div>
</div>
{{- end -}}
Expand Down Expand Up @@ -191,34 +193,26 @@ <h3><a href="{{ .Permalink }}" class= "grid_episode_title">{{ .Title }}</a></h3>
</div>
<div class = "row homepage_episode_row">
{{- if .Params.episode_image -}}
<div class = "col-md-4">
<div class = "col-md-3 homepage_episode_row_image">
<a href="{{ .Permalink }}"><img class = "img-fluid" src = "{{ .Params.episode_image | absURL }}" /></a>
</div>
<div class = "col-md-8">
<div class = "col-md-9 homepage_episode_row_description">
{{- if ge (countrunes .Description ) ($.Scratch.Get "truncate") -}}
<p class = "hompage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
<p class = "homepage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
{{- else -}}
<p class = "hompage_episode_description">{{ .Description | markdownify }}</p>
<p class = "homepage_episode_description">{{ .Description | markdownify }}</p>
{{- end -}}
</div>
{{- else -}}
<div class = "col">
{{- if ge (countrunes .Description ) ($.Scratch.Get "truncate") -}}
<p class = "hompage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
<p class = "homepage_episode_description">{{ .Description | markdownify | truncate ($.Scratch.Get "truncate") " "}}&nbsp;<small><a href = "{{ .Permalink }}">Read More</a></small></p>
{{- else -}}
<p class = "hompage_episode_description">{{ .Description | markdownify }}</p>
<p class = "homepage_episode_description">{{ .Description | markdownify }}</p>
{{- end -}}
</div>
{{- end -}}
</div>
{{- with .Params.podcast_file -}}
<div class = "row homepage_episode_row">
<div class = "col-md-12 player_row">
<audio src="{{ $.Site.Params.media_prefix }}{{ . }}" preload="auto" />
</div>
</div>
{{- end -}}

{{- end -}}
{{- end -}}
</div>
Expand Down
11 changes: 9 additions & 2 deletions static/css/blue.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion static/css/blue.css.map

Large diffs are not rendered by default.

11 changes: 9 additions & 2 deletions static/css/grey.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion static/css/grey.css.map

Large diffs are not rendered by default.

11 changes: 9 additions & 2 deletions static/css/orange.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion static/css/orange.css.map

Large diffs are not rendered by default.

16 changes: 14 additions & 2 deletions static/scss/custom.scss
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,25 @@
width: 250px;
height: 250px;
}
.hompage_episode_description {
.homepage_episode_description {
padding-left: 20px;
}
.homepage_episode_row {
padding-bottom: 20px;
// padding-bottom: 20px;
padding-top: 20px;
}

.homepage_episode_row_first {
padding-bottom: 20px;
padding-top: 20px;
}
.homepage_episode_row_description {
padding-left: 0px;
}

.homepage_episode_row_image {
padding-right: 0px;
}
.jumbotron-host {
margin: auto;
display: block;
Expand Down

0 comments on commit 3bf20c0

Please sign in to comment.