|
@@ -1,6 +1,6 @@
|
|
<template>
|
|
<template>
|
|
<div class="docs-card-container" @click="clickCard">
|
|
<div class="docs-card-container" @click="clickCard">
|
|
- <div class="docs-card hover flex-r-c" :class="highlightKey.length === 0 ? '' : 'highlight'" v-if="cardType === 'oneline'" key="docs-card">
|
|
|
|
|
|
+ <div class="docs-card hover flex-r-c" v-if="cardType === 'oneline'" key="docs-card">
|
|
<div class="docs-card-header flex-r-c flex">
|
|
<div class="docs-card-header flex-r-c flex">
|
|
<span class="card-title-icon" :class="docTypeIcon"></span>
|
|
<span class="card-title-icon" :class="docTypeIcon"></span>
|
|
<span class="card-title flex" v-html="hightLightTitle"></span>
|
|
<span class="card-title flex" v-html="hightLightTitle"></span>
|
|
@@ -17,7 +17,7 @@
|
|
</slot>
|
|
</slot>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <div class="docs-card hover flex-r-c" :class="highlightKey.length === 0 ? '' : 'highlight'" v-else-if="cardType === 'image'" key="docs-card">
|
|
|
|
|
|
+ <div class="docs-card hover flex-r-c" v-else-if="cardType === 'image'" key="docs-card">
|
|
<div class="image-container">
|
|
<div class="image-container">
|
|
<el-image :src="imageSrc" lazy></el-image>
|
|
<el-image :src="imageSrc" lazy></el-image>
|
|
<span class="doc-type-icon" :class="docTypeIcon"></span>
|
|
<span class="doc-type-icon" :class="docTypeIcon"></span>
|
|
@@ -40,7 +40,7 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <div class="docs-card hover" :class="highlightKey.length === 0 ? '' : 'highlight'" v-else key="docs-card">
|
|
|
|
|
|
+ <div class="docs-card hover" v-else key="docs-card">
|
|
<div class="docs-card-header flex-r-c left">
|
|
<div class="docs-card-header flex-r-c left">
|
|
<span class="card-title-icon" :class="docTypeIcon"></span>
|
|
<span class="card-title-icon" :class="docTypeIcon"></span>
|
|
<span class="card-title flex" v-html="hightLightTitle"></span>
|
|
<span class="card-title flex" v-html="hightLightTitle"></span>
|
|
@@ -155,13 +155,11 @@ export default {
|
|
border-bottom: 1px solid rgba($color: #000, $alpha: 0.05);
|
|
border-bottom: 1px solid rgba($color: #000, $alpha: 0.05);
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
|
|
|
|
- &.highlight {
|
|
|
|
- .card-desc,
|
|
|
|
- .card-title {
|
|
|
|
- ::v-deep {
|
|
|
|
- em {
|
|
|
|
- color: $color-text--highlight;
|
|
|
|
- }
|
|
|
|
|
|
+ .card-desc,
|
|
|
|
+ .card-title {
|
|
|
|
+ ::v-deep {
|
|
|
|
+ em {
|
|
|
|
+ color: $color-text--highlight;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|