excalidraw-libraries/index.html at main · Leantime/excalidraw-libraries · GitHub

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
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, user-scalable=no"
    />

    <!-- General tags -->
    <meta
      name="description"
      content="A directory of public libraries that you can easily add to Leantime or Excalidraw."
    />
    <meta name="image" content="og-image.png" />

    <!-- OpenGraph tags -->
    <meta property="og:url" content="https://excalidrawlibs.leantime.io" />
    <meta property="og:site_name" content="Leantime" />
    <meta property="og:type" content="website" />
    <meta
      property="og:title"
      name="twitter:title"
      content="Excalidraw Libraries"
    />
    <meta
      property="og:description"
      name="twitter:description"
      content="A directory of public libraries that you can easily add to Leantime or Excalidraw."
    />

    <!-- Twitter Card tags -->
    <title>Leantime Excalidraw Libraries</title>

    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/normalize.css/normalize.min.css"
    />
    <link rel="stylesheet" href="style.css" />
    <link rel="icon" href="favicon.ico" />

  </head>

  <body>

    <div class="content">
      <header>
        <h1>Leantime Excalidraw Libraries</h1>
        <p class="lead">
          A directory of public libraries that you can easily add to your Leantime Whiteboards
        </p>

        <div id="sort">
          <span id="sort-contents">Sort By </span>
          <span id="sort-template" class="option">{label}</span>
        </div>
        <p class="search-container">
          <input
            type="search"
            id="search-input"
            placeholder="Search..."
            autocorrect="off"
          />
          <span class="search-tip"
            >(tip: you can type anywhere to start searching)</span
          >
        </p>
      </header>
      <main>
        <div class="library" id="template">
          <img data-src="{preview}" alt="{name}" class="lazy" />
          <h2>{name} <a aria-label="Anchor" href="#{libraryId}">#</a></h2>
          <p class="authors">{authors}</p>
          <p class="downloads">
            <span title="Downloads ({week} this week)">⬇️ {total}</span>
          </p>
          <div class="dates">
            <p class="created">Created: {created}</p>
            <p class="updated">Updated: {updated}</p>
          </div>
          <p>{description}</p>
          <div class="actions">
            <a
              class="btn primary install-library"
              href="{addToLib}"
              target="{target}"
              onclick="trackEvent('library', 'import', '{libraryId}')"
              >➡️ Add to {appName}</a
            >
            <a
              class="btn"
              href="{source}"
              onclick="trackEvent('library', 'download', '{libraryId}')"
              >⬇️ Download</a
            >
          </div>
        </div>
      </main>
      <footer>
        <div id="footer">
          © {currentYear} <a href="https://excalidraw.com">Excalidraw</a> •
          <a href="https://github.com/excalidraw/excalidraw-libraries"
            >Source Code</a
          >
        </div>
      </footer>
    </div>
    <script src="script.js"></script>
  </body>
</html>