summaryrefslogtreecommitdiffstats
path: root/asset/css/mixin
diff options
context:
space:
mode:
Diffstat (limited to 'asset/css/mixin')
-rw-r--r--asset/css/mixin/card.less23
-rw-r--r--asset/css/mixin/mixins.less37
-rw-r--r--asset/css/mixin/state-badges.less31
3 files changed, 91 insertions, 0 deletions
diff --git a/asset/css/mixin/card.less b/asset/css/mixin/card.less
new file mode 100644
index 0000000..3823ba2
--- /dev/null
+++ b/asset/css/mixin/card.less
@@ -0,0 +1,23 @@
+.card() {
+ &.card {
+ .rounded-corners(.5em);
+ border: 1px solid var(--card-border-color, @card-border-color);
+
+ .card-header {
+ display: flex;
+ align-items: baseline;
+ justify-content: space-between;
+ padding: .5em;
+
+ border-bottom: 1px solid var(--card-border-color, @card-border-color);
+
+ .meta span {
+ font-size: 11/12em;
+ }
+ }
+
+ .card-body {
+ padding: .5em;
+ }
+ }
+}
diff --git a/asset/css/mixin/mixins.less b/asset/css/mixin/mixins.less
new file mode 100644
index 0000000..ca30dd0
--- /dev/null
+++ b/asset/css/mixin/mixins.less
@@ -0,0 +1,37 @@
+.rounded-corners(@border-radius: 0.4em) {
+ border-radius: @border-radius;
+
+ -webkit-background-clip: padding-box;
+ -moz-background-clip: padding;
+ background-clip: padding-box;
+}
+
+.appearance(@appearance) {
+ -webkit-appearance: @appearance;
+ -moz-appearance: @appearance;
+ -ms-appearance: @appearance;
+ appearance: @appearance;
+}
+
+.box-shadow(@x: 0.2em; @y: 0.2em; @blur: 0.2em; @spread: 0; @color: rgba(83, 83, 83, 0.25)) {
+ -webkit-box-shadow: @arguments;
+ -moz-box-shadow: @arguments;
+ box-shadow: @arguments;
+}
+
+.line-clamp(@numOfLines: 2) when (@numOfLines > 1) {
+ display: -webkit-box;
+ -webkit-line-clamp: @numOfLines;
+ -webkit-box-orient: vertical;
+}
+.line-clamp(@numOfLines: 2) when (@numOfLines = "reset") {
+ display: revert;
+ -webkit-line-clamp: initial;
+ -webkit-box-orient: initial;
+}
+
+.text-ellipsis() {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
diff --git a/asset/css/mixin/state-badges.less b/asset/css/mixin/state-badges.less
new file mode 100644
index 0000000..4be2d07
--- /dev/null
+++ b/asset/css/mixin/state-badges.less
@@ -0,0 +1,31 @@
+.state-badges() {
+ &.state-badges {
+ padding: 0;
+
+ ul {
+ padding: 0;
+ }
+
+ li {
+ display: inline-block;
+ }
+
+ li > ul > li:first-child:not(:last-child) .state-badge {
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
+ }
+
+ li > ul > li:last-child:not(:first-child) .state-badge {
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+ }
+
+ > li:not(:last-child) {
+ margin-right: .25em;
+ }
+
+ li > ul > li + li {
+ margin-left: 1px;
+ }
+ }
+}