Ryan/Reactive-Resume
1
0
Fork 0
mirror of https://github.com/AmruthPillai/Reactive-Resume.git synced 2025-11-14 00:32:35 +10:00
Code Issues Packages Projects Releases Wiki Activity

fix max width of description

Browse Source
This commit is contained in:
Amruth Pillai
2022-11-18 09:42:59 +01:00
parent c4b4e6013f
commit f9ef4d0a64
4 changed files with 28 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
client/components/build/Center/Center.module.scss
View File

@ -5,7 +5,7 @@
} }
.wrapper { .wrapper {
@apply h-full w-full #{!important}; @apply h-full w-full overflow-visible #{!important};
} }
.artboard { .artboard {

2
client/styles/globals.scss
View File

@ -30,7 +30,7 @@
} }
.markdown { .markdown {
@apply prose prose-sm leading-normal prose-ul:p-0 prose-ul:my-0 prose-p:my-0; @apply prose prose-sm leading-normal max-w-none prose-ul:p-0 prose-ul:my-0 prose-p:my-0;
ul li { ul li {
@apply ml-4 list-outside; @apply ml-4 list-outside;

40
client/utils/styles.ts
View File

@ -4,10 +4,10 @@ import { RgbColor } from 'react-colorful';
import { hexColorPattern } from '@/config/colors'; import { hexColorPattern } from '@/config/colors';
export const generateTypographyStyles = ({ family, size }: Typography): string => ` export const generateTypographyStyles = ({ family, size }: Typography): string => `
font-size: ${size.body}px; font-size: ${size.body}px !important;
font-family: ${family.body}; font-family: ${family.body} !important;
svg { font-size: ${size.body}px; } svg { font-size: ${size.body}px !important; }
h1, h1,
h2, h2,
@ -15,25 +15,35 @@ export const generateTypographyStyles = ({ family, size }: Typography): string =
h4, h4,
h5, h5,
h6 { h6 {
font-weight: bold; font-weight: bold !important;
font-family: ${family.heading}; font-family: ${family.heading} !important;
} }
h1 { font-size: ${size.heading}px; line-height: ${size.heading}px; } h1 { font-size: ${size.heading}px !important; line-height: ${size.heading}px !important; }
h2 { font-size: ${size.heading / 1.5}px; line-height: ${size.heading / 1.5}px; } h2 { font-size: ${size.heading / 1.5}px !important; line-height: ${size.heading / 1.5}px !important; }
h3 { font-size: ${size.heading / 2}px; line-height: ${size.heading / 2}px; } h3 { font-size: ${size.heading / 2}px !important; line-height: ${size.heading / 2}px !important; }
h4 { font-size: ${size.heading / 2.5}px; line-height: ${size.heading / 2.5}px; } h4 { font-size: ${size.heading / 2.5}px !important; line-height: ${size.heading / 2.5}px !important; }
h5 { font-size: ${size.heading / 3}px; line-height: ${size.heading / 3}px; } h5 { font-size: ${size.heading / 3}px !important; line-height: ${size.heading / 3}px !important; }
h6 { font-size: ${size.heading / 3.5}px; line-height: ${size.heading / 3.5}px; } h6 { font-size: ${size.heading / 3.5}px !important; line-height: ${size.heading / 3.5}px !important; }
.markdown p,
.markdown li {
font-size: ${size.body}px !important;
}
`; `;
export const generateThemeStyles = ({ text, background, primary }: ThemeConfig): string => ` export const generateThemeStyles = ({ text, background, primary }: ThemeConfig): string => `
color: ${text}; color: ${text} !important;
background-color: ${background}; background-color: ${background} !important;
--primary-color: ${primary}; --primary-color: ${primary} !important;
svg { svg {
color: var(--primary-color); color: var(--primary-color) !important;
}
.markdown p,
.markdown li {
color: ${text} !important;
} }
`; `;

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "reactive-resume", "name": "reactive-resume",
"version": "3.6.9", "version": "3.6.10",
"private": true, "private": true,
"scripts": { "scripts": {
"dev": "env-cmd --silent turbo run dev", "dev": "env-cmd --silent turbo run dev",