diff --git a/apps/frontend/src/app/auth/layout.tsx b/apps/frontend/src/app/auth/layout.tsx
index affad792..b823afca 100644
--- a/apps/frontend/src/app/auth/layout.tsx
+++ b/apps/frontend/src/app/auth/layout.tsx
@@ -20,7 +20,7 @@ export default async function AuthLayout({
-
+
{isGeneral() ? (
-
+
) : (
Gitroom
)}
-
>
diff --git a/apps/frontend/src/app/colors.scss b/apps/frontend/src/app/colors.scss
new file mode 100644
index 00000000..0a3cf3ca
--- /dev/null
+++ b/apps/frontend/src/app/colors.scss
@@ -0,0 +1,138 @@
+:root {
+ .dark {
+ --color-primary: #000000;
+ --color-secondary: #090b13;
+ --color-text: #ffffff;
+ --color-third: #080b13;
+ --color-forth: #612ad5;
+ --color-fifth: #28344f;
+ --color-sixth: #0b101b;
+ --color-seventh: #7236f1;
+ --color-gray: #8c8c8c;
+ --color-input: #131b2c;
+ --color-input-text: #64748b;
+ --color-table-border: #1f2941;
+ --color-custom1: #324264;
+ --color-custom2: #141c2c;
+ --color-custom3: #0b0f1c;
+ --color-custom4: #8155dd;
+ --color-custom5: #e9e9f1;
+ --color-custom6: #172034;
+ --color-custom7: #7950f2;
+ --color-custom8: #0f1524;
+ --color-custom9: #354258;
+ --color-custom10: #e4b895;
+ --color-custom11: #8b90ff;
+ --color-custom12: #b7c1ff;
+ --color-custom13: #ffac30;
+ --color-custom14: #576a9a;
+ --color-custom15: #0a0a0a;
+ --color-custom16: #121a2d;
+ --color-custom17: #d3d3d3;
+ --color-custom18: #aaaaaa;
+ --color-custom19: #f97066;
+ --color-custom20: #121b2c;
+ --color-custom21: #506490;
+ --color-custom22: #b91c1c;
+ --color-custom23: #06080d;
+ --color-custom24: #eaff00;
+ --color-custom25: #2e3336;
+ --color-custom26: #1d9bf0;
+ --color-custom27: #71767b;
+ --color-custom28: #b69dec;
+ --color-custom29: #291259;
+ --color-custom30: #5826c2;
+ --color-custom31: #0f1727;
+ --color-custom32: #181818;
+ --color-custom33: #f2f2f2;
+ --color-custom34: #334155;
+ --color-custom35: #242424;
+ --color-custom36: #6b6b6b;
+ --color-custom37: #0b1416;
+ --color-custom38: #d9d9d9;
+ --color-custom39: #ffffff;
+ --color-custom40: #0e0e0e;
+ --color-custom41: #cebdf2;
+ --color-custom42: #32d583;
+ --color-custom43: #425379;
+ --color-custom44: #283450;
+ --color-custom45: #832ad5;
+ --color-custom46: #658dac;
+ --color-custom47: #182034;
+ --color-custom48: #080b14;
+ --color-custom49: #0a0b14;
+ --color-custom50: #262373;
+ --color-custom51: #4f46e5;
+ --color-custom52: #eaeef2;
+ --color-custom53: #7c7d86;
+ --color-custom54: #afb8c1;
+ }
+ .light {
+ --color-primary: #fff;
+ --color-secondary: #fff;
+ --color-text: #000;
+ --color-third: white;
+ --color-forth: #612ad5;
+ --color-fifth: #efefef;
+ --color-sixth: #fff;
+ --color-seventh: #7236f1;
+ --color-gray: #8c8c8c;
+ --color-input: #f8f8f8;
+ --color-input-text: #64748b;
+ --color-table-border: #efefef;
+ --color-custom1: #324264;
+ --color-custom2: #f8f8f8;
+ --color-custom3: #fff;
+ --color-custom4: #8155dd;
+ --color-custom5: #e9e9f1;
+ --color-custom6: #fff;
+ --color-custom7: #7950f2;
+ --color-custom8: #efefef;
+ --color-custom9: #354258;
+ --color-custom10: #e4b895;
+ --color-custom11: #8b90ff;
+ --color-custom12: #b7c1ff;
+ --color-custom13: #ffac30;
+ --color-custom14: #576a9a;
+ --color-custom15: #0a0a0a;
+ --color-custom16: #121a2d;
+ --color-custom17: #000;
+ --color-custom18: #000;
+ --color-custom19: #f97066;
+ --color-custom20: #F5F5F5;
+ --color-custom21: #506490;
+ --color-custom22: #b91c1c;
+ --color-custom23: #F5F5F5;
+ --color-custom24: #eaff00;
+ --color-custom25: #2e3336;
+ --color-custom26: #1d9bf0;
+ --color-custom27: #71767b;
+ --color-custom28: #b69dec;
+ --color-custom29: #291259;
+ --color-custom30: #efefef;
+ --color-custom31: #E0E0E0;
+ --color-custom32: #181818;
+ --color-custom33: #f2f2f2;
+ --color-custom34: #334155;
+ --color-custom35: #242424;
+ --color-custom36: #6b6b6b;
+ --color-custom37: #0b1416;
+ --color-custom38: #d9d9d9;
+ --color-custom39: #000;
+ --color-custom40: #fff;
+ --color-custom41: #cebdf2;
+ --color-custom42: #32d583;
+ --color-custom43: #425379;
+ --color-custom44: #283450;
+ --color-custom45: #832ad5;
+ --color-custom46: #658dac;
+ --color-custom47: #182034;
+ --color-custom48: #fff;
+ --color-custom49: #0a0b14;
+ --color-custom50: #262373;
+ --color-custom51: #4f46e5;
+ --color-custom52: #eaeef2;
+ --color-custom53: #7c7d86;
+ --color-custom54: #afb8c1;
+ }
+}
diff --git a/apps/frontend/src/app/global.css b/apps/frontend/src/app/global.scss
similarity index 83%
rename from apps/frontend/src/app/global.css
rename to apps/frontend/src/app/global.scss
index 40b6a736..64dec72f 100644
--- a/apps/frontend/src/app/global.css
+++ b/apps/frontend/src/app/global.scss
@@ -1,11 +1,12 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
+@import "./colors.scss";
@import "./polonto.css";
body,
html {
- background-color: #000;
+ @apply bg-primary;
}
.box {
position: relative;
@@ -33,11 +34,11 @@ html {
}
.showbox {
- color: black;
+ @apply text-primary;
}
.showbox:after {
+ @apply bg-textColor;
opacity: 1;
- background: white;
transition: all 0.3s ease-in-out;
}
.table1 {
@@ -46,10 +47,9 @@ html {
}
.table1 thead {
- background-color: #0f1524;
+ @apply bg-customColor8 border-b border-b-fifth;
height: 44px;
font-size: 12px;
- border-bottom: 1px solid #28344f;
}
.table1 thead th,
.table1 tbody td {
@@ -63,21 +63,24 @@ html {
}
.swal2-modal {
- background-color: black !important;
- border: 2px solid #0b101b;
+ @apply bg-primary #{!important};
+ @apply border-b-[2px] border-b-sixth;
}
.swal2-modal * {
- color: white !important;
+ @apply text-textColor #{!important};
}
.swal2-icon {
- color: white !important;
- border-color: white !important;
+ @apply text-textColor bg-primary #{!important};
}
+.swal2-cancel {
+ @apply text-white #{!important};
+}
.swal2-confirm {
- background-color: #262373 !important;
+ @apply bg-customColor50 #{!important};
+ @apply text-white #{!important};
}
.w-md-editor-text {
@@ -85,12 +88,11 @@ html {
}
.react-tags {
+ @apply border border-fifth bg-input;
position: relative;
- border: 1px solid #28344f;
padding-left: 16px;
height: 44px;
border-radius: 4px;
- background: #131b2c;
/* shared font styles */
font-size: 14px;
line-height: 1.2;
@@ -101,12 +103,12 @@ html {
}
.react-tags.is-active {
- border-color: #4f46e5;
+ @apply border-customColor51;
}
.react-tags.is-disabled {
opacity: 0.75;
- background-color: #eaeef2;
+ @apply bg-customColor52;
/* Prevent any clicking on the component */
pointer-events: none;
cursor: not-allowed;
@@ -142,15 +144,14 @@ html {
padding: 0.15rem 0.5rem;
border: 0;
border-radius: 3px;
- background: #7236f1;
+ @apply bg-seventh;
/* match the font styles */
font-size: inherit;
line-height: inherit;
}
.react-tags__tag:hover {
- color: #ffffff;
- background-color: #4f46e5;
+ @apply text-textColor bg-customColor51;
}
.react-tags__tag::after {
@@ -174,11 +175,11 @@ html {
);
margin-left: 0.5rem;
font-size: 0.875rem;
- background-color: #7c7d86;
+ @apply bg-customColor53;
}
.react-tags__tag:hover::after {
- background-color: #ffffff;
+ @apply bg-primary;
}
.react-tags__combobox {
@@ -203,7 +204,7 @@ html {
}
.react-tags__combobox-input::placeholder {
- color: #7c7d86;
+ @apply text-customColor53;
opacity: 1;
}
@@ -216,8 +217,7 @@ html {
right: -2px;
max-height: 12.5rem;
overflow-y: auto;
- background: #131b2c;
- border: 1px solid #afb8c1;
+ @apply bg-input border border-customColor54;
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.1) 0 10px 15px -4px,
rgba(0, 0, 0, 0.05) 0 4px 6px -2px;
@@ -229,16 +229,15 @@ html {
.react-tags__listbox-option:hover {
cursor: pointer;
- background: #080b13;
+ @apply bg-third;
}
.react-tags__listbox-option:not([aria-disabled='true']).is-active {
- background: #4f46e5;
- color: #ffffff;
+ @apply text-textColor bg-customColor51;
}
.react-tags__listbox-option[aria-disabled='true'] {
- color: #7c7d86;
+ @apply text-customColor53;
cursor: not-allowed;
pointer-events: none;
}
@@ -249,7 +248,7 @@ html {
}
.react-tags__listbox-option[aria-selected='true']:not(.is-active)::after {
- color: #4f46e5;
+ @apply text-customColor51;
}
.react-tags__listbox-option-highlight {
@@ -260,7 +259,7 @@ html {
/* display: none;*/
/*}*/
.w-md-editor {
- background-color: #131b2c !important;
+ @apply bg-input #{!important};
border: 0 !important;
box-shadow: none !important;
border-radius: 8px !important;
@@ -269,11 +268,10 @@ html {
}
.w-md-editor-toolbar {
+ @apply bg-input border-fifth #{!important};
height: 40px !important;
min-height: 40px !important;
- background-color: #131b2c !important;
padding: 0 8px !important;
- border-color: #28344f !important;
}
.wmde-markdown {
@@ -286,7 +284,7 @@ html {
}
.editor * {
- color: white;
+ @apply text-textColor;
}
.editor .polonto * {
@@ -317,7 +315,7 @@ html {
}
.copilotKitWindow {
- background-color: #0b0f1c !important;
+ @apply bg-customColor3 #{!important};
}
.copilotKitButtonIconOpen svg {
@@ -325,12 +323,12 @@ html {
}
.copilotKitButtonIconOpen:after {
+ @apply text-textColor;
content: '';
display: block;
position: relative;
z-index: 1;
object-fit: contain;
- color: white;
background: url('/magic.svg') no-repeat center center / contain;
width: 30px;
height: 30px;
@@ -346,7 +344,8 @@ html {
}
.uppy-FileInput-container {
- @apply cursor-pointer font-[500] flex justify-center items-center gap-[4px] text-[12px] rounded-[4px] w-[107px] h-[25px] bg-[#0b0f1c] text-white border-[2px] border-[#506490];
+ @apply cursor-pointer font-[500] flex justify-center items-center gap-[4px] text-[12px] rounded-[4px] w-[107px] h-[25px] text-textColor border-[2px];
+ @apply bg-customColor3 border-customColor21;
}
.uppy-ProgressBar {
@@ -355,7 +354,7 @@ html {
}
.uppy-ProgressBar-inner {
- background-color: #4f46e5;
+ @apply bg-customColor51;
height: 25px;
border-radius: 4px;
}
@@ -376,7 +375,7 @@ html {
@apply animate-normalFadeOut;
}
-.fill-text-white {
+.fill-text-textColor {
-webkit-text-fill-color: white !important;
}
div div .set-font-family {
diff --git a/apps/frontend/src/app/layout.tsx b/apps/frontend/src/app/layout.tsx
index 09161dcd..6a77d17e 100644
--- a/apps/frontend/src/app/layout.tsx
+++ b/apps/frontend/src/app/layout.tsx
@@ -1,7 +1,7 @@
import interClass from '@gitroom/react/helpers/inter.font';
export const dynamic = 'force-dynamic';
-import './global.css';
+import './global.scss';
import 'react-tooltip/dist/react-tooltip.css';
import '@copilotkit/react-ui/styles.css';
@@ -10,6 +10,7 @@ import { ReactNode } from 'react';
import { Chakra_Petch } from 'next/font/google';
import { isGeneral } from '@gitroom/react/helpers/is.general';
import PlausibleProvider from 'next-plausible';
+import clsx from 'clsx';
const chakra = Chakra_Petch({ weight: '400', subsets: ['latin'] });
@@ -23,7 +24,7 @@ export default async function AppLayout({ children }: { children: ReactNode }) {
sizes="any"
/>
-
+
{children}
diff --git a/apps/frontend/src/components/analytics/analytics.component.tsx b/apps/frontend/src/components/analytics/analytics.component.tsx
index 02ec4061..932bd4ac 100644
--- a/apps/frontend/src/components/analytics/analytics.component.tsx
+++ b/apps/frontend/src/components/analytics/analytics.component.tsx
@@ -49,12 +49,12 @@ export const AnalyticsComponent: FC = () => {
{/*

*/}
{/*
*/}
{/*
*/}
- {/*
Nevo David
*/}
+ {/*
Nevo David
*/}
{/*
05/06/2024
*/}
{/*
*/}
{/*
O atual sistema político precisa mudar para valorizar o trabalho e garantir igualdade de oportunidad
*/}
{/*
*/}
- {/*
See Tweet
*/}
+ {/*
See Tweet
*/}
{/*
*/}
{/*
*/}
{/*
*/}
@@ -63,12 +63,12 @@ export const AnalyticsComponent: FC = () => {
{/*

*/}
{/*
*/}
{/*
*/}
- {/*
Nevo David
*/}
+ {/*
Nevo David
*/}
{/*
05/06/2024
*/}
{/*
*/}
{/*
O atual sistema político precisa mudar para valorizar o trabalho e garantir igualdade de oportunidad
*/}
{/*
*/}
- {/*
See Tweet
*/}
+ {/*
See Tweet
*/}
{/*
*/}
{/*
*/}
{/*
*/}
@@ -77,12 +77,12 @@ export const AnalyticsComponent: FC = () => {
{/*

*/}
{/*
*/}
{/*
*/}
- {/*
Nevo David
*/}
+ {/*
Nevo David
*/}
{/*
05/06/2024
*/}
{/*
*/}
{/*
O atual sistema político precisa mudar para valorizar o trabalho e garantir igualdade de oportunidad
*/}
{/*
*/}
- {/*
See Tweet
*/}
+ {/*
See Tweet
*/}
{/*
*/}
{/*
*/}
{/*
*/}
@@ -91,12 +91,12 @@ export const AnalyticsComponent: FC = () => {
{/*

*/}
{/*
*/}
{/*
*/}
- {/*
Nevo David
*/}
+ {/*
Nevo David
*/}
{/*
05/06/2024
*/}
{/*
*/}
{/*
O atual sistema político precisa mudar para valorizar o trabalho e garantir igualdade de oportunidad
*/}
{/*
*/}
- {/*
See Tweet
*/}
+ {/*
See Tweet
*/}
{/*
*/}
{/*
*/}
{/*
*/}
@@ -105,12 +105,12 @@ export const AnalyticsComponent: FC = () => {
{/*

*/}
{/*
*/}
{/*
*/}
- {/*
Nevo David
*/}
+ {/*
Nevo David
*/}
{/*
05/06/2024
*/}
{/*
*/}
{/*
O atual sistema político precisa mudar para valorizar o trabalho e garantir igualdade de oportunidad
*/}
{/*
*/}
- {/*
See Tweet
*/}
+ {/*
See Tweet
*/}
{/*
*/}
{/*
*/}
{/*
*/}
diff --git a/apps/frontend/src/components/analytics/stars.and.forks.tsx b/apps/frontend/src/components/analytics/stars.and.forks.tsx
index 6e661408..71df9211 100644
--- a/apps/frontend/src/components/analytics/stars.and.forks.tsx
+++ b/apps/frontend/src/components/analytics/stars.and.forks.tsx
@@ -140,7 +140,7 @@ export const StarsAndForks: FC
= (props) => {