mirror of
https://github.com/hugo-fixit/FixIt.git
synced 2026-08-25 07:48:54 +00:00
✨ Feat: add cardlink shoretcode (https://github.com/Lruihao/hugo-blog/commit/df9eca26af43287748fd8d4654014357a8269b0b)
This commit is contained in:
@@ -273,6 +273,7 @@
|
||||
@import "../_partial/_single/mapbox";
|
||||
@import "../_partial/_single/music";
|
||||
@import "../_partial/_single/bilibili";
|
||||
@import "../_partial/_single/cardlink";
|
||||
|
||||
hr {
|
||||
margin: 1rem 0;
|
||||
|
||||
@@ -0,0 +1,97 @@
|
||||
//卡片式链接样式 cardlink
|
||||
|
||||
.card-link,.card-link:hover {
|
||||
text-decoration: none;
|
||||
border: none!important;
|
||||
color: inherit!important
|
||||
}
|
||||
|
||||
.card-link {
|
||||
position: relative;
|
||||
display: block;
|
||||
margin: 1em auto;
|
||||
width: 390px;
|
||||
box-sizing: border-box;
|
||||
border-radius: 12px;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
color: inherit;
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
.ztext {
|
||||
word-break: break-word;
|
||||
line-height: 1.6
|
||||
}
|
||||
|
||||
.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
|
||||
}
|
||||
|
||||
.card-link,.card-link:hover {
|
||||
text-decoration: none;
|
||||
border: none!important;
|
||||
color: inherit!important
|
||||
}
|
||||
|
||||
.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)
|
||||
}
|
||||
|
||||
.card-link-text {
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.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
|
||||
}
|
||||
|
||||
.card-link-meta {
|
||||
display: flex;
|
||||
margin-top: 4px;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: #999;
|
||||
white-space: nowrap
|
||||
}
|
||||
|
||||
.card-link-url {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card-link-imageCell {
|
||||
margin-left: 8px;
|
||||
border-radius: 6px
|
||||
}
|
||||
|
||||
.card-link-image {
|
||||
display: block;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: inherit
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
{{- $rel := "" -}}
|
||||
<a href="{{ .Destination | safeURL }}"{{ with .Title }} title="{{ . }}"{{ end }}{{ if (urls.Parse .Destination).Host | or .Newtab }}{{ $rel = "noopener noreffer" }} target="_blank"{{ end }} rel="{{ $rel }}{{ with .Rel }} {{ . }}{{ end }}"{{ with .Class }} class="{{ . }} card-link"{{ end }} class="card-link">
|
||||
<span class="card-link-backdrop"></span>
|
||||
<span class="card-link-content">
|
||||
<span class="card-link-text">
|
||||
<span class="card-link-title">
|
||||
{{- with .Content -}}
|
||||
{{- . | safeHTML -}}
|
||||
{{- end -}}
|
||||
</span>
|
||||
<span class="card-link-meta">
|
||||
<span class="card-link-url">
|
||||
<svg class="Zi Zi--InsertLink" fill="currentColor" viewbox="0 0 24 24" width="17" height="17">
|
||||
<path d="M6.77 17.23c-.905-.904-.94-2.333-.08-3.193l3.059-3.06-1.192-1.19-3.059 3.058c-1.489 1.489-1.427 3.954.138 5.519s4.03 1.627 5.519.138l3.059-3.059-1.192-1.192-3.059 3.06c-.86.86-2.289.824-3.193-.08zm3.016-8.673l1.192 1.192 3.059-3.06c.86-.86 2.289-.824 3.193.08.905.905.94 2.334.08 3.194l-3.059 3.06 1.192 1.19 3.059-3.058c1.489-1.489 1.427-3.954-.138-5.519s-4.03-1.627-5.519-.138L9.786 8.557zm-1.023 6.68c.33.33.863.343 1.177.029l5.34-5.34c.314-.314.3-.846-.03-1.176-.33-.33-.862-.344-1.176-.03l-5.34 5.34c-.314.314-.3.846.03 1.177z" fill-rule="evenodd"></path>
|
||||
</svg>
|
||||
</span>
|
||||
{{ .Destination | safeURL }}
|
||||
</span>
|
||||
</span>
|
||||
<span class="card-link-imageCell">
|
||||
<img class="card-link-image" alt="card-link icon" src="/lib/img/linkicon.png" />
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
@@ -0,0 +1,15 @@
|
||||
{{- $destination := cond .IsNamedParams (.Get "href") (.Get 0) -}}
|
||||
{{- with dict "Path" $destination "Resources" .Page.Resources | partial "function/resource.html" -}}
|
||||
{{- $destination = .RelPermalink -}}
|
||||
{{- end -}}
|
||||
{{- $options := dict "Destination" $destination -}}
|
||||
{{- if .IsNamedParams -}}
|
||||
{{- $options = dict "Content" (.Get "content") | merge $options -}}
|
||||
{{- $options = dict "Title" (.Get "title") | merge $options -}}
|
||||
{{- $options = dict "Class" (.Get "class") | merge $options -}}
|
||||
{{- $options = dict "Rel" (.Get "rel") | merge $options -}}
|
||||
{{- else -}}
|
||||
{{- $options = dict "Content" (.Get 1 | default (.Get 0)) | merge $options -}}
|
||||
{{- $options = dict "Title" (.Get 2) | merge $options -}}
|
||||
{{- end -}}
|
||||
{{- partial "plugin/cardlink.html" $options -}}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 694 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Reference in New Issue
Block a user