fix: fix fonts (mckaywrigley#194)

* fix: hotfix fonts * chore: set normal line height
kriskumar · Mar 26, 2023 · c0b1b2e · c0b1b2e
1 parent ff13a3e
commit c0b1b2e
Show file tree

Hide file tree

Showing 6 changed files with 7 additions and 10 deletions.
diff --git a/components/Sidebar/Conversation.tsx b/components/Sidebar/Conversation.tsx
@@ -64,7 +64,7 @@ export const ConversationComponent: FC<Props> = ({
 
   return (
     <button
-      className={`flex w-full cursor-pointer items-center gap-3 rounded-lg p-3 text-sidebar transition-colors duration-200 hover:bg-[#343541]/90 ${
+      className={`flex w-full cursor-pointer items-center gap-3 rounded-lg p-3 text-[12px] leading-normal transition-colors duration-200 hover:bg-[#343541]/90 ${
         loading ? 'disabled:cursor-not-allowed' : ''
       } ${
         selectedConversation.id === conversation.id ? 'bg-[#343541]/90' : ''

diff --git a/components/Sidebar/Folder.tsx b/components/Sidebar/Folder.tsx
@@ -100,7 +100,7 @@ export const Folder: FC<Props> = ({
   return (
     <div>
       <div
-        className={`mb-1 flex cursor-pointer items-center gap-3 rounded-lg px-3 py-2 text-sidebar transition-colors duration-200 hover:bg-[#343541]/90`}
+        className={`mb-1 flex cursor-pointer items-center gap-3 rounded-lg px-3 py-2 text-[12px] leading-normal transition-colors duration-200 hover:bg-[#343541]/90`}
         onClick={() => setIsOpen(!isOpen)}
         onDrop={(e) => handleDrop(e, currentFolder)}
         onDragOver={allowDrop}

diff --git a/components/Sidebar/Search.tsx b/components/Sidebar/Search.tsx
@@ -21,7 +21,7 @@ export const Search: FC<Props> = ({ searchTerm, onSearch }) => {
   return (
     <div className="relative flex items-center">
       <input
-        className="w-full flex-1 rounded-md border border-neutral-600 bg-[#202123] px-4 py-3 pr-10 text-sidebar text-white"
+        className="w-full flex-1 rounded-md border border-neutral-600 bg-[#202123] px-4 py-3 pr-10 text-[12px] leading-normal text-white"
         type="text"
         placeholder={t('Search conversations...') || ''}
         value={searchTerm}

diff --git a/components/Sidebar/Sidebar.tsx b/components/Sidebar/Sidebar.tsx
@@ -122,7 +122,7 @@ export const Sidebar: FC<Props> = ({
     >
       <header className="flex items-center">
         <button
-          className="flex w-[190px] flex-shrink-0 cursor-pointer items-center gap-3 rounded-md border border-white/20 p-3 text-sidebar text-white transition-colors duration-200 select-none hover:bg-gray-500/10"
+          className="flex w-[190px] flex-shrink-0 cursor-pointer items-center gap-3 rounded-md border border-white/20 p-3 text-[12px] leading-normal text-white transition-colors duration-200 select-none hover:bg-gray-500/10"
           onClick={() => {
             onNewConversation();
             setSearchTerm('');
@@ -133,7 +133,7 @@ export const Sidebar: FC<Props> = ({
         </button>
 
         <button
-          className="ml-2 flex flex-shrink-0 cursor-pointer items-center gap-3 rounded-md border border-white/20 p-3 text-sidebar text-white transition-colors duration-200 hover:bg-gray-500/10"
+          className="ml-2 flex flex-shrink-0 cursor-pointer items-center gap-3 rounded-md border border-white/20 p-3 text-[12px] leading-normal text-white transition-colors duration-200 hover:bg-gray-500/10"
           onClick={() => onCreateFolder(t('New folder'))}
         >
           <IconFolderPlus size={18} />
@@ -194,7 +194,7 @@ export const Sidebar: FC<Props> = ({
         ) : (
           <div className="mt-8 text-white text-center opacity-50 select-none">
             <IconMessagesOff className='mx-auto mb-3'/>
-            <span className='text-sidebar'>{t('No conversations.')}</span>
+            <span className='text-[12px] leading-normal'>{t('No conversations.')}</span>
           </div>
         )}
       </div>

diff --git a/components/Sidebar/SidebarButton.tsx b/components/Sidebar/SidebarButton.tsx
@@ -9,7 +9,7 @@ interface Props {
 export const SidebarButton: FC<Props> = ({ text, icon, onClick }) => {
   return (
     <button
-      className="flex w-full cursor-pointer items-center gap-3 rounded-md py-3 px-3 text-white text-sidebar transition-colors duration-200 hover:bg-gray-500/10 select-none"
+      className="flex w-full cursor-pointer items-center gap-3 rounded-md py-3 px-3 text-white text-[12px] leading-normal transition-colors duration-200 hover:bg-gray-500/10 select-none"
       onClick={onClick}
     >
       <div>{icon}</div>

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -7,9 +7,6 @@ module.exports = {
   ],
   darkMode: 'class',
   theme: {
-    fontSize: {
-      sidebar: ['13px', '18px']
-    },
     extend: {},
   },
   plugins: [require('@tailwindcss/typography')],