-
Notifications
You must be signed in to change notification settings - Fork 0
/
page-links.php
125 lines (124 loc) · 2.81 KB
/
page-links.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<?php
/**
* 友情链接
*
* @package custom
*/
if (!defined('__TYPECHO_ROOT_DIR__')) exit; ?>
<?php $this->need('header.php'); ?>
<div class="main">
<div class="container">
<article class="post-wrap page">
<div class="post-wrap">
<h2 class="post-title">- <?php $this->title() ?> -</h2>
<section class="post-content">
<div id="links">
<div class="links-content">
<div class="link-navigation">
<?php
Links_Plugin::output('
<div class="card">
<img class="ava" src="{image}" onerror=this.onerror=null,this.src="https://cdn.jsdelivr.net/gh/jkjoy/[email protected]/img/loading.svg">
<div class="card-header">
<div><a href="{url}" target="_blank" title="{name}">{name}</a></div>
<div class="info" title="{title}">{title}</div>
</div></div>
');
?>
</div> </div> </div>
</section>
<!-- 判断如果允许评论则显示评论的div -->
<?php if ($this->allow('comment')): ?>
<!-- 如果启用了 twikoo 选项,显示 twikoo 评论系统 -->
<?php if ($this->options->twikoo): ?>
<?php $this->options->twikoo(); ?>
<?php else: ?>
<!-- 否则调用自带的评论模板 -->
<?php $this->need('comments.php'); ?>
<?php endif; ?>
<?php endif; ?>
</div>
</article>
</div></div>
<?php $this->need('footer.php'); ?>
<style>
#links {
padding-left: 3.5em;
}
.container .main-inner {
width: 100%;
}
.links-content {
margin-top: 1rem;
}
.link-navigation::after {
content: " ";
display: block;
clear: both;
}
.card {
width: 40%;
font-size: 1rem;
padding: 20px 10px;
border-radius: 4px;
transition-duration: 0.15s;
margin-bottom: 1rem;
display: flex;
}
.card:nth-child(odd) {
float: left;
}
.card:nth-child(even) {
float: right;
}
.card:hover {
transform: scale(1.1);
box-shadow: 0 2px 6px 0 rgba(0,0,0,0.12), 0 0 6px 0 rgba(0,0,0,0.04);
}
.card a {
border: none;
}
.card .ava {
width: 64px;
height: 48px;
margin: 0;
margin-right: 1em;
border-radius: 50%;
display: block;
transition: all 0.75s;
}
.card .ava:hover {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
.card .card-header {
font-style: italic;
overflow: hidden;
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
}
.card .card-header a {
font-style: normal;
color: #2bbc8a;
font-weight: bold;
text-decoration: none;
}
.card .card-header a:hover {
color: #d480aa;
text-decoration: none;
}
.card .card-header .info {
font-style: normal;
color: #a3a3a3;
font-size: 12px;
min-width: 0;
word-break: break-word;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>