💄 Style: beautify link shortcode card style

hugo-fixit · Jan 20, 2022 · 45e19dd · 45e19dd
1 parent c90bcb2
commit 45e19dd
Show file tree

Hide file tree

Showing 6 changed files with 96 additions and 95 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -19,10 +19,9 @@ All notable changes to this project will be documented in this file.
 - :bug: Fix: typeit print code error ([#19](https://github.com/Lruihao/FixIt/issues/19))
 - :bug: Fix: pre element overflow error ([#29](https://github.com/Lruihao/FixIt/issues/29))
 - :bug: Fix: toc display error without content header ([#21](https://github.com/Lruihao/FixIt/issues/21))
-- :lipstick: Style: style detail adjustments, change scroll-behavior to smooth, header style, footer style etc.
+- :lipstick: Style: style detail adjustments, change scroll-behavior to smooth, header, footer, shortcode style etc.
 - :pencil: Docs: improve demo site documentation ([#37](https://github.com/Lruihao/FixIt/issues/37))
-- :wrench: Chore: add commands fixit_checker.sh
-- :wrench: Chore: minify static images
+- :wrench: Chore: add commands `fixit_checker.sh`
 - :wrench: Chore(i18n): change some translations
 - :arrow_up: Chore: update all third-party libraries
 - **Full Changelog:** [`v0.2.11...v0.2.12`](https://github.com/Lruihao/FixIt/compare/v0.2.11...v0.2.12)

diff --git a/assets/css/_core/_base.scss b/assets/css/_core/_base.scss
@@ -4,7 +4,7 @@ html {
   font-display: swap;
   font-size: $global-font-size;
   line-height: $global-line-height;
-  width:100%;
+  width: 100%;
   scroll-behavior: smooth;
 }
 

diff --git a/assets/css/_partial/_single/_cardlink.scss b/assets/css/_partial/_single/_cardlink.scss
@@ -1,97 +1,103 @@
-//卡片式链接样式 cardlink
-
-.card-link,.card-link:hover {
-  text-decoration: none;
-  border: none!important;
-  color: inherit!important
-}
+/**
+ * Card link style
+ * @author  @Lruihao https://lruihao.cn
+ */
 
 .card-link {
   position: relative;
   display: block;
-  margin: 1em auto;
-  width: 390px;
+  margin: .5rem auto;
   box-sizing: border-box;
-  border-radius: 12px;
+  border-radius: .75rem;
+  width: 400px;
   max-width: 100%;
   overflow: hidden;
-  color: inherit;
-  text-decoration: none
+  text-decoration: none;
+  border: none;
 }
 
-.ztext {
-  word-break: break-word;
-  line-height: 1.6
-}
+.cl- {
+  &backdrop {
+    position: absolute;
+    top: .75rem;
+    bottom: .75rem;
+    left: 0;
+    right: 0;
+    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNjQyNjg5OTA1MDE0IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQ0NzYiIHdpZHRoPSI2NCIgaGVpZ2h0PSI2NCIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTExMi40IDExOS42djUzNGg4MDRWMTE5LjZoLTgwNHogbTU3My4yIDQzOC44Yy05My4yIDkzLjItMjQ0LjQgOTMuMi0zMzggMC05My4yLTkzLjItOTMuMi0yNDQuNCAwLTMzOCA5My4yLTkzLjIgMjQ0LjQtOTMuMiAzMzcuNiAwIDkzLjYgOTMuMiA5My42IDI0NC40IDAuNCAzMzh6IiBmaWxsPSIjRkZENTUyIiBwLWlkPSI0NDc3Ij48L3BhdGg+PHBhdGggZD0iTTk0NC44IDg0MC40SDc5LjJDMzYuNCA4NDAuNCAxLjYgODA1LjYgMS42IDc2Mi44Vjc3LjZDMS42IDM0LjggMzYuNCAwIDc5LjIgMGg4NjZjNDIuNCAwIDc3LjIgMzQuNCA3Ny4yIDc3LjJ2Njg2YzAgNDIuNC0zNC44IDc3LjItNzcuNiA3Ny4yek03OS4yIDE0LjRDNDQuNCAxNC40IDE2IDQyLjggMTYgNzcuNnY2ODUuNmMwIDM0LjggMjguNCA2My4yIDYzLjIgNjMuMmg4NjUuNmMzNC44IDAgNjMuMi0yOC40IDYzLjItNjMuMlY3Ny4yYzAtMzQuNC0yOC02Mi44LTYyLjgtNjIuOEg3OS4yeiBtODY4LjQgNjcwLjRIODEuMlY4OC40aDg2Ni40djU5Ni40eiBtLTg1Mi0xNC40aDgzNy42VjEwMi44SDk1LjZ2NTY3LjZ6IiBmaWxsPSIjNEE1NTVGIiBwLWlkPSI0NDc4Ij48L3BhdGg+PHBhdGggZD0iTTc5LjIgMzEuMkM1My42IDMxLjIgMzIuOCA1MiAzMi44IDc3LjZ2Njg1LjZjMCAyNS42IDIwLjggNDYuNCA0Ni40IDQ2LjRoODY1LjZjMjUuNiAwIDQ2LjQtMjAuOCA0Ni40LTQ2LjRWNzEuNmMwLTIyLjQtMTgtNDAuNC00MC40LTQwLjRINzkuMnogbTg4NS4yIDY3MC40aC05MDBWNzEuNmg5MDB2NjMweiIgZmlsbD0iI0UwRTBFMCIgcC1pZD0iNDQ3OSI+PC9wYXRoPjxwYXRoIGQ9Ik02NzYuOCA5NjEuMmgtMzIwbDU2LjQtMTM1LjJoMjA3LjZsNTYgMTM1LjJ6IG0tMjk4LjQtMTQuNGgyNzYuOGwtNDQuNC0xMDYuNGgtMTg4LjRsLTQ0IDEwNi40eiIgZmlsbD0iIzRBNTU1RiIgcC1pZD0iNDQ4MCI+PC9wYXRoPjxwYXRoIGQ9Ik00MDMuNiA5MzBsMzAuNC03Mi44SDYwMGwzMCA3Mi44eiIgZmlsbD0iI0UwRTBFMCIgcC1pZD0iNDQ4MSI+PC9wYXRoPjxwYXRoIGQ9Ik04MDcuMiAxMDI0SDIyNi44di03Ny4yaDU4MC40VjEwMjR6IG0tNTY2LTE0LjRoNTUxLjZ2LTQ4LjRIMjQxLjJ2NDguNHoiIGZpbGw9IiM0QTU1NUYiIHAtaWQ9IjQ0ODIiPjwvcGF0aD48cGF0aCBkPSJNMjU4IDk3OEg3NzZ2MTQuOEgyNTh6IiBmaWxsPSIjRTBFMEUwIiBwLWlkPSI0NDgzIj48L3BhdGg+PHBhdGggZD0iTTM1LjIgMTAwOS42aDk2Mi44djE0LjRIMzUuMnoiIGZpbGw9IiM0QTU1NUYiIHAtaWQ9IjQ0ODQiPjwvcGF0aD48cGF0aCBkPSJNNTE3LjYgNzU2LjRtLTM4IDBhMzggMzggMCAxIDAgNzYgMCAzOCAzOCAwIDEgMC03NiAwWiIgZmlsbD0iI0ZGRkZGRiIgcC1pZD0iNDQ4NSI+PC9wYXRoPjxwYXRoIGQ9Ik01MTcuNiA4MDEuNmMtMjQuOCAwLTQ1LjItMjAuNC00NS4yLTQ1LjIgMC0yNC44IDIwLjQtNDUuMiA0NS4yLTQ1LjIgMjQuOCAwIDQ1LjIgMjAuNCA0NS4yIDQ1LjIgMCAyNC44LTIwLjQgNDUuMi00NS4yIDQ1LjJ6IG0wLTc2Yy0xNi44IDAtMzAuOCAxMy42LTMwLjggMzAuOHMxMy42IDMwLjggMzAuOCAzMC44IDMwLjgtMTMuNiAzMC44LTMwLjgtMTQtMzAuOC0zMC44LTMwLjh6IiBmaWxsPSIjNEE1NTVGIiBwLWlkPSI0NDg2Ij48L3BhdGg+PHBhdGggZD0iTTU4NCA0MjcuMmwtNDkuNi00OS42TDU3MiAzNDBsNC44IDYuOGMxNC40IDIwIDE4IDQ1LjYgMTAuNCA2OS4ybC0zLjIgMTEuMnogbS0yOS4yLTQ5LjJsMjEuNiAyMS42YzEuNi0xMi40LTAuOC0yNS42LTYuOC0zNi44bC0xNC44IDE1LjJ6TTQ5MS42IDQ5MmMtMTYuNCAwLTMxLjYtNC44LTQ0LjgtMTQuNGwtNi44LTQuOCA2OC44LTY4LjggNTEuNiA1MS42LTE0IDE0Yy0xNC44IDE0LjQtMzQuNCAyMi40LTU0LjggMjIuNHogbS0yOS4yLTIxLjZjOC44IDQuOCAxOC44IDcuMiAyOS4yIDcuMiAxNi44IDAgMzIuNC02LjQgNDQuNC0xOC40bDQtNC0zMS4yLTMxLjItNDYuNCA0Ni40ek01MjggMzcxLjZsLTQ5LjYtNDkuNiAxMS4yLTMuNmM3LjYtMi40IDE2LTQgMjQtNCAxNi40IDAgMzIgNS4yIDQ0LjggMTQuNGw2LjggNC44LTM3LjIgMzh6IG0tMjEuNi00MmwyMS42IDIxLjYgMTQuOC0xNC44Yy04LjgtNC44LTE4LjgtNy4yLTI5LjItNy4yLTIgMC00LjggMC03LjIgMC40ek00MzMuNiA0NjYuNGwtNC44LTYuOGMtMjItMzAuOC0xOC40LTcyLjggOC40LTk5LjZsMTQtMTQgNTEuNiA1MS42LTY5LjIgNjguOHogbTE3LjItMTAwLjRsLTQgNGMtMjAgMjAtMjQgNDkuNi0xMS4yIDczLjZsNDYuNC00Ni40LTMxLjItMzEuMnpNNTk2LjQgMzQ4LjRjLTcuMiAwLTEzLjYtMi44LTE4LjgtNy42bC0xMi40LTEyLjRhMjYuNTYgMjYuNTYgMCAwIDEgMC0zNy42YzQuOC00LjggMTEuNi03LjYgMTguOC03LjYgNy4yIDAgMTMuNiAyLjggMTguOCA3LjZsMTIuNCAxMi40YzQuOCA0LjggNy42IDExLjYgNy42IDE4LjggMCA3LjItMi44IDEzLjYtNy42IDE4LjgtNS4yIDUuMi0xMS42IDcuNi0xOC44IDcuNnpNNTg0IDI5Ny42Yy0zLjIgMC02LjQgMS4yLTguNCAzLjYtNC44IDQuOC00LjggMTIuNCAwIDE3LjJsMTIuNCAxMi40YzQuNCA0LjQgMTIuNCA0LjQgMTcuMiAwIDIuNC0yLjQgMy42LTUuMiAzLjYtOC40cy0xLjItNi40LTMuNi04LjRsLTEyLjQtMTIuNGMtMi40LTIuOC01LjYtNC04LjgtNHoiIGZpbGw9IiM0QTU1NUYiIHAtaWQ9IjQ0ODciPjwvcGF0aD48cGF0aCBkPSJNNTk4LjggMjk3LjZsLTEwLTEwYzkuMi05LjIgOS4yLTI0LjQgMC0zMy42bC03LjItNy4yIDEwLTEwIDcuMiA3LjJjMTUuMiAxNC40IDE1LjIgMzguNCAwIDUzLjZ6TTY1OS42IDMyNC40bC03LjItNy4yYy05LjItOS4yLTI0LjQtOS4yLTMzLjYgMGwtMTAtMTBjMTQuOC0xNC44IDM5LjItMTQuOCA1NCAwbDcuMiA3LjItMTAuNCAxMHoiIGZpbGw9IiM0QTU1NUYiIHAtaWQ9IjQ0ODgiPjwvcGF0aD48cGF0aCBkPSJNNTA4LjggMzI3LjJsLTIzLjItMjMuMmMtMTItMTItMTcuNi0yOS4yLTE1LjItNDYuNGwyLjgtMTcuNiAxNC40IDIuNC0yLjggMTcuNmMtMiAxMi40IDIgMjQuOCAxMS4yIDM0bDIzLjIgMjMuMi0xMC40IDEweiIgZmlsbD0iIzRBNTU1RiIgcC1pZD0iNDQ4OSI+PC9wYXRoPjxwYXRoIGQ9Ik02NDAuOCA0MzYuOGMtMTQgMC0yOC01LjYtMzgtMTUuNmwtMjMuMi0yMy4yIDEwLTEwIDIzLjIgMjMuMmM4LjggOC44IDIxLjYgMTIuOCAzNCAxMS4ybDE3LjYtMi44IDIuNCAxNC40LTE3LjYgMi44Yy0yLjgtMC40LTUuNiAwLTguNCAweiIgZmlsbD0iIzRBNTU1RiIgcC1pZD0iNDQ5MCI+PC9wYXRoPjxwYXRoIGQ9Ik0zNDggMjIwLjRjLTkzLjIgOTMuMi05My4yIDI0NC40IDAgMzM3LjYgOTMuMiA5My4yIDI0NC40IDkzLjIgMzM4IDBzOTMuMi0yNDQuNCAwLTMzNy42Yy05My42LTkzLjItMjQ0LjgtOTMuMi0zMzggMHogbTMyMy4yIDI4NGwtMjY5LjItMjY5LjJjNzUuMi01Ni40IDE4Mi40LTUwIDI1MS4yIDE4LjQgNjggNjggNzQgMTc1LjYgMTggMjUwLjh6TTM2NS42IDI3MC40bDI3MCAyNzBjLTc1LjYgNTkuNi0xODUuMiA1NC40LTI1NC44LTE1LjItNjkuNi02OS42LTc0LjgtMTc5LjItMTUuMi0yNTQuOHoiIGZpbGw9IiNGNjhGNkYiIHAtaWQ9IjQ0OTEiPjwvcGF0aD48cGF0aCBkPSJNMzQ4IDIyMC40Yy05My4yIDkzLjItOTMuMiAyNDQuNCAwIDMzNy42IDkzLjIgOTMuMiAyNDQuNCA5My4yIDMzOCAwczkzLjItMjQ0LjQgMC0zMzcuNmMtOTMuNi05My4yLTI0NC44LTkzLjItMzM4IDB6IG0zMjMuMiAyODRsLTI2OS4yLTI2OS4yYzc1LjItNTYuNCAxODIuNC01MCAyNTEuMiAxOC40IDY4IDY4IDc0IDE3NS42IDE4IDI1MC44ek0zNjUuNiAyNzAuNGwyNzAgMjcwYy03NS42IDU5LjYtMTg1LjIgNTQuNC0yNTQuOC0xNS4yLTY5LjYtNjkuNi03NC44LTE3OS4yLTE1LjItMjU0Ljh6IiBmaWxsPSIjRjY4RjZGIiBwLWlkPSI0NDkyIj48L3BhdGg+PHBhdGggZD0iTTUzNS42IDU1My4ybC0xMi44LTYuNCAxMC40LTIxLjJjNC40LTguOCAyLjgtMTkuNi00LjQtMjYuOGwtMTQuOC0xNC44IDEwLTEwIDE0LjggMTQuOGMxMS42IDExLjYgMTQuNCAyOC44IDcuMiA0My42bC0xMC40IDIwLjh6IiBmaWxsPSIjNEE1NTVGIiBwLWlkPSI0NDkzIj48L3BhdGg+PHBhdGggZD0iTTQyMy4yIDM5My4ybC0xNC44LTE0LjhhMjMuMiAyMy4yIDAgMCAwLTI2LjgtNC40bC0yMS4yIDEwLjQtNi40LTEyLjggMjEuMi0xMC40YzE0LjQtNy4yIDMyLTQuNCA0My42IDcuMmwxNC44IDE0LjgtMTAuNCAxMHoiIGZpbGw9IiM0QTU1NUYiIHAtaWQ9IjQ0OTQiPjwvcGF0aD48L3N2Zz4=");
+    background-repeat: no-repeat;
+    filter: blur(.1rem);
+    background-size: contain;
+    background-position: center
+  }
 
-.card-link-backdrop {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-image: url(/lib/img/card-link-bg.jpg);
-  background-repeat: no-repeat;
-  -webkit-filter: blur(20px);
-  filter: blur(20px);
-  background-size: cover;
-  background-position: center
-}
+  &content {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: .75rem;
+    background-color: rgba(245, 245, 245, 0.88);
+  }
 
-.card-link,.card-link:hover {
-  text-decoration: none;
-  border: none!important;
-  color: inherit!important
-}
+  &text {
+    overflow: hidden;
+  }
 
-.card-link-content {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 12px;
-  border-radius: inherit;
-  background-color: rgba(246,246,246,0.88)
-}
+  &title {
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    overflow: hidden;
+    max-height: calc(1rem * 1.25 * 2);
+    font-size: 1rem;
+    font-weight: 500;
+    line-height: 1.25;
+    color: $global-font-color;
+  }
 
-.card-link-text {
-  overflow: hidden
-}
+  &meta {
+    display: flex;
+    align-items: center;
+    margin-top: .25rem;
+    font-size: .825rem;
+    color: $global-font-secondary-color;
+  }
 
-.card-link-title {
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-height: calc(16px * 1.25 * 2);
-  font-size: 16px;
-  font-weight: 500;
-  line-height: 1.25;
-  color: #1a1a1a
-}
+  &icon-link {
+    width: 1rem;
+    height: 1rem;
+    flex-shrink: 0;
+    margin-right: .25rem;
+  }
 
-.card-link-meta {
-  display: flex;
-  margin-top: 4px;
-  font-size: 14px;
-  line-height: 20px;
-  color: #999;
-  white-space: nowrap
-}
+  &url {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
 
-.card-link-url {
-  display: inline-flex;
-  align-items: center;
-}
+  &icon-globe {
+    width: 4rem;
+    height: 4rem;
+    flex-shrink: 0;
+    margin-left: .25rem;
+  }
 
-.card-link-image-cell {
-  margin-left: 8px;
-  border-radius: 6px
-}
+  [theme=dark] & {
+    &backdrop {
+      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNjQyNjkxOTIyMjk0IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjE2MzYwIiB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj48ZGVmcz48c3R5bGUgdHlwZT0idGV4dC9jc3MiPjwvc3R5bGU+PC9kZWZzPjxwYXRoIGQ9Ik05NDYuNzA0NTY2IDUyMy41MjE0MDRjLTcuNzU3Njg0LTQuMjI4MzAxLTE3LjU2MDk1OC02LjE5ODE2Ni0zMC44NTI2ODItNi4xOTgxNjZsLTEwMS4xODc1ODcgMEw4MTQuNjY0Mjk4IDM2NC4xMDk3NDJsODUuNTI1ODg1LTg1LjUyNTg4NWM2LjEyMDM5NC02LjEyMDM5NCAxNC4yNTc3MjUtMTUuNzY0MDMyIDE0LjI1NzcyNS0yOC43OTg5MDZzLTguMTM2MzA4LTIyLjY3ODUxMi0xNC4yNTY3MDItMjguNzk3ODgzYy03LjQwNDY0NC03LjQwNTY2Ny0xNS43ODA0MDUtMTQuMjU3NzI1LTI2LjgzMjExMi0xNC4yNTc3MjUtMTEuMDUwNjg0IDAtMTkuNDI1NDIyIDYuODUyMDU4LTI2LjgzMTA4OSAxNC4yNTc3MjVsLTg1LjUyNTg4NSA4NS41MjY5MDlMMzAyLjY0NDg1NSAzMDYuNTEzOTc2IDIxNy4xMTg5NjkgMjIwLjk4NjA0M2MtNy41MTMxMTQtNy41MTMxMTQtMTUuMTM2NzQ1LTE0LjI1NzcyNS0yNS43NTM1NDctMTQuMjU3NzI1LTEwLjYxNzgyNSAwLTE4LjI0MDQzMyA2Ljc0MzU4OC0yNS43NTM1NDcgMTQuMjU3NzI1LTYuODk4MTA3IDYuODk3MDg0LTE0LjI1NjcwMiAxNS4xODk5NTctMTQuMjU2NzAyIDI2LjMzMzc2MnM3LjM1ODU5NSAxOS40MzY2NzggMTQuMjU2NzAyIDI2LjMzNDc4NWw4NS41MjY5MDkgODUuNTI2OTA5IDAgMTU2LjM1MTk3Ny0xMDEuMTg3NTg3IDBjLTQ1LjE3NjkyMiAwLTQ4LjY4ODkwOSAzMC4xODc1MzMtNDguNjg4OTA5IDM5LjQzOTI0NCAwIDExLjU0MzkxNyA0Ljc0NDA0OCAzOC4zOTU0NzIgNDguNjg4OTA5IDM4LjM5NTQ3MmwxMDEuNTE1MDQ1IDBjMi4wNDA0NzMgNDguNTAyNjY3IDEzLjQ3MDgwMyAxMDAuMzcyMDEyIDMwLjU3ODQzNiAxMzguNTAwNDAxbC05OC4zMjIzMjkgMTEwLjUzNDQ2Ni0wLjIwNTY4NSAwLjIzNTM2Yy0xOC41ODIyMTcgMjEuNzY2NzQ2LTE4LjU0MDI2MiA0NS45ODAyMTcgMC4xMDk0OTQgNjMuMTkwMTgxbDAuNDYyNTM0IDAuNDA5MzIyYzkuOTU0NzIzIDguNDY5OTA1IDE1LjYzNjExOSA5LjM1NTA2NSAyNi4yMjczMzggOS4zNTUwNjVsMC4xOTIzODIgMGMxMi44MTg5NTcgMCAyNS4yNjY0NTMtNi4xNDA4NiAzNS45OTQ3OTYtMTcuNzU4NDU2bDg1LjI0NDQ3Ni05Ni4zODcyNTdjMjYuMTc4MjE5IDIxLjgyOTE2OCA5Mi4yNjEyODcgNjguNTkwMTY4IDE3Ny45NTYwMTggNjguNTkwMTY4bDE1LjM0OTU5MyAwTDUyNS4wNTMyOTQgNDAzLjgxNTA0NWwxNS40NDM3MzcgMCAwIDQ2Ni4yMjIzOTcgMTUuMzQ5NTkzIDBjNzQuNDUzNzEyIDAgMTQzLjczOTcyOC00My40MzUyNTUgMTcwLjA3MTQ0NC02Mi4wOTgzMTNsOTMuNDM3MDY2IDkyLjkyOTUwNmM4LjY3NTU5IDkuMjg2NTA0IDIxLjE5ODgxMSAxNC42MDM2MDMgMzQuNDI2MDY3IDE0LjYwMzYwMyAxLjE0MzAzMyAwIDIuMTk5MDg1IDAuMDMxNzIyIDMuMTg5NjQ1IDAuMDU5MzUyIDcuMTIzMjM0IDAuMjAzNjM4IDE2Ljg1Mzg1MyAwLjQ3NDgxNCAyNi43Njk2OS0xMC4xNjI0NTQgOS4xMTk3MDUtOS4yMjIwMzUgMTEuMDQzNTItMTguNjUzODQ5IDExLjA0MzUyLTI0Ljk2NTYwMSAwLTE1LjI2NDY1OS0xMC43NDE2NDUtMjcuNzM5Nzg0LTE4Ljc3NzY2OS0zNS43NTIyNzJsLTEwMC4yNTAyMzgtMTAwLjc2OTA1NWMxOC40OTQyMTMtMzcuMDgxNTQ3IDM1LjgxMTYyNC05My45NzgzOTUgMzguNTM0NjQyLTE1MS4xMTE2MjZsMTAxLjU1ODAyNCAwYzEzLjI4NTU4NCAwIDIzLjExMDM0Ny0yLjAwMzYzNCAzMC45MTcxNS02LjMwNzY1OSAxMS40NjAwMDYtNi4zMTU4NDYgMTcuNzcwNzM1LTE3LjUwMDU4MyAxNy43NzA3MzUtMzEuNDkxMjI1Qzk2NC41Mzg3NDcgNTQwLjk1OTU2NSA5NTguMjA1NTA1IDUyOS43ODkxNTUgOTQ2LjcwNDU2NiA1MjMuNTIxNDA0ek05MzEuOTQ5NTE0IDU1OS41Nzk2NDVjLTIuMDY0MDA5IDEuMTM2ODkzLTYuNTMxNzYzIDIuNDkzNzk3LTE2LjA5NzYzIDIuNDkzNzk3TDc4My45NjQwODggNTYyLjA3MzQ0MmwwIDE1LjM0OTU5M2MwIDYxLjg0MTQ2My0yMC45NTczMTEgMTI3LjE5MDgyMS00MC40MzA4MjggMTYxLjczODY2MWwtNS43MDU5NTUgMTAuMTI0NTkyIDExNi40NjE0NTUgMTE3LjA2MjEzNmM5LjMyNDM2NiA5LjI5Nzc2IDkuNzk3MTM0IDEzLjM0MDg0MyA5Ljc5NzEzNCAxNC4wNTYxMzQgMCAxLjEyNjY2LTEuNzI4MzY0IDIuOTM3OTEyLTIuMjU4NDM3IDMuNDY1OTM4bC0wLjQ3MTc0NCAwLjQ5MjIxYy0wLjIwNDY2MSAwLjIyMzA4MS0wLjM3NDUzIDAuMzk0OTk2LTAuNTA5NjA2IDAuNTI0OTU2LTAuNzgxODA2IDAuMDIzNTM2LTIuMDMyMjg2LTAuMDE0MzI2LTMuMDA4NTItMC4wNDA5MzItMS4yNTg2NjctMC4wMzU4MTYtMi42MDIyNjgtMC4wNzE2MzEtNC4wNTUzNjItMC4wNzE2MzEtNC43MTY0MTggMC05LjIzMDIyMi0xLjg1MDEzOC0xMi4wNzI5NjctNC45NDc2ODVMNzI4LjQzNjQyNCA3NjcuMTQ0MDA0bC0xMC43MDY4NTMgOC42MzI2MTFjLTAuNzM5ODUgMC41OTU1NjQtNzAuMjE1MTc4IDU1LjkzMTg3LTE0Ni41MzEzMDggNjIuODU0NTM3TDU3MS4xOTgyNjQgMzczLjExNTg1OWwtNzYuODQyMTA5IDAgMCA0NjUuNjMzOTk2Yy00My40NTU3MjEtMy4zMTg1ODItODAuNDUwMjg3LTIwLjA0MTQ1Mi0xMDQuODA3MDIxLTM0LjMwOTQxLTI5Ljk1ODMxMi0xNy41NDc2NTUtNDguMDU3NTI5LTM1LjQwNzQxOC00OC4yMjEyNTgtMzUuNTY5MWwtMTEuNTQwODQ3LTExLjU0NTk2NEwyMjMuODQ0MTM4IDg3Ny4xMjI4MTVjLTQuNTk2NjkxIDQuOTQwNTIyLTkuNDUwMjMzIDcuNzcyMDExLTEzLjMzMzY4IDcuNzcyMDExbC0wLjE5MzQwNSAwYy0xLjQxNTIzMiAwLTIuOTg0OTg0IDAtMy44MjQwOTUtMC4wNTMyMTItMC4zNzA0MzctMC4yNTE3MzMtMS4wNjczMDgtMC43Njc0OC0yLjI3Njg1Ni0xLjc4NjY5My0zLjAxMTU5LTIuNzkzNjI2LTcuOTkyMDIxLTcuOTUzMTM2IDIuNTU4MjY1LTIwLjM3NTA1bDExMS45MjQxMTUtMTI1LjgyNTczLTQuNzI2NjUxLTkuMzI3NDM2Yy0xNC44MjM2MTQtMjkuMjUyMjMxLTMyLjEzMzg2MS04NS45NTk3NjctMzIuMTMzODYxLTE0OS41MDcwODJsMC0xNS4zNDk1OTNMMTQ5Ljk1MTE5NyA1NjIuNjcwMDNjLTkuNzgzODMxIDAtMTQuMTI4Nzg5LTEuNjYwODI2LTE1Ljg0Nzk0My0yLjY1MTM4Ni0xLjEwMTA3Ny0wLjYzMzQyNy0yLjE0MDc1Ny0xLjIzMjA2MS0yLjE0MDc1Ny01LjA0NTkyMyAwLTMuMDU0NTY5IDAtOC43NDAwNTggMTcuOTg5NzIzLTguNzQwMDU4bDEzMS44ODY3NzMgMEwyODEuODM4OTkzIDM0Ni40NjU4OTYgMTg3LjMyMDI5MyAyNTEuOTQ4MjE5Yy0yLjEyMjMzNy0yLjEyMjMzNy0zLjQ1MDU4OS0zLjYxMjI3MS00LjI3NzQyLTQuNjI3MzkxIDAuODI2ODMxLTEuMDE1MTIgMi4xNTUwODMtMi41MDUwNTQgNC4yNzc0Mi00LjYyNjM2NyAxLjc2MTExLTEuNzYxMTEgMy4wNzI5ODktMi45OTAxMDEgNC4wNDUxMjktMy44NDU1ODUgMC45NzIxNDEgMC44NTU0ODQgMi4yODQwMTkgMi4wODQ0NzUgNC4wNDYxNTMgMy44NDU1ODVsOTQuNTE3Njc3IDk0LjUxODcgNDgzLjc4ODQ3MSAwIDk0LjUxNzY3Ny05NC41MTg3YzIuNDc4NDQ4LTIuNDc3NDI0IDQuMTA4NTc0LTMuODQ5Njc4IDUuMTIzNjk0LTQuNjA0ODc4IDEuMDE1MTIgMC43NTQxNzcgMi42NDYyNyAyLjEyNjQzIDUuMTIzNjk0IDQuNjA0ODc4IDQuOTE0OTQgNC45MTM5MTYgNS4yNjE4NCA3LjA3MzA5MiA1LjI2NTkzNCA3LjA3MzA5Mi0wLjAwMjA0NyAwLjAyMDQ2Ni0wLjMzNTY0NCAyLjE3NzU5Ni01LjI2NTkzNCA3LjEwODkwOGwtOTQuNTE3Njc3IDk0LjUxNzY3NyAwIDE5Ni42MjgyODYgMTMxLjg4Njc3MyAwYzkuNjM2NDc0IDAgMTQuMTA3Mjk5IDEuMzM0MzkxIDE2LjE2MjA5OCAyLjQ1Mzg4OCAxLjAyMDIzNiAwLjU1NTY1NSAxLjgyNjYwMiAwLjk5NTY3NyAxLjgyNjYwMiA0LjQ5NjQwN0M5MzMuODM5NTYxIDU1OC41Mzc5MTkgOTMzLjAwNTU2NiA1NTguOTk3Mzg0IDkzMS45NDk1MTQgNTU5LjU3OTY0NXoiIHAtaWQ9IjE2MzYxIiBmaWxsPSIjYTlhOWIzIj48L3BhdGg+PHBhdGggZD0iTTcxNC43NTc4OSAyNTMuMTk4Njk5YzAtNDguNjQ5LTE4Ljg5NjM3Mi05NC4zMzc1NzUtNTMuMjA3ODI5LTEyOC42NDkwMzItMzQuMzExNDU3LTM0LjMxMjQ4LTgwLjAwMTA1NS01My4yMDg4NTItMTI4LjY1MDA1NS01My4yMDg4NTItNDguNjQ5IDAtOTQuMzM2NTUyIDE4Ljg5NjM3Mi0xMjguNjQ5MDMyIDUzLjIwODg1Mi0zNC4zMTE0NTcgMzQuMzExNDU3LTUzLjIwNzgyOSA4MC4wMDAwMzItNTMuMjA3ODI5IDEyOC42NDkwMzJsMCAxNS4zNDk1OTMgMzYzLjcxNDc0NSAwTDcxNC43NTc4OSAyNTMuMTk4Njk5ek0zODIuNTE1OTUgMjM3Ljg0OTEwNmM3LjcxMzY4Mi03Ni4xNjk3OTcgNzIuMjE0NzE4LTEzNS44MDkxMDUgMTUwLjM4NDA1Ni0xMzUuODA5MTA1czE0Mi42NzEzOTcgNTkuNjM5MzA5IDE1MC4zODUwNzkgMTM1LjgwOTEwNUwzODIuNTE1OTUgMjM3Ljg0OTEwNnoiIHAtaWQ9IjE2MzYyIiBmaWxsPSIjYTlhOWIzIj48L3BhdGg+PC9zdmc+");
+    }
+
+    &content {
+      background-color: rgba(61, 62, 65, 0.88);
+    }
+
+    &title {
+      color: $global-font-color-dark;
+    }
+
+    &meta {
+      color: $global-font-secondary-color-dark;
+    }
+  }
 
-.card-link-image {
-  display: block;
-  width: 60px;
-  height: 60px;
-  border-radius: inherit
 }