ℹ️Log｜2023-06-15

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

{{ $repo := .Get "repo" }}
{{ $detail := getJSON "https://api.github.com/repos/" $repo }}
<article class="sc-card">
  <a href="https://github.com/{{ $repo }}" target="_blank" rel="noopener">
    <header>
      <img alt="{{ $repo }}" src="https://opengraph.githubassets.com/1/{{ $repo }}" />
    </header>
    <div class="sc-card-content">
      <p class="sc-card-title">{{ .Get "repo" }}</p>
      <p class="sc-card-details">{{ with $detail }}</p>
      <p class="sc-card-details">{{ .description }}</p>
      {{ end }}
      <span>github.com</span>
    </div>
  </a>
</article>

 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

.sc-card {
    border-radius: .85em;
    border-width: 1px;
    border-style: solid;
    border-color: #e1e8ed;
    box-sizing: border-box;
    overflow: hidden;
    font-size: 14px
}

.sc-card:hover .sc-card-content {
    background: #f5f8fa
}

.sc-card a {
    text-decoration: none
}

.sc-card img {
    border: none;
    margin: 0 auto;
    border-radius: 15px 15px 0 0;
}

.sc-card-content {
    padding: 1em
}

.sc-card-content h2 {
    margin: 0 0 .15em;
    max-height: 1.3em;
    color: #000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.sc-card-content p.sc-card-title {
    font-weight: 700;
    font-size: 1.5em;
    line-height: 1.25;
    margin: 0 0 .15em;
    color: #000
}

.sc-card-content p.sc-card-details {
    margin: 0;
    color: #000
}

.sc-card-content span {
    color: #4f5a5f
}