AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

change bg

Browse Source
This commit is contained in:
MuslemRahimi 2024-08-07 22:53:33 +02:00
parent e45aeced69
commit de2944775f
4 changed files with 27 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/lib/components/TextEditor.svelte
View File

@ -242,7 +242,7 @@ function handleImageInput(event) {
<div class="p-2 w-full max-w-xl mr-auto overflow-y-scroll {commentId?.length !== 0 ? '-ml-2' : ''}">
<textarea
on:click={() => expandField = true}
class="rounded-lg text-sm {expandField ? 'min-h-24 h-auto border-[#1C4090]' : 'h-12 border-gray-500'} overflow-hidden sm:hover:border-[#1C4090] sm:hover:ring-1 transition sm:ease-out placeholder-gray-500 w-full bg-[#09090B] text-white border border-1 ring-2 sm:ring-0 ring-[#1C4090]"
class="rounded-lg text-sm {expandField ? 'min-h-24 h-auto border-[#1C4090]' : 'h-12 border-gray-500'} overflow-hidden sm:hover:border-[#1C4090] sm:hover:ring-1 transition sm:ease-out placeholder-gray-300 w-full bg-[#27272A] text-white border border-1 ring-2 sm:ring-0 ring-[#1C4090]"
placeholder={placeholder}
value={inputValue}
bind:this={ref}
@ -272,11 +272,11 @@ function handleImageInput(event) {
Cancel
</label>
{#if isLoaded}
<label on:click={handleComment} class="inline-flex justify-end items-center bg-purple-600 {inputValue.length !== 0 ? 'opacity-100 cursor-pointer' : 'opacity-60'} py-2.5 px-4 text-xs font-medium text-center text-white rounded-lg focus:ring-purple-300">
<label on:click={handleComment} class="inline-flex justify-end items-center bg-purple-600 sm:hover:bg-purple-700 duration-100 transition {inputValue.length !== 0 ? 'opacity-100 cursor-pointer' : 'opacity-60'} py-2.5 px-4 text-xs font-medium text-center text-white rounded-lg focus:ring-purple-300">
Post
</label>
{:else}
<label class="inline-flex justify-end items-center bg-purple-600 opacity-60 py-2.5 px-4 text-xs font-medium text-center text-white rounded-lg focus:ring-purple-300">
<label class="cursor-not-allowed inline-flex justify-end items-center bg-purple-600 bg-opacity-40 py-2.5 px-4 text-xs font-medium text-center text-white rounded-lg focus:ring-purple-300">
Post
</label>
{/if}

12
src/routes/community/+page.svelte
View File

@ -452,7 +452,7 @@ $: {
<!-- List container -->
<div class="flex flex-col mt-4">
<!-- Item -->
<div class="border-t border-b sm:border border-gray-700 sm:hover:border-gray-600 rounded-none sm:rounded-md bg-[#09090B] rounded-[4px] sm:rounded-[8px]">
<div class="border-t border-b sm:border border-gray-700 sm:hover:border-gray-600 rounded-none sm:rounded-md bg-[#141417] rounded-[4px] sm:rounded-[8px]">
<div class="flex h-14 justify-start items-center">
<div class="flex flex-row ml-3">
<label on:click={() => handleCategoryOfPosts('hot')} class="flex flex-row w-fit pl-3 pr-4 pt-1 pb-1 tab mr-2 font-medium transition duration-150 ease-out hover:ease-in rounded-full hover:bg-[#323232] {sortingPosts === 'hot' ? 'bg-[#323232] text-white' : 'text-gray-300'} rounded-full cursor-pointer">
@ -532,9 +532,9 @@ $: {
<!--Start About Community -->
<div class="space-y-3 mb-5">
<div class="rounded-t-lg bg-[#09090B] border border-gray-800 h-auto sm:w-96">
<div class="rounded-t-lg bg-[#141417] border border-gray-800 h-auto sm:w-96">
<!--Start Header-->
<div class="bg-[#09090B] w-full p-3 rounded-t-lg">
<div class="bg-[#141417] w-full p-3 rounded-t-lg">
<span class="text-white text-xl ml-1 font-semibold">
About Community
</span>
@ -595,7 +595,7 @@ $: {
<!--Start Discord -->
{#if discordData?.length !== 0}
<div class="space-y-3 mb-5">
<div class="bg-[#09090B] border border-gray-800 h-auto sm:w-96 rounded-lg">
<div class="bg-[#141417] border border-gray-800 h-auto sm:w-96 rounded-lg">
<!--Start Image-->
<div class="flex flex-row items-center w-full p-3">
@ -741,9 +741,9 @@ $: {
<!--Community Rules-->
<div class="space-y-3 mt-5 fixed sticky" style="top: 5rem;">
<div class="bg-[#09090B] border border-gray-800 sm:w-96 rounded-lg">
<div class="bg-[#141417] border border-gray-800 sm:w-96 rounded-lg">
<!--Start Header-->
<div class="bg-[#09090B] border-b border-slate-700 w-full pl-6 pr-6 pt-6 pb-4 rounded-t-lg">
<div class="bg-[#141417] border-b border-slate-700 w-full pl-6 pr-6 pt-6 pb-4 rounded-t-lg">
<span class="text-white text-xl ml-1 font-semibold">
Community Rules
</span>

11
src/routes/community/post/[postId]/+page.svelte
View File

@ -402,7 +402,6 @@ function updateVote(postVote) {
} else {
console.log("Post not found.");
}
console.log(item)
}
function addCommentToParent(comments, newComment) {
@ -549,7 +548,7 @@ function updateVote(postVote) {
<!--<section on:click={closePost} class="bg-[#09090B] cursor-zoom-out min-h-screen">-->
<!--<section on:click={closePost} class="bg-[#141417] cursor-zoom-out min-h-screen">-->
<!--in:pageTransitionIn={{ duration: 250, screenWidth: $screenWidth }}-->
<div class="overflow-hidden flex flex-row item-start w-full lg:mt-5 relative max-w-6xl m-auto lg:px-5 sm:pb-40">
@ -604,10 +603,10 @@ function updateVote(postVote) {
<!--End Voting-->
<div class="w-full bg-[#09090B] max-w-5xl m-auto border sm:hover:border-slate-800 border-slate-800 rounded-none sm:rounded-xl ">
<div class="w-full bg-[#141417] max-w-5xl m-auto border sm:hover:border-slate-800 border-slate-800 rounded-none sm:rounded-xl ">
<!-- Start Header -->
<div style="top: 0.8rem;" class="sm:rounded-xl absolute h-12 sticky z-20 bg-[#09090B] w-full {isScrolled && $screenWidth < 640 ? 'border-b border-gray-700 ease-in' : 'ease-out'}">
<div style="top: 0.8rem;" class="sm:rounded-xl absolute h-12 sticky z-20 bg-[#141417] w-full {isScrolled && $screenWidth < 640 ? 'border-b border-gray-700 ease-in' : 'ease-out'}">
<div class="flex flex-row items-center justify-between w-full pt-3">
<a href={previousPage} class="absolute left-2 sm:left-4 sm:top-4">
<svg class="w-5 h-5 inline-block sm:mr-1 sm:-mt-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
@ -858,7 +857,7 @@ function updateVote(postVote) {
{#if !loadTextEditor}
<div class="flex justify-center items-center h-80">
<div class="relative">
<label class="bg-[#09090B] rounded-xl h-14 w-14 flex justify-center items-center absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
<label class="bg-[#141417] rounded-xl h-14 w-14 flex justify-center items-center absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
<span class="loading loading-spinner loading-md"></span>
</label>
</div>
@ -979,7 +978,7 @@ function updateVote(postVote) {
<label for="deletePostModal" class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.5]"></label>
<div class="modal-box w-full bg-[#09090B] sm:border sm:border-slate-600 overflow-hidden">
<div class="modal-box w-full bg-[#141417] sm:border sm:border-slate-600 overflow-hidden">
<h3 class="font-bold text-xl mb-5 pt-5 text-white m-auto w-3/4 text-center">
Are you sure you want to delete the post?

39
src/routes/community/profile/+page.svelte
View File

@ -7,7 +7,7 @@
import { onMount, onDestroy } from 'svelte';
import {getImageURL, addDays } from '$lib/utils';
import {userRegion, setCache, getCache, newAvatar, numberOfUnreadNotification, postIdDeleted } from '$lib/store';
import {setCache, getCache, newAvatar, numberOfUnreadNotification, postIdDeleted } from '$lib/store';
import toast from 'svelte-french-toast';
import InfiniteLoading from '$lib/components/InfiniteLoading.svelte';
@ -20,19 +20,6 @@
export let data;
export let form;
const usRegion = ['cle1','iad1','pdx1','sfo1'];
let fastifyURL;
userRegion.subscribe(value => {
if (usRegion.includes(value)) {
fastifyURL = import.meta.env.VITE_USEAST_FASTIFY_URL;
} else {
fastifyURL = import.meta.env.VITE_EU_FASTIFY_URL;
}
});
let zodErrors = [];
let moderators;
@ -352,7 +339,7 @@ const getModerators = async () => {
} else {
// make the POST request to the endpoint
const response = await fetch(fastifyURL + '/get-moderators', {
const response = await fetch(data?.fastifyURL + '/get-moderators', {
method: 'GET',
headers: {
"Content-Type": "application/json"
@ -386,7 +373,7 @@ const getUserStats = async () => {
const postData = {'userId': data?.user?.id};
// make the POST request to the endpoint
const response = await fetch(fastifyURL + '/get-user-stats', {
const response = await fetch(data?.fastifyURL + '/get-user-stats', {
method: 'POST',
headers: {
"Content-Type": "application/json"
@ -453,7 +440,7 @@ async function getPost() {
};
// Make the POST request to the endpoint
const response = await fetch(fastifyURL+'/get-post', {
const response = await fetch(data?.fastifyURL+'/get-post', {
method: 'POST',
headers: {
"Content-Type": "application/json"
@ -583,7 +570,7 @@ onDestroy(async () => {
<div class="w-full flex flex-row">
<!--Start Profile Pic-->
<div class="flex items-center justify-start mb-5 w-screen sm:w-full bg-[#09090B] h-48 sm:rounded-xl border border-gray-700 sm:hover:border-gray-600">
<div class="flex items-center justify-start mb-5 w-screen sm:w-full bg-[#141417] h-48 sm:rounded-xl border border-gray-700 sm:hover:border-gray-600">
<form
on:submit={handleAvatar}
class="ml-5"
@ -639,7 +626,7 @@ onDestroy(async () => {
<!--Start User Profile -->
<div class="space-y-6 ml-4">
<div class="rounded-xl bg-[#09090B] h-48 w-full border border-gray-700 font-mono">
<div class="rounded-xl bg-[#141417] h-48 w-full border border-gray-700 font-mono">
<!--Start Header-->
<div class="ml-2 w-full p-3">
<span class="text-white text-lg font-medium ml-0.5">User Profile</span>
@ -649,17 +636,17 @@ onDestroy(async () => {
<!--Start Content-->
<div class="w-full p-2">
<table class="font-semibold table table-compact bg-[#09090B] text-start flex justify-start items-center w-full px-3 m-auto">
<tbody class="bg-[#09090B]">
<table class="font-semibold table table-compact bg-[#141417] text-start flex justify-start items-center w-full px-3 m-auto">
<tbody class="bg-[#141417]">
<!-- row 1 -->
<tr class="text-gray-300">
<td class="bg-[#09090B] border-b border-[#27272A]">Karma: {data?.user?.karma}</td>
<td class="bg-[#141417] border-b border-[#27272A]">Karma: {data?.user?.karma}</td>
<td class="bg-[#27272A border-b border-[#27272A]">Posts: {userStats?.numberOfPosts}</td>
</tr>
<!-- row 2 -->
<tr class="text-gray-300">
<td class="bg-[#09090B]">Comments: {userStats?.numberOfComments}</td>
<td class="bg-[#09090B]"></td>
<td class="bg-[#141417]">Comments: {userStats?.numberOfComments}</td>
<td class="bg-[#141417]"></td>
</tr>
</tbody>
</table>
@ -668,7 +655,7 @@ onDestroy(async () => {
{#if data?.user?.tier === 'Pro'}
<!--Start Badge-->
<div class="rounded-xl bg-[#09090B] h-48 w-full border border-gray-700 mt-14">
<div class="rounded-xl bg-[#141417] h-48 w-full border border-gray-700 mt-14">
<!--Start Header-->
<div class="ml-2 w-full p-3">
<span class="text-white text-lg font-medium ml-0.5 ">Badge</span>
@ -825,7 +812,7 @@ onDestroy(async () => {
/>
-->
<div class="w-full max-w-lg pt-3">
<button type="submit" class="btn bg-purple-600 hover:bg-purple-500 text-white w-full max-w-lg normal-case">Update your data</button>
<button type="submit" class="btn bg-purple-600 sm:hover:bg-purple-700 duration-100 text-white w-full max-w-lg normal-case">Update your data</button>
</div>
</form>