ulivargas/classroomio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update styles

Browse Source
This commit is contained in:
Ibitoye Rotimi Best
2021-06-01 07:19:19 +03:00
parent ec256b1aec
commit 5f799fad5e
16 changed files with 5589 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+5437 -10
View File
File diff suppressed because it is too large Load Diff
package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{ {
"name": "unidiscuss", "name": "classroomio",
"description": "unidiscuss", "description": "classroomio",
"version": "0.0.1", "version": "0.0.1",
"scripts": { "scripts": {
"dev": "sapper dev", "dev": "sapper dev",
src/components/IconButton/index.svelte
+10 -10
View File
@@ -12,9 +12,18 @@
function handleClick() { function handleClick() {
onClick(value); onClick(value);
} }
console.log("toolTipProps", toolTipProps);
</script> </script>
<ToolTip title={toolTipProps.title} hotkeys={toolTipProps.hotkeys}>
<button
class={`root ${selected && "active"}`}
{disabled}
on:click={handleClick}
>
<slot />
</button>
</ToolTip>
<style lang="scss"> <style lang="scss">
.root { .root {
flex: 0 0 auto; flex: 0 0 auto;
@@ -41,12 +50,3 @@
} }
} }
</style> </style>
<ToolTip title={toolTipProps.title} hotkeys={toolTipProps.hotkeys}>
<button
class={`root ${selected && 'active'}`}
{disabled}
on:click={handleClick}>
<slot />
</button>
</ToolTip>
src/components/LeftNav/index.svelte
+68 -58
View File
@@ -10,13 +10,80 @@
$: navClass = ["discussion"].includes(segment) ? "hide" : ""; $: navClass = ["discussion"].includes(segment) ? "hide" : "";
</script> </script>
<nav class={navClass}>
<ul class="flex items-center flex-col justify-evenly">
<div class="logo">
<a href="/" title="Go to ClassroomIO Home" id="logo" data-hveid="8"
><img
src="/logo-192.png"
alt="ClassroomIO logo"
height="70"
width="70"
data-atf="1"
/></a
>
</div>
<li>
<a
class="block"
aria-current={segment === undefined || segment === "discussion"
? "page"
: undefined}
href="."><Forum32 class="carbon-icon" /><span>Discussion</span></a
>
</li>
<li>
<a
class="block"
aria-current={segment === "courses" ? "page" : undefined}
href="courses"
><Catalog32 class="carbon-icon" />
<span>Courses</span></a
>
</li>
<li>
<a
class="block"
aria-current={segment === "profile" ? "page" : undefined}
href="profile"
><UserAvatar32 class="carbon-icon" />
<span>Профиль</span></a
>
</li>
<li>
<a
class="flex items-center"
href="https://t.me/classroomio"
target="_blank"
>
<!-- <img
alt="File:Telegram logo.svg"
class="mr-1"
src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/dd/Telegram_alternative_logo.svg/50px-Telegram_alternative_logo.svg.png"
decoding="async"
width="25"
height="25"
srcset="https://upload.wikimedia.org/wikipedia/commons/thumb/d/dd/Telegram_alternative_logo.svg/50px-Telegram_alternative_logo.svg.png 1.5x, https://upload.wikimedia.org/wikipedia/commons/thumb/8/82/Telegram_logo.svg/1024px-Telegram_logo.svg.png 2x"
data-file-width="25"
data-file-height="25"
/> -->
<!-- <span><SendAlt32 class="carbon-icon" /> Канал</span> -->
<SendAlt32 class="carbon-icon" />
<span>Канал</span>
</a>
</li>
<!-- <li class="new-question">
<NewQuestion />
</li> -->
</ul>
</nav>
<style> <style>
nav { nav {
height: 95vh; height: 95vh;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100px; width: 100px;
padding-top: 10px;
position: sticky; position: sticky;
top: 0; top: 0;
border-right: 1px solid var(--border-color); border-right: 1px solid var(--border-color);
@@ -63,60 +130,3 @@
} }
} }
</style> </style>
<nav class={navClass}>
<ul class="flex items-center flex-col justify-evenly">
<div class="logo">
<a href="/" title="Go to univapros Home" id="logo" data-hveid="8"><img
src="/logo-192.png"
alt="Univapros logo"
height="48"
width="48"
data-atf="1" /></a>
</div>
<li>
<a
class="block"
aria-current={segment === undefined || segment === 'discussion' ? 'page' : undefined}
href="."><Forum32 class="carbon-icon" /><span>Discussion</span></a>
</li>
<li>
<a
class="block"
aria-current={segment === 'courses' ? 'page' : undefined}
href="courses"><Catalog32 class="carbon-icon" />
<span>Courses</span></a>
</li>
<li>
<a
class="block"
aria-current={segment === 'profile' ? 'page' : undefined}
href="profile"><UserAvatar32 class="carbon-icon" />
<span>Профиль</span></a>
</li>
<li>
<a
class="flex items-center"
href="https://t.me/unidiscuss"
target="_blank">
<!-- <img
alt="File:Telegram logo.svg"
class="mr-1"
src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/dd/Telegram_alternative_logo.svg/50px-Telegram_alternative_logo.svg.png"
decoding="async"
width="25"
height="25"
srcset="https://upload.wikimedia.org/wikipedia/commons/thumb/d/dd/Telegram_alternative_logo.svg/50px-Telegram_alternative_logo.svg.png 1.5x, https://upload.wikimedia.org/wikipedia/commons/thumb/8/82/Telegram_logo.svg/1024px-Telegram_logo.svg.png 2x"
data-file-width="25"
data-file-height="25"
/> -->
<!-- <span><SendAlt32 class="carbon-icon" /> Канал</span> -->
<SendAlt32 class="carbon-icon" />
<span>Канал</span>
</a>
</li>
<!-- <li class="new-question">
<NewQuestion />
</li> -->
</ul>
</nav>
src/components/Nav/index.svelte
+2 -2
View File
@@ -12,7 +12,7 @@
aria-current={segment === undefined || segment === "discussion" aria-current={segment === undefined || segment === "discussion"
? "page" ? "page"
: undefined} : undefined}
href=".">UniDiscuss</a href=".">ClassroomIO</a
> >
</li> </li>
</ul> </ul>
@@ -24,7 +24,7 @@
<li> <li>
<a <a
class="flex items-center" class="flex items-center"
href="https://t.me/unidiscuss" href="https://t.me/classroomio"
target="_blank" target="_blank"
> >
<img <img
src/routes/index.svelte
+47 -30
View File
@@ -147,6 +147,53 @@
$: discussions = getDiscussion(filterBy, allDiscussions); $: discussions = getDiscussion(filterBy, allDiscussions);
</script> </script>
<svelte:head>
<title>ClassroomIO - Help students in your university</title>
</svelte:head>
<div class="root md:w-3/4 mx-auto md:mb-20">
<PageNav
title="Talks"
addButtonHref="/ask"
addButtonLabel="Ask"
navItems={[
{
label: "Popular",
isActive: filterBy === "popular",
href: "?filter=popular",
},
{
label: "Recent",
isActive: filterBy === "recent",
href: "?filter=recent",
},
{
label: "Upvoted",
isActive: filterBy === "upvoted",
href: "?filter=upvoted",
},
]}
/>
{#each discussions as discussion}
<div class="discussion-box">
<Vote value={discussion.votes} />
<div class="discussion-topic-author">
<h4>
<a rel="prefetch" href="discussion/{discussion.id}"
>{discussion.title}</a
>
</h4>
<span>{discussion.author.name} asked 1 day ago</span>
<HashTags tags={discussion.tags} />
</div>
<Space />
<div class="flex items-center">
<AddComment20 />
<span>{discussion.comments}</span>
</div>
</div>
{/each}
</div>
<style> <style>
.root { .root {
max-width: 600px; max-width: 600px;
@@ -180,33 +227,3 @@
font-size: 12px; font-size: 12px;
} }
</style> </style>
<svelte:head>
<title>Unidiscuss - Help students in your university</title>
</svelte:head>
<div class="root md:w-3/4 mx-auto md:mb-20">
<PageNav
title="Talks"
addButtonHref="/ask"
addButtonLabel="Ask"
navItems={[{ label: 'Popular', isActive: filterBy === 'popular', href: '?filter=popular' }, { label: 'Recent', isActive: filterBy === 'recent', href: '?filter=recent' }, { label: 'Upvoted', isActive: filterBy === 'upvoted', href: '?filter=upvoted' }]} />
{#each discussions as discussion}
<div class="discussion-box">
<Vote value={discussion.votes} />
<div class="discussion-topic-author">
<h4>
<a
rel="prefetch"
href="discussion/{discussion.id}">{discussion.title}</a>
</h4>
<span>{discussion.author.name} asked 1 day ago</span>
<HashTags tags={discussion.tags} />
</div>
<Space />
<div class="flex items-center">
<AddComment20 />
<span>{discussion.comments}</span>
</div>
</div>
{/each}
</div>
src/routes/login.svelte
+20 -7
View File
@@ -1,16 +1,29 @@
<script> <script>
function onTelegramAuth(user) {
function onTelegramAuth(user) { alert(
alert('Logged in as ' + user.first_name + ' ' + user.last_name + ' (' + user.id + (user.username ? ', @' + user.username : '') + ')'); "Logged in as " +
user.first_name +
" " +
user.last_name +
" (" +
user.id +
(user.username ? ", @" + user.username : "") +
")"
);
} }
</script> </script>
<svelte:head> <svelte:head>
<title>Join Unidiscuss</title> <title>Join ClassroomIO</title>
</svelte:head> </svelte:head>
<div class="lg:w-3/5 mx-auto md:mx-10 lg:mb-20"> <div class="lg:w-3/5 mx-auto md:mx-10 lg:mb-20">
<p>Login/Sign up into Unidiscuss</p> <p>Login/Sign up into ClassroomIO</p>
<script async src="https://telegram.org/js/telegram-widget.js?14" data-telegram-login="unidiscuss_bot" data-size="large" data-auth-url="login-redirect" data-request-access="write"></script> <script
async
src="https://telegram.org/js/telegram-widget.js?14"
data-telegram-login="classroomio_bot"
data-size="large"
data-auth-url="login-redirect"
data-request-access="write"></script>
</div> </div>
static/apple-touch-icon.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 7.5 KiB

static/favicon.ico
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

static/logo-152.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.8 KiB

static/logo-16.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

static/logo-192.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.4 KiB

After

Width:  |  Height:  |  Size: 8.6 KiB

static/logo-32.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

static/logo-512.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 24 KiB

static/logo.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

static/manifest.json
+2 -7
View File
@@ -1,8 +1,8 @@
{ {
"background_color": "#ffffff", "background_color": "#ffffff",
"theme_color": "#333333", "theme_color": "#333333",
"name": "Unidiscuss", "name": "ClassroomIO",
"short_name": "Unidiscuss", "short_name": "ClassroomIO",
"display": "minimal-ui", "display": "minimal-ui",
"start_url": "/", "start_url": "/",
"icons": [ "icons": [
@@ -10,11 +10,6 @@
"src": "logo-192.png", "src": "logo-192.png",
"sizes": "192x192", "sizes": "192x192",
"type": "image/png" "type": "image/png"
},
{
"src": "logo-512.png",
"sizes": "512x512",
"type": "image/png"
} }
] ]
} }