summaryrefslogtreecommitdiffstats
path: root/assets/css
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-11-19 20:39:55 +0100
committerVolpeon <git@volpeon.ink>2021-11-19 20:39:55 +0100
commit670696ff6e7c91d6d92951d2da47d7d4c85ee1d3 (patch)
treedd018124053c3b29be66e7300b928b966459578b /assets/css
parentAdded print style (diff)
downloadvolpeon.ink-670696ff6e7c91d6d92951d2da47d7d4c85ee1d3.tar.gz
volpeon.ink-670696ff6e7c91d6d92951d2da47d7d4c85ee1d3.tar.bz2
volpeon.ink-670696ff6e7c91d6d92951d2da47d7d4c85ee1d3.zip
Added text ellipsis to cards, added macro to use icons in content
Diffstat (limited to 'assets/css')
-rw-r--r--assets/css/_utils.scss5
-rw-r--r--assets/css/components/_card.scss6
-rw-r--r--assets/css/objects/_icon.scss5
3 files changed, 14 insertions, 2 deletions
diff --git a/assets/css/_utils.scss b/assets/css/_utils.scss
index 86a18cf..14d32a1 100644
--- a/assets/css/_utils.scss
+++ b/assets/css/_utils.scss
@@ -59,3 +59,8 @@
59@include utility('fs0') { 59@include utility('fs0') {
60 flex-shrink: 0; 60 flex-shrink: 0;
61} 61}
62
63@include utility('elp') {
64 overflow: hidden;
65 text-overflow: ellipsis;
66}
diff --git a/assets/css/components/_card.scss b/assets/css/components/_card.scss
index 9a2455b..2e36d3e 100644
--- a/assets/css/components/_card.scss
+++ b/assets/css/components/_card.scss
@@ -92,8 +92,10 @@
92 } 92 }
93 93
94 @include element('block') { 94 @include element('block') {
95 flex: 0 0 auto; 95 flex: 0 0 auto;
96 padding: prop(--dims --pad-y) calc(.5 * #{prop(--dims --pad-x)}); 96 padding: prop(--dims --pad-y) calc(.5 * #{prop(--dims --pad-x)});
97 overflow: hidden;
98 text-overflow: ellipsis;
97 99
98 @include modifier('main') { 100 @include modifier('main') {
99 flex-shrink: 1; 101 flex-shrink: 1;
diff --git a/assets/css/objects/_icon.scss b/assets/css/objects/_icon.scss
index e708dd5..cbce5cf 100644
--- a/assets/css/objects/_icon.scss
+++ b/assets/css/objects/_icon.scss
@@ -6,5 +6,10 @@
6 stroke-width: 1.5px; 6 stroke-width: 1.5px;
7 stroke-linecap: round; 7 stroke-linecap: round;
8 stroke-linejoin: round; 8 stroke-linejoin: round;
9
10 @include modifier('inline') {
11 display: inline-block;
12 vertical-align: -.1em;
13 }
9 } 14 }
10} 15}