diff options
| author | tdro <tdro@noreply.example.com> | 2022-08-18 00:35:48 -0400 |
|---|---|---|
| committer | tdro <tdro@noreply.example.com> | 2022-08-18 00:35:48 -0400 |
| commit | 8c40a54bbad00edc2025599f9ba5874953323a13 (patch) | |
| tree | 3e2900aaeb4c40130acbfcbb67a620ead4167f6f | |
| parent | 6a713aa0732366447cd8ee051b17bca24712ae65 (diff) | |
| download | canory-8c40a54bbad00edc2025599f9ba5874953323a13.tar.gz canory-8c40a54bbad00edc2025599f9ba5874953323a13.tar.bz2 canory-8c40a54bbad00edc2025599f9ba5874953323a13.zip | |
themes/default/layouts/_default/summary: Truncate over limit
| -rw-r--r-- | assets/css/default.css | 43 | ||||
| -rw-r--r-- | themes/default/layouts/_default/summary.html | 15 |
2 files changed, 56 insertions, 2 deletions
diff --git a/assets/css/default.css b/assets/css/default.css index c5cdd34..563d4ba 100644 --- a/assets/css/default.css +++ b/assets/css/default.css @@ -466,10 +466,11 @@ button, [type="button"], [type="submit"], micro-tags a, +micro-expand label, paginator-navigation a, micro-author micro-summary > a { align-items: center; - appearance: button; + appearance: none; background-color: #fff; background-color: var(--button-background); border-radius: 0.5rem; @@ -611,6 +612,46 @@ micro-article { display: block; } +micro-card[limit] { + position: relative; +} + +micro-card[limit] micro-summary { + opacity: 0.4; +} + +micro-card[limit] micro-content { + max-height: 25rem; + overflow: hidden; +} + +micro-card[limit] micro-overlay { + position: absolute; + width: 100%; + height: 100%; + z-index: 1; + display: flex; + align-items: center; + justify-content: center; +} + +[data-kind="page"] micro-card[limit], +[data-kind="page"] micro-card[limit] micro-summary, +[data-kind="page"] micro-card[limit] micro-content, +input[type="checkbox"]:checked + micro-card[limit], +input[type="checkbox"]:checked + micro-card[limit] micro-summary, +input[type="checkbox"]:checked + micro-card[limit] micro-content { + max-height: 100%; + opacity: 1; + overflow: initial; + position: unset; +} + +[data-kind="page"] micro-card[limit] micro-overlay, +input[type="checkbox"]:checked + micro-card[limit] micro-overlay { + display: none; +} + message-archive h1 { text-align: center; font-weight: 400; diff --git a/themes/default/layouts/_default/summary.html b/themes/default/layouts/_default/summary.html index 4e9d93d..fb7a829 100644 --- a/themes/default/layouts/_default/summary.html +++ b/themes/default/layouts/_default/summary.html @@ -1,4 +1,17 @@ -<micro-card {{ if .Weight }}pinned{{ end }} id="{{ partial "card-id.html" . }}"> +{{- $limit := gt .WordCount 75 -}} +{{- if $limit -}}<input hidden type="checkbox" id="expand-{{ partial "card-id.html" . }}" />{{- end -}} +<micro-card + id="{{ partial "card-id.html" . }}" + {{ if .Weight }}pinned{{ end }} + {{- if $limit }}limit{{ end }} +> + {{ if $limit }} + <micro-overlay> + <micro-expand> + <label for="expand-{{ partial "card-id.html" . }}">Click to Expand</label> + </micro-expand> + </micro-overlay> + {{ end }} {{ if .ExpiryDate }}<micro-expires>{{ end }} <micro-summary {{ if .Draft }}draft{{ end }} title="{{- partial "meta-title.html" . -}}"> <micro-thumbnail> |