From 7b3a7382014aecea78267191402f6d7727042576 Mon Sep 17 00:00:00 2001 From: Sujan Sundareswaran Date: Sat, 30 Nov 2024 20:55:06 +0530 Subject: [PATCH 1/3] Fix CSS variable name --- src/components/Sidebar/SidebarItem/sidebar-item.css | 4 ++-- src/components/Toast/ToastItem/ToastItem.tsx | 9 ++++++++- src/components/Typography/Heading.tsx | 5 +++++ src/scripts/generateColourClasses.js | 2 +- src/styles/theme.css | 3 ++- 5 files changed, 18 insertions(+), 5 deletions(-) diff --git a/src/components/Sidebar/SidebarItem/sidebar-item.css b/src/components/Sidebar/SidebarItem/sidebar-item.css index e8a7ec68..5dbcffc3 100644 --- a/src/components/Sidebar/SidebarItem/sidebar-item.css +++ b/src/components/Sidebar/SidebarItem/sidebar-item.css @@ -52,15 +52,15 @@ position : relative; &::after { + position : absolute; content : ""; display : block; - position : absolute; pointer-events : none; right : 6px; height : 8px; width : 8px; border-radius : 50%; - background-color : var(--sidebar-item-has-alert-bg); + background-color : var(--sidebar-item-alert-bg); } } diff --git a/src/components/Toast/ToastItem/ToastItem.tsx b/src/components/Toast/ToastItem/ToastItem.tsx index cc3a468b..b192c072 100644 --- a/src/components/Toast/ToastItem/ToastItem.tsx +++ b/src/components/Toast/ToastItem/ToastItem.tsx @@ -1,10 +1,16 @@ +// FRAMEWORK =========================================================================================================== import React, { useState, useEffect } from "react"; +// FICTOAN ============================================================================================================= import { Element } from "../../Element/Element"; -import { CommonAndHTMLProps } from "../../Element/constants"; +// STYLES ============================================================================================================== import "./toast-item.css"; +// TYPES =============================================================================================================== +import { CommonAndHTMLProps } from "../../Element/constants"; + + // prettier-ignore export interface ToastItemCustomProps { showWhen ? : boolean; @@ -16,6 +22,7 @@ export type ToastItemElementType = HTMLDivElement; export type ToastItemProps = Omit, keyof ToastItemCustomProps> & ToastItemCustomProps; +// COMPONENT /////////////////////////////////////////////////////////////////////////////////////////////////////////// export const ToastItem = React.forwardRef( ({ showWhen, children, secondsToShowFor, closeWhen, ...props }: ToastItemProps, ref: React.Ref) => { let classNames: string[] = []; diff --git a/src/components/Typography/Heading.tsx b/src/components/Typography/Heading.tsx index fdfdff9b..318fc91d 100644 --- a/src/components/Typography/Heading.tsx +++ b/src/components/Typography/Heading.tsx @@ -1,6 +1,10 @@ +// FRAMEWORK =========================================================================================================== import React from "react"; +// FICTOAN ============================================================================================================= import { Element } from "../Element"; + +// TYPES =============================================================================================================== import { CommonAndHTMLProps, WeightTypes } from "../Element/constants"; // prettier-ignore @@ -14,6 +18,7 @@ interface HeadingBaseProps { export type HeadingElementType = HTMLHeadingElement; export type HeadingProps = Omit, keyof HeadingBaseProps> & HeadingBaseProps; +// COMPONENT /////////////////////////////////////////////////////////////////////////////////////////////////////////// const Heading = React.forwardRef( ({ fontStyle = "sans-serif", weight, align, ...props }: HeadingProps, ref: React.Ref) => { let classNames = []; diff --git a/src/scripts/generateColourClasses.js b/src/scripts/generateColourClasses.js index be1930b9..0e6b0317 100644 --- a/src/scripts/generateColourClasses.js +++ b/src/scripts/generateColourClasses.js @@ -1,4 +1,4 @@ -// src/scripts/generateColourClasses.js +// Keeping this file as JS because TS was throwing errors in the build import fs from "fs"; import path from "path"; import { fileURLToPath } from "url"; diff --git a/src/styles/theme.css b/src/styles/theme.css index b8425fdb..fb2ac92a 100644 --- a/src/styles/theme.css +++ b/src/styles/theme.css @@ -504,7 +504,7 @@ --sidebar-item-text-scale : 100%; --sidebar-item-text-weight : 600; - --sidebar-item-has-alert-bg : var(--red); + --sidebar-item-alert-bg : var(--red); --sidebar-footer-height : 40px; --sidebar-footer-bg : var(--white); @@ -574,6 +574,7 @@ } /* TEXT ///////////////////////////////////////////////////////////////////// */ +/* To compute fluid font sizes based on screen size */ :root { --screen-width-min : 320; --screen-width-max : 1600; From 2f483f2d7a21530861856d27c45bc2989964f319 Mon Sep 17 00:00:00 2001 From: Sujan Sundareswaran Date: Sat, 30 Nov 2024 20:55:53 +0530 Subject: [PATCH 2/3] Fix CSS variable name --- CHANGELOG.md | 3 +++ package.json | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9517686d..601db3ba 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,9 @@ # CHANGELOG +## 1.10.2 +- Fix CSS variable mismatch for `Sidebar` + ## 1.10.1 - Tweak theme values for icons and text inside `InputField` diff --git a/package.json b/package.json index 09d50b98..1e07c093 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "fictoan-react", - "version": "1.10.2", + "version": "1.10.3", "private": false, "description": "A full-featured, designer-friendly, yet performant framework with plain-English props and focus on rapid iteration.", "repository": { From 4dec2336b72d256888e196c181c1d6259b656499 Mon Sep 17 00:00:00 2001 From: Sujan Sundareswaran Date: Sat, 30 Nov 2024 20:57:31 +0530 Subject: [PATCH 3/3] Update CHANGELOG.md --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 601db3ba..f6a0f8e1 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,7 +1,7 @@ # CHANGELOG -## 1.10.2 +## 1.10.3 - Fix CSS variable mismatch for `Sidebar` ## 1.10.1