Erik/DataDash
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

WIP Session 1

Browse Source
This commit is contained in:
schriefer 2024-06-07 12:47:45 +02:00
parent 56af64a7a4
commit 5bfe59a71f
6 changed files with 642 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

116
html/chat1/index.html Normal file
View File

@ -0,0 +1,116 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DataDash</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container">
<header>
<h1>Welcome to DataDash! 👋</h1>
<p>The place to launch and discover new Datasets and web-api's.</p>
</header>
<section class="top-products">
<h2>Top Products Launching Today</h2>
<p>For the first 4 hours of the day, we're hiding upvotes to help every product get a chance to catch your interest.</p>
<div class="product-list">
<div class="product">
<div class="product-info">
<div class="icon standup"></div>
<div class="details">
<h3>Standup</h3>
<p>Simply daily accountability phone call, powered by AI</p>
<div class="tags">
<span>Q 2</span>
<span>Productivity</span>
</div>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<button>⬇</button>
</div>
</div>
<div class="product">
<div class="product-info">
<div class="icon tori"></div>
<div class="details">
<h3>Tori</h3>
<p>The simple mobile crypto wallet even your mom can use</p>
<div class="tags">
<span>Q 1</span>
<span>Fintech</span>
<span>Crypto</span>
<span>Cryptocurrency</span>
</div>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<button>⬇</button>
</div>
</div>
<div class="product">
<div class="product-info">
<div class="icon tyms"></div>
<div class="details">
<h3>Tyms</h3>
<p>Modern accounting ERP for ambitious businesses</p>
<div class="tags">
<span>Q 2</span>
<span>Android</span>
<span>Artificial Intelligence</span>
<span>Accounting</span>
</div>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<button>⬇</button>
</div>
</div>
<div class="product">
<div class="product-info">
<div class="icon zapcardz"></div>
<div class="details">
<h3>ZapCardz</h3>
<p>Remember what you learn forever with AI powered flashcards</p>
<div class="tags">
<span>Q 6</span>
<span>Solo maker</span>
<span>Bootstrapped</span>
<span>Productivity</span>
</div>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<button>⬇</button>
</div>
</div>
<div class="product">
<div class="product-info">
<div class="icon peek"></div>
<div class="details">
<h3>Peek</h3>
<p>AI organizer and workspace for your browser tabs</p>
<div class="tags">
<span>Q 15</span>
<span>Solo maker</span>
<span>Bootstrapped</span>
<span>Productivity</span>
</div>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<button>⬇</button>
</div>
</div>
</div>
</section>
</div>
</body>
</html>

123
html/chat1/styles.css Normal file
View File

@ -0,0 +1,123 @@
body {
background-color: #1c1c1c;
color: #e1e1e1;
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
header {
text-align: center;
margin-bottom: 20px;
}
header h1 {
font-size: 24px;
margin: 0;
}
header p {
font-size: 14px;
}
header a {
color: #4a90e2;
}
.top-products h2 {
font-size: 20px;
margin-bottom: 10px;
}
.top-products p {
font-size: 14px;
margin-bottom: 20px;
}
.top-products a {
color: #4a90e2;
}
.product-list {
display: flex;
flex-direction: column;
gap: 10px;
}
.product {
display: flex;
justify-content: space-between;
background-color: #333;
padding: 10px;
border-radius: 5px;
}
.product-info {
display: flex;
gap: 10px;
}
.icon {
width: 40px;
height: 40px;
background-color: #555;
border-radius: 5px;
}
.standup { background-image: url('standup.png'); }
.tori { background-image: url('tori.png'); }
.tyms { background-image: url('tyms.png'); }
.zapcardz { background-image: url('zapcardz.png'); }
.peek { background-image: url('peek.png'); }
.details {
display: flex;
flex-direction: column;
}
.details h3 {
font-size: 16px;
margin: 0;
}
.details p {
font-size: 14px;
margin: 5px 0;
}
.tags {
display: flex;
gap: 5px;
font-size: 12px;
}
.tags span {
background-color: #4a90e2;
padding: 2px 5px;
border-radius: 3px;
}
.upvote {
display: flex;
flex-direction: column;
justify-content: center;
gap: 5px;
}
.upvote button {
background: none;
border: none;
color: #4a90e2;
font-size: 20px;
cursor: pointer;
}
.upvote button:hover {
color: #ff9900;
}

92
html/chat2/index.html Normal file
View File

@ -0,0 +1,92 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DataDash</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<main>
<header>
<h1>Welcome to DataDash 👋</h1>
<p>The place to launch and discover Datasets and api-endpoints.</p>
</header>
<section class="top-products">
<h2>Launching Today</h2>
<ul class="product-list">
<li class="product">
<div class="product-info">
<div class="icon standup"></div>
<div class="details">
<h3>Standup</h3>
<p>Simply daily accountability phone call, powered by AI</p>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</div>
</li>
<li class="product">
<div class="product-info">
<div class="icon tori"></div>
<div class="details">
<h3>Tori</h3>
<p>The simple mobile crypto wallet even your mom can use</p>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</div>
</li>
<li class="product">
<div class="product-info">
<div class="icon tyms"></div>
<div class="details">
<h3>Tyms</h3>
<p>Modern accounting ERP for ambitious businesses</p>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</div>
</li>
<li class="product">
<div class="product-info">
<div class="icon zapcardz"></div>
<div class="details">
<h3>ZapCardz</h3>
<p>Remember what you learn forever with AI powered flashcards</p>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</div>
</li>
<li class="product">
<div class="product-info">
<div class="icon peek"></div>
<div class="details">
<h3>Peek</h3>
<p>AI organizer and workspace for your browser tabs</p>
</div>
</div>
<div class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</div>
</li>
</ul>
</section>
</main>
</body>
</html>

129
html/chat2/styles.css Normal file
View File

@ -0,0 +1,129 @@
body {
background-color: #1c1c1c;
color: #e1e1e1;
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
main {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
header {
text-align: center;
margin-bottom: 20px;
}
header h1 {
font-size: 24px;
margin: 0;
}
header p {
font-size: 14px;
}
header a {
color: #4a90e2;
}
.top-products h2 {
font-size: 20px;
margin-bottom: 10px;
}
.top-products p {
font-size: 14px;
margin-bottom: 20px;
}
.top-products a {
color: #4a90e2;
}
.product-list {
list-style-type: none;
padding: 0;
}
.product {
display: flex;
justify-content: space-between;
background-color: #333;
padding: 10px;
border-radius: 5px;
margin-bottom: 10px;
}
.product-info {
display: flex;
gap: 10px;
}
.icon {
width: 40px;
height: 40px;
background-color: #555;
border-radius: 5px;
}
.standup { background-image: url('standup.png'); }
.tori { background-image: url('tori.png'); }
.tyms { background-image: url('tyms.png'); }
.zapcardz { background-image: url('zapcardz.png'); }
.peek { background-image: url('peek.png'); }
.details {
display: flex;
flex-direction: column;
}
.details h3 {
font-size: 16px;
margin: 0;
}
.details p {
font-size: 14px;
margin: 5px 0;
}
.tags {
display: flex;
gap: 5px;
font-size: 12px;
}
.tags span {
background-color: #4a90e2;
padding: 2px 5px;
border-radius: 3px;
}
.upvote {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 5px;
}
.upvote button {
background: none;
border: none;
color: #4a90e2;
font-size: 20px;
cursor: pointer;
}
.upvote button:hover {
color: #ff9900;
}
.upvote-count {
font-size: 16px;
color: #e1e1e1;
}

112
html/index.html Normal file
View File

@ -0,0 +1,112 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DataDash</title>
<link rel="stylesheet" href="main.css">
</head>
<body>
<main>
<header>
<h1>Welcome to DataDash</h1>
<p>The place to launch and discover datasets and API endpoints.</p>
</header>
<section id="recents">
<h2>Recently added:</h2>
<ul class="datasets">
<li>
<div class="product-info">
<div class="icon standup"></div>
<div class="details">
<h3>Standup</h3>
<p>Simply daily accountability phone call, powered by AI</p>
</div>
</div>
<aside class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</aside>
</li>
<li class="product">
<div class="product-info">
<div class="icon tori"></div>
<div class="details">
<h3>Tori</h3>
<p>The simple mobile crypto wallet even your mom can use</p>
</div>
</div>
<aside class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</aside>
</li>
<li class="product">
<div class="product-info">
<div class="icon tyms"></div>
<div class="details">
<h3>Tyms</h3>
<p>Modern accounting ERP for ambitious businesses</p>
</div>
</div>
<aside class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</aside>
</li>
<li class="product">
<div class="product-info">
<div class="icon zapcardz"></div>
<div class="details">
<h3>ZapCardz</h3>
<p>Remember what you learn forever with AI powered flashcards</p>
</div>
</div>
<aside class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</aside>
</li>
<li class="product">
<div class="product-info">
<div class="icon peek"></div>
<div class="details">
<h3>Peek</h3>
<p>AI organizer and workspace for your browser tabs</p>
</div>
</div>
<aside class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</aside>
</li>
</ul>
</section>
<section id="Top">
<h2>Most Liked:</h2>
<ul class="datasets">
<li class="product">
<div class="product-info">
<div class="icon standup"></div>
<div class="details">
<h3>Standup</h3>
<p>Simply daily accountability phone call, powered by AI</p>
</div>
</div>
<aside class="upvote">
<button>⬆</button>
<span class="upvote-count">8</span>
<button>⬇</button>
</aside>
</li>
</ul>
</main>
</body>
</html>

70
html/main.css Normal file
View File

@ -0,0 +1,70 @@
:root {
--bg-color: #222;
--fg-color: #555;
--text-color: #dbdbdb;
font-size: 12pt;
}
body {
background-color: var(--bg-color, black);
color: var(--text-color, white);
}
main {
max-width: 120ch;
padding-inline: 2rem;
margin-inline: auto;
}
header {
text-align: center;
margin-inline: .75rem;
}
.datasets {
padding-inline: 1rem;
display: grid;
grid-template-columns: repeat(auto-fit, 1fr);
grid-auto-columns: 1fr;
gap: 1rem;
}
.datasets > li {
min-width: 60ch;
background-color: var(--fg-color, darkgrey);
border-radius: 1rem;
list-style: none;
padding: 1rem 2rem;
}
.datasets > li :is(h3, p) {
width: fit-content;
}
/*
.upvote {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 5px;
}
.upvote button {
background: none;
border: none;
color: #4a90e2;
font-size: 20px;
cursor: pointer;
}
.upvote button:hover {
color: #ff9900;
}
.upvote-count {
font-size: 16px;
color: #e1e1e1;
}
*/