xaoxuu
/
hexo-theme-stellar
mirror of https://github.com/xaoxuu/hexo-theme-stellar
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

优化link标签

This commit is contained in:
xaoxuu 2021-11-19 22:59:46 +08:00
parent 90b31903ef
commit 700e0cc136
2 changed files with 15 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
scripts/tags/link.js
View File

@ -7,6 +7,9 @@
'use strict'; 'use strict';
var util = require('hexo-util');
const full_url_for = require('hexo-util').full_url_for.bind(hexo);
hexo.extend.tag.register('link', function(args) { hexo.extend.tag.register('link', function(args) {
args = hexo.args.map(args, ['icon'], ['url', 'title', 'description']); args = hexo.args.map(args, ['icon'], ['url', 'title', 'description']);
@ -28,7 +31,7 @@ hexo.extend.tag.register('link', function(args) {
return el; return el;
} }
function loadTitle() { function loadTitle() {
return '<span class="title fs14">' + args.title + '</span>'; return '<span class="title">' + args.title + '</span>';
} }
function loadDesc() { function loadDesc() {
return '<span class="url fs12">' + (args.description || args.url) + '</span>'; return '<span class="url fs12">' + (args.description || args.url) + '</span>';
@ -38,7 +41,7 @@ hexo.extend.tag.register('link', function(args) {
// top // top
el += '<div class="top">'; el += '<div class="top">';
el += loadIcon(); el += loadIcon();
el += '<span class="url fs12">' + args.url + '</span>'; el += '<span class="url fs12">' + full_url_for(args.url) + '</span>';
el += '</div>'; el += '</div>';
// bottom // bottom
el += '<div class="bottom">'; el += '<div class="bottom">';

15
source/css/_layout/tag-plugins/link.styl
View File

@ -26,13 +26,15 @@
.md .link-card.plain .md .link-card.plain
flex-direction: row flex-direction: row
align-items: center
.md .link-card.rich .md .link-card.rich
flex-direction: column flex-direction: column
align-items: flex-start align-items: stretch
width: 400px width: 400px
.md .link-card .md .link-card
line-height: 1.2
> div > div
pointer-events: none pointer-events: none
>.top >.top
@ -51,11 +53,15 @@
background-position: left center background-position: left center
.url .url
opacity: .75 opacity: .75
line-height: 1.5
span span
txt-ellipsis() txt-ellipsis()
max-width: 100% max-width: 100%
>.bottom >.bottom
margin: 0 1rem .75rem 1rem margin: 0 1rem .75rem 1rem
.title
font-size: $fs-15
margin: 4px 0 8px 0
>.right >.right
width: 2.5rem width: 2.5rem
height: 2.5rem height: 2.5rem
@ -65,6 +71,9 @@
>.left >.left
overflow: hidden overflow: hidden
margin: .5rem 0 .5rem 1rem margin: .5rem 0 .5rem 1rem
.title
font-size: $fs-14
margin: 4px 0
.url .url
flex-shrink: 0 flex-shrink: 0
txt-ellipsis() txt-ellipsis()
@ -74,9 +83,5 @@
span.title span.title
font-weight: 500 font-weight: 500
color: var(--text-p1) color: var(--text-p1)
line-height: 1.2
margin: 4px 0
span.url span.url
color: var(--text-p3) color: var(--text-p3)
line-height: 1.4
margin: 2px 0