devtem-dev.github.io/projects.html at main · devtem-dev/devtem-dev.github.io · 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
111
112
113
114
115
116
117
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>Projects | devtemDesign Free Website Builder</title>
  <meta name="description" content="Manage your devtemDesign projects in one place. Preview, edit, organize, and export landing pages, portfolios, SaaS websites, documentation sites, and custom web projects built with the free visual website builder.">
  <meta name="keywords" content="devtemDesign projects, website builder projects, landing page builder, portfolio builder, free website builder, visual website builder, website manager, HTML export, JavaScript website builder, project dashboard, page generator, website editor, frontend builder, DevTemple">
  <meta name="author" content="DevTemple">
  <!-- Private dashboard (content lives in the visitor's localStorage): keep it out of search results -->
  <meta name="robots" content="noindex, follow">
  <meta name="theme-color" content="#00ffff">
  <link rel="canonical" href="https://design.devtem.org/projects">
  <meta name="application-name" content="devtemDesign">
  <meta name="apple-mobile-web-app-title" content="devtemDesign">

  <!-- Open Graph -->
  <meta property="og:type" content="website">
  <meta property="og:site_name" content="devtemDesign">
  <meta property="og:title" content="Projects | devtemDesign">
  <meta property="og:description" content="Preview, edit, organize, and export your website projects created with the free devtemDesign Builder.">
  <meta property="og:url" content="https://design.devtem.org/projects">
  <meta property="og:image" content="https://design.devtem.org/assets/images/og.jpg">
  <meta property="og:image:width" content="1200">
  <meta property="og:image:height" content="630">
  <meta property="og:image:alt" content="devtemDesign Projects Dashboard">

  <!-- Twitter -->
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="Projects | devtemDesign">
  <meta name="twitter:description" content="Manage, preview, edit, and export website projects built with devtemDesign.">
  <meta name="twitter:image" content="https://design.devtem.org/assets/images/og.jpg">

  <link rel="icon" href="https://design.devtem.org/assets/images/logo.png">
  <link rel="apple-touch-icon" href="https://design.devtem.org/assets/images/logo.png">

  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "WebApplication",
    "name": "devtemDesign Projects",
    "applicationCategory": "DeveloperApplication",
    "operatingSystem": "Web",
    "url": "https://design.devtem.org/projects",
    "image": "https://design.devtem.org/assets/images/og.jpg",
    "description": "Project dashboard for managing, previewing, editing, and exporting websites created with devtemDesign.",
    "creator": { "@type": "Organization", "name": "DevTemple" }
  }
  </script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" />
  <link rel="stylesheet" href="/css/projects.css">
</head>
<body>

<!-- HEADER -->
<header class="app-header">
  <a class="brand" href="/"><i><img src="https://fscss.devtem.org/assets/images/fscss.png" alt="FSCSS" width="30" height="30"></i> devtemDesign</a>
  <span class="sep">/</span>
  <span class="sub">Projects</span>
  <div class="header-right">
    <div class="header-links">
      <a href="https://design.devtem.org/docs" target="_blank" rel="noreferrer" title="Docs"><i class="fas fa-book"></i></a>
      <a href="https://devtem.org" target="_blank" rel="noreferrer" title="DevTemple"><i class="fas fa-store"></i></a>
    </div>
    <div class="theme-toggle">
      <button class="theme-btn active" id="btn-dark" title="Dark"><i class="fas fa-moon"></i></button>
      <button class="theme-btn" id="btn-light" title="Light"><i class="fas fa-sun"></i></button>
    </div>
  </div>
</header>

<!-- MAIN -->
<main>
  <div class="page-top">
    <h1><i class="fas fa-folder-open"></i> Your Website Projects <span class="proj-count-badge" id="count-badge">0</span></h1>
    <a class="new-btn" href="/builder"><i class="fas fa-plus"></i> New page</a>
  </div>

  <div class="search-bar">
    <i class="fas fa-magnifying-glass"></i>
    <input type="text" id="search-input" placeholder="Search projects…">
  </div>

  <div id="empty-state" class="empty-state" style="display:none;">
    <i class="fas fa-folder"></i>
    <h2>No projects yet</h2>
    <p>Generate and save a page in the builder to see it here.</p>
    <a class="new-btn" href="/builder"><i class="fas fa-rocket"></i> Open Builder</a>
  </div>

  <div class="projects-grid" id="projects-grid"></div>
</main>

<!-- PREVIEW MODAL -->
<div class="preview-modal" id="preview-modal">
  <div class="modal-bar">
    <span class="modal-title" id="modal-title">Preview</span>
    <a class="modal-edit-btn" id="modal-edit-btn" href="#"><i class="fas fa-pen"></i> Edit</a>
    <button class="modal-export-btn" id="modal-export-btn"><i class="fas fa-download"></i> Export</button>
    <button class="modal-close" id="modal-close"><i class="fas fa-times"></i> Close</button>
  </div>
  <iframe id="modal-frame" sandbox="allow-scripts allow-same-origin" title="Preview"></iframe>
</div>

<!-- FOOTER -->
<footer class="app-footer">
  <a href="/builder"><i class="fas fa-arrow-left"></i> Builder</a>
  <span class="fsep">·</span>
  <a href="https://design.devtem.org/docs" target="_blank" rel="noreferrer"><i class="fas fa-book"></i> docs</a>
  <span class="fsep">·</span>
  <a href="https://devtem.org" target="_blank" rel="noreferrer"><i class="fas fa-store"></i> DevTemple</a>
</footer>

<script src="/js/shared.js"></script>
<script src="/js/projects.js"></script>
</body>
</html>