diff --git a/src/assets/icons/link-off.svg b/src/assets/icons/link-off.svg new file mode 100644 index 00000000..c9aebc1f --- /dev/null +++ b/src/assets/icons/link-off.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/link-on.svg b/src/assets/icons/link-on.svg new file mode 100644 index 00000000..bd161522 --- /dev/null +++ b/src/assets/icons/link-on.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/play.svg b/src/assets/icons/play.svg new file mode 100644 index 00000000..6d53a8df --- /dev/null +++ b/src/assets/icons/play.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/stop.svg b/src/assets/icons/stop.svg new file mode 100644 index 00000000..44135c3e --- /dev/null +++ b/src/assets/icons/stop.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/Card/SCard.vue b/src/components/Card/SCard.vue index ba72dfbc..248e1f29 100644 --- a/src/components/Card/SCard.vue +++ b/src/components/Card/SCard.vue @@ -62,6 +62,7 @@ export default class SCard extends Vue { @import "../../styles/variables.scss"; .s-card { + color: $color-basic-black; border-radius: 8px; border-color: $color-neutral-border; &.clickable { diff --git a/src/styles/icons.scss b/src/styles/icons.scss index 685667b9..623c651e 100644 --- a/src/styles/icons.scss +++ b/src/styles/icons.scss @@ -28,6 +28,42 @@ height: 16px; } + &play { + position: absolute; + background-image: url('~@/assets/icons/play.svg'); + width: 16px; + height: 16px; + left: -8px; + top: -8px; + } + + &stop { + position: absolute; + background-image: url('~@/assets/icons/stop.svg'); + width: 16px; + height: 16px; + left: -8px; + top: -8px; + } + + &link-on { + position: absolute; + background-image: url('~@/assets/icons/link-on.svg'); + width: 16px; + height: 16px; + left: -8px; + top: -8px; + } + + &link-off { + position: absolute; + background-image: url('~@/assets/icons/link-off.svg'); + width: 16px; + height: 16px; + left: -8px; + top: -8px; + } + &plus-small { position: absolute; background-image: url('~@/assets/icons/plus.svg');