From cedc646b2c605d01ecb4b5e36fc6c9eea650479b Mon Sep 17 00:00:00 2001 From: Sol Dubock <94075844+sjd210@users.noreply.github.com> Date: Wed, 21 May 2025 15:54:29 +0100 Subject: [PATCH 1/8] Allow for disabled list view cards --- .../list-groups/AbstractListViewItem.tsx | 2 +- .../components/pages/SubjectOverviewPage.tsx | 27 ++++++++++++++----- src/scss/phy/list-groups.scss | 16 +++++++++++ 3 files changed, 38 insertions(+), 7 deletions(-) diff --git a/src/app/components/elements/list-groups/AbstractListViewItem.tsx b/src/app/components/elements/list-groups/AbstractListViewItem.tsx index 2426e86ad0..19712e6b17 100644 --- a/src/app/components/elements/list-groups/AbstractListViewItem.tsx +++ b/src/app/components/elements/list-groups/AbstractListViewItem.tsx @@ -90,7 +90,7 @@ export const AbstractListViewItem = ({icon, title, subject, subtitle, breadcrumb fullWidth = fullWidth || below["sm"](deviceSize) || ((status || audienceViews || previewQuizUrl || quizButton) ? false : true); const cardBody =
- +
{icon && ( icon.type === "img" ? diff --git a/src/app/components/pages/SubjectOverviewPage.tsx b/src/app/components/pages/SubjectOverviewPage.tsx index cfa35d24fa..71fb8e2c48 100644 --- a/src/app/components/pages/SubjectOverviewPage.tsx +++ b/src/app/components/pages/SubjectOverviewPage.tsx @@ -5,7 +5,7 @@ import { TitleAndBreadcrumb } from "../elements/TitleAndBreadcrumb"; import { useUrlPageTheme } from "../../services/pageContext"; import { HUMAN_SUBJECTS, isDefined, LEARNING_STAGE, LearningStage, PHY_NAV_SUBJECTS, Subject } from "../../services"; import { PageContextState } from "../../../IsaacAppTypes"; -import { ListViewCards } from "../elements/list-groups/ListView"; +import { ListViewCardProps, ListViewCards } from "../elements/list-groups/ListView"; import { LandingPageFooter } from "./SubjectLandingPage"; const SubjectCards = ({context}: { context: PageContextState }) => { @@ -13,7 +13,7 @@ const SubjectCards = ({context}: { context: PageContextState }) => { const humanSubject = context?.subject && HUMAN_SUBJECTS[context.subject]; - return { }, url: `/${context.subject}/university`, stage: LEARNING_STAGE.UNIVERSITY, - } - ] - .map(({stage, ...card}) => (PHY_NAV_SUBJECTS[context.subject as Subject] as readonly LearningStage[])?.includes(stage) ? card : null) - .filter((x, i, a) => x || (i % 2 === 0 ? a[i + 1] : a[i - 1])) // remove pairs of nulls + }, + ].map(({stage, ...card}) => (PHY_NAV_SUBJECTS[context.subject as Subject] as readonly LearningStage[])?.includes(stage) ? card : null); + + if (context.subject === "biology") { + cards.push({ + item: { + title: "GCSE (COMING SOON)", + subtitle: `Our GCSE ${humanSubject} resources develop the ${humanSubject} knowledge needed at GCSE through the use of questions, concepts and books.` + }, + className: "disabled", + icon: { + type: "img" as const, + icon: `/assets/phy/icons/redesign/subject-${context.subject}.svg`, + } + }); + } //hrm + + return a ? (b ? 0 : -1) : 1) // put nulls at the end + .filter((x, i, a) => x || (i % 2 === 0 ? a[i + 1] : a[i - 1])) // remove pairs of nulls } />; }; diff --git a/src/scss/phy/list-groups.scss b/src/scss/phy/list-groups.scss index 622cb507e9..40aef7456b 100644 --- a/src/scss/phy/list-groups.scss +++ b/src/scss/phy/list-groups.scss @@ -24,6 +24,10 @@ border-radius: 0; background-color: transparent; + &.disabled { + background-color: $color-neutral-200; + } + @include media-breakpoint-down(lg) { &:not(:last-child) { border-bottom: 1px solid var(--border-light); @@ -46,6 +50,18 @@ &:nth-last-child(n+3) { border-bottom: 1px solid var(--border-light); } + &:nth-child(1) { + border-top-left-radius: inherit; + } + &:nth-child(2) { + border-top-right-radius: inherit; + } + &:nth-last-child(2) { + border-bottom-left-radius: inherit; + } + &:nth-last-child(1) { + border-bottom-right-radius: inherit; + } } } } From 6d52ec292c312ea7fdb8074204a1184f8006217e Mon Sep 17 00:00:00 2001 From: Sol Dubock <94075844+sjd210@users.noreply.github.com> Date: Wed, 21 May 2025 16:07:10 +0100 Subject: [PATCH 2/8] Add difficulty icon symbols to subject overviews --- .../elements/svg/DifficultyIcons.tsx | 34 ++++++++++++++++--- .../components/pages/SubjectOverviewPage.tsx | 14 ++++++++ 2 files changed, 43 insertions(+), 5 deletions(-) diff --git a/src/app/components/elements/svg/DifficultyIcons.tsx b/src/app/components/elements/svg/DifficultyIcons.tsx index e15c9cabe3..a8cc3c1ba7 100644 --- a/src/app/components/elements/svg/DifficultyIcons.tsx +++ b/src/app/components/elements/svg/DifficultyIcons.tsx @@ -5,6 +5,8 @@ import {difficultyLabelMap, difficultyShortLabelMap, isAda, isPhy, siteSpecific} import classnames from "classnames"; import {Rectangle} from "./Rectangle"; import {Circle} from "./Circle"; +import classNames from "classnames"; +import { icon } from "leaflet"; // Difficulty icon proportions const difficultyIconWidth = siteSpecific(15, 25); @@ -13,6 +15,8 @@ const yPadding = 2; const difficultyCategoryLevels = siteSpecific([1, 2, 3], [1, 2]); const miniHexagon = calculateHexagonProportions(difficultyIconWidth / 2, 0); const miniSquare = {width: difficultyIconWidth, height: difficultyIconWidth}; +const largeHexagon = calculateHexagonProportions(difficultyIconWidth, 0); +const largeSquare = {width: difficultyIconWidth * 2, height: difficultyIconWidth * 2}; const squareOffset = ((miniHexagon.quarterHeight * 4 + 2 * yPadding) - difficultyIconWidth) / 2 - 1; // ${yPadding + (difficultyCategory === "P" && isPhy ? 0 : 2)} @@ -21,16 +25,19 @@ interface DifficultyIconShapeProps { difficultyCategoryLevel: number; active: boolean; blank?: boolean; + size?: "sm" | "lg"; } -function SingleDifficultyIconShape({difficultyCategory, difficultyCategoryLevel, active, blank}: DifficultyIconShapeProps) { + +function SingleDifficultyIconShape({difficultyCategory, difficultyCategoryLevel, active, blank, size}: DifficultyIconShapeProps) { + const iconWidth = size === "lg" ? difficultyIconWidth * 2 : difficultyIconWidth; // FIXME the calculations here need refactoring, had to rush them to get it done - return + return {difficultyCategory === "P" ? siteSpecific( - , - + , + ) : - + } {/* {
@@ -64,3 +71,20 @@ export function DifficultyIcons({difficulty, blank, className} : {difficulty: Di
; } + +export function DifficultyIcon({difficultyCategory, className} : {difficultyCategory: string, className?: string}) { + return
+ + + +
; +} diff --git a/src/app/components/pages/SubjectOverviewPage.tsx b/src/app/components/pages/SubjectOverviewPage.tsx index 71fb8e2c48..09a593e330 100644 --- a/src/app/components/pages/SubjectOverviewPage.tsx +++ b/src/app/components/pages/SubjectOverviewPage.tsx @@ -7,6 +7,7 @@ import { HUMAN_SUBJECTS, isDefined, LEARNING_STAGE, LearningStage, PHY_NAV_SUBJE import { PageContextState } from "../../../IsaacAppTypes"; import { ListViewCardProps, ListViewCards } from "../elements/list-groups/ListView"; import { LandingPageFooter } from "./SubjectLandingPage"; +import { DifficultyIcon } from "../elements/svg/DifficultyIcons"; const SubjectCards = ({context}: { context: PageContextState }) => { if (!isDefined(context?.subject)) return null; @@ -127,7 +128,20 @@ export const SubjectOverviewPage = withRouter((props: RouteComponentProps) => {

All Isaac Science questions are classed as either "Practice" or "Challenge" – indicated by the symbols below. +

+ +
+
+ + Practice +
+
+ + Challenge +
+
+

In Isaac {humanSubject},

  • Practice questions are those that require one concept or equation to solve.
    • From 95a96e7003ddb8e08cb6d092f1045fcf8e51d738 Mon Sep 17 00:00:00 2001 From: Sol Dubock <94075844+sjd210@users.noreply.github.com> Date: Thu, 22 May 2025 15:00:45 +0100 Subject: [PATCH 3/8] Add example questions to subject overviews --- .../elements/list-groups/ListView.tsx | 2 +- .../components/pages/SubjectLandingPage.tsx | 2 +- .../components/pages/SubjectOverviewPage.tsx | 41 ++++++++++++++++--- src/app/services/constants.ts | 2 +- src/scss/phy/list-groups.scss | 8 ++++ 5 files changed, 46 insertions(+), 9 deletions(-) diff --git a/src/app/components/elements/list-groups/ListView.tsx b/src/app/components/elements/list-groups/ListView.tsx index 4f47bbe2bb..ee5745846f 100644 --- a/src/app/components/elements/list-groups/ListView.tsx +++ b/src/app/components/elements/list-groups/ListView.tsx @@ -256,7 +256,7 @@ export const ListView = ({items, className, ...rest}: ListViewProps & ListViewIt return ; case (DOCUMENT_TYPE.QUIZ): return ; - case SEARCH_RESULT_TYPE.GAMEBOARD: + case SEARCH_RESULT_TYPE.QUESTION_DECK: return ; default: // Do not render this item if there is no matching DOCUMENT_TYPE diff --git a/src/app/components/pages/SubjectLandingPage.tsx b/src/app/components/pages/SubjectLandingPage.tsx index c1b9b4ddfa..d1558dc773 100644 --- a/src/app/components/pages/SubjectLandingPage.tsx +++ b/src/app/components/pages/SubjectLandingPage.tsx @@ -92,7 +92,7 @@ export const LandingPageFooter = ({context}: {context: PageContextState}) => { // TODO: are we going to make subject-specific news? const {data: news} = useGetNewsPodListQuery({subject: "physics"}); - return + return
    {/* if there are books, display books. otherwise, display news */} {books.length > 0 diff --git a/src/app/components/pages/SubjectOverviewPage.tsx b/src/app/components/pages/SubjectOverviewPage.tsx index 09a593e330..0fab13d0a7 100644 --- a/src/app/components/pages/SubjectOverviewPage.tsx +++ b/src/app/components/pages/SubjectOverviewPage.tsx @@ -3,13 +3,15 @@ import { RouteComponentProps, withRouter } from "react-router"; import { Container } from "reactstrap"; import { TitleAndBreadcrumb } from "../elements/TitleAndBreadcrumb"; import { useUrlPageTheme } from "../../services/pageContext"; -import { HUMAN_SUBJECTS, isDefined, LEARNING_STAGE, LearningStage, PHY_NAV_SUBJECTS, Subject } from "../../services"; -import { PageContextState } from "../../../IsaacAppTypes"; -import { ListViewCardProps, ListViewCards } from "../elements/list-groups/ListView"; +import { above, HUMAN_SUBJECTS, isDefined, LEARNING_STAGE, LearningStage, PHY_NAV_SUBJECTS, SEARCH_RESULT_TYPE, subject, Subject, SUBJECTS, useDeviceSize } from "../../services"; +import { PageContextState, ShortcutResponse } from "../../../IsaacAppTypes"; +import { ListView, ListViewCardProps, ListViewCards, QuestionDeckListViewItem } from "../elements/list-groups/ListView"; import { LandingPageFooter } from "./SubjectLandingPage"; import { DifficultyIcon } from "../elements/svg/DifficultyIcons"; const SubjectCards = ({context}: { context: PageContextState }) => { + const deviceSize = useDeviceSize(); + if (!isDefined(context?.subject)) return null; const humanSubject = context?.subject && HUMAN_SUBJECTS[context.subject]; @@ -77,14 +79,41 @@ const SubjectCards = ({context}: { context: PageContextState }) => { icon: `/assets/phy/icons/redesign/subject-${context.subject}.svg`, } }); - } //hrm + } - return a ? (b ? 0 : -1) : 1) // put nulls at the end .filter((x, i, a) => x || (i % 2 === 0 ? a[i + 1] : a[i - 1])) // remove pairs of nulls } />; }; +const ExampleQuestions = ({ subject }: { subject: Subject }) => { + const items: { [key in Subject]: ShortcutResponse[] } = { + maths: [{ + title: "Sample Maths Questions", + type: SEARCH_RESULT_TYPE.QUESTION_DECK, + id: "sample_maths_questions", + }], + physics: [/*{ + title: "Sample Physics Questions", + type: SEARCH_RESULT_TYPE.QUESTION_DECK, + id: "sample_phy_questions", + }*/], // Uncomment when physics questions are available + chemistry: [{ + title: "Sample Chemistry Questions", + type: SEARCH_RESULT_TYPE.QUESTION_DECK, + id: "sample_chem_questions", + }], + biology: [{ + title: "Sample Biology Questions", + type: SEARCH_RESULT_TYPE.QUESTION_DECK, + id: "sample_bio_questions", + }], + }; + + return items[subject].length > 0 ? : null; +}; + export const SubjectOverviewPage = withRouter((props: RouteComponentProps) => { const pageContext = useUrlPageTheme(); @@ -149,7 +178,7 @@ export const SubjectOverviewPage = withRouter((props: RouteComponentProps) => {

- {/* */} +
} diff --git a/src/app/services/constants.ts b/src/app/services/constants.ts index 260cab85b2..bd73f359f8 100644 --- a/src/app/services/constants.ts +++ b/src/app/services/constants.ts @@ -924,7 +924,7 @@ export function isAQuestionLikeDoc(doc: ContentDTO): doc is IsaacQuestionPageDTO export enum SEARCH_RESULT_TYPE { SHORTCUT = "shortcut", - GAMEBOARD = "gameboard", + QUESTION_DECK = "question deck", } export const documentDescription: {[documentType in DOCUMENT_TYPE]: string} = { diff --git a/src/scss/phy/list-groups.scss b/src/scss/phy/list-groups.scss index 40aef7456b..71f97bf902 100644 --- a/src/scss/phy/list-groups.scss +++ b/src/scss/phy/list-groups.scss @@ -35,6 +35,14 @@ &:not(:first-child) { border-top: 1px solid var(--border-light); } + &:nth-child(1) { + border-top-left-radius: inherit; + border-top-right-radius: inherit; + } + &:nth-last-child(1) { + border-bottom-left-radius: inherit; + border-bottom-right-radius: inherit; + } } @include media-breakpoint-up(lg) { From b01324f2d0e9c57dbac407be61bfd995262b985e Mon Sep 17 00:00:00 2001 From: Sol <94075844+sjd210@users.noreply.github.com> Date: Thu, 22 May 2025 15:01:14 +0100 Subject: [PATCH 4/8] Potential fix for code scanning alert no. 662: Unused variable, import, function or class Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com> --- src/app/components/elements/svg/DifficultyIcons.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/app/components/elements/svg/DifficultyIcons.tsx b/src/app/components/elements/svg/DifficultyIcons.tsx index a8cc3c1ba7..b9502a1e75 100644 --- a/src/app/components/elements/svg/DifficultyIcons.tsx +++ b/src/app/components/elements/svg/DifficultyIcons.tsx @@ -6,7 +6,6 @@ import classnames from "classnames"; import {Rectangle} from "./Rectangle"; import {Circle} from "./Circle"; import classNames from "classnames"; -import { icon } from "leaflet"; // Difficulty icon proportions const difficultyIconWidth = siteSpecific(15, 25); From 71aa99aaec579466996605eb3dd8aab0869bff97 Mon Sep 17 00:00:00 2001 From: Sol Dubock <94075844+sjd210@users.noreply.github.com> Date: Thu, 22 May 2025 15:06:09 +0100 Subject: [PATCH 5/8] Cleanup names after merge --- src/app/components/elements/list-groups/ListView.tsx | 2 +- src/app/components/pages/SubjectOverviewPage.tsx | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/app/components/elements/list-groups/ListView.tsx b/src/app/components/elements/list-groups/ListView.tsx index 9ebc59a8c1..71e8961f88 100644 --- a/src/app/components/elements/list-groups/ListView.tsx +++ b/src/app/components/elements/list-groups/ListView.tsx @@ -304,7 +304,7 @@ export const ListView = ({items, className, ...rest}: ListViewProps & ListViewIt return ; case (DOCUMENT_TYPE.QUIZ): return ; - case SEARCH_RESULT_TYPE.QUESTION_DECK: + case SEARCH_RESULT_TYPE.GAMEBOARD: return ; case DOCUMENT_TYPE.BOOK_INDEX_PAGE: return ; diff --git a/src/app/components/pages/SubjectOverviewPage.tsx b/src/app/components/pages/SubjectOverviewPage.tsx index 0fab13d0a7..4a2557f672 100644 --- a/src/app/components/pages/SubjectOverviewPage.tsx +++ b/src/app/components/pages/SubjectOverviewPage.tsx @@ -91,22 +91,22 @@ const ExampleQuestions = ({ subject }: { subject: Subject }) => { const items: { [key in Subject]: ShortcutResponse[] } = { maths: [{ title: "Sample Maths Questions", - type: SEARCH_RESULT_TYPE.QUESTION_DECK, + type: SEARCH_RESULT_TYPE.GAMEBOARD, id: "sample_maths_questions", }], physics: [/*{ title: "Sample Physics Questions", - type: SEARCH_RESULT_TYPE.QUESTION_DECK, + type: SEARCH_RESULT_TYPE.GAMEBOARD, id: "sample_phy_questions", }*/], // Uncomment when physics questions are available chemistry: [{ title: "Sample Chemistry Questions", - type: SEARCH_RESULT_TYPE.QUESTION_DECK, + type: SEARCH_RESULT_TYPE.GAMEBOARD, id: "sample_chem_questions", }], biology: [{ title: "Sample Biology Questions", - type: SEARCH_RESULT_TYPE.QUESTION_DECK, + type: SEARCH_RESULT_TYPE.GAMEBOARD, id: "sample_bio_questions", }], }; From e4a3e5234c63db49eb2f63387c662cf90eba0757 Mon Sep 17 00:00:00 2001 From: Sol Dubock <94075844+sjd210@users.noreply.github.com> Date: Thu, 22 May 2025 15:13:53 +0100 Subject: [PATCH 6/8] Remove unused imports --- src/app/components/pages/SubjectOverviewPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/components/pages/SubjectOverviewPage.tsx b/src/app/components/pages/SubjectOverviewPage.tsx index 4a2557f672..f215d548f3 100644 --- a/src/app/components/pages/SubjectOverviewPage.tsx +++ b/src/app/components/pages/SubjectOverviewPage.tsx @@ -3,9 +3,9 @@ import { RouteComponentProps, withRouter } from "react-router"; import { Container } from "reactstrap"; import { TitleAndBreadcrumb } from "../elements/TitleAndBreadcrumb"; import { useUrlPageTheme } from "../../services/pageContext"; -import { above, HUMAN_SUBJECTS, isDefined, LEARNING_STAGE, LearningStage, PHY_NAV_SUBJECTS, SEARCH_RESULT_TYPE, subject, Subject, SUBJECTS, useDeviceSize } from "../../services"; +import { above, HUMAN_SUBJECTS, isDefined, LEARNING_STAGE, LearningStage, PHY_NAV_SUBJECTS, SEARCH_RESULT_TYPE, Subject, useDeviceSize } from "../../services"; import { PageContextState, ShortcutResponse } from "../../../IsaacAppTypes"; -import { ListView, ListViewCardProps, ListViewCards, QuestionDeckListViewItem } from "../elements/list-groups/ListView"; +import { ListView, ListViewCardProps, ListViewCards } from "../elements/list-groups/ListView"; import { LandingPageFooter } from "./SubjectLandingPage"; import { DifficultyIcon } from "../elements/svg/DifficultyIcons"; From a900e7294ba9a95150ca5adfa01ee8f123e833d9 Mon Sep 17 00:00:00 2001 From: Sol Dubock <94075844+sjd210@users.noreply.github.com> Date: Fri, 23 May 2025 11:51:37 +0100 Subject: [PATCH 7/8] Reconfigure GCSE Biology to use coming_soon state --- .../components/pages/SubjectOverviewPage.tsx | 22 +++++--------- src/scss/phy/list-groups.scss | 29 ++++--------------- 2 files changed, 12 insertions(+), 39 deletions(-) diff --git a/src/app/components/pages/SubjectOverviewPage.tsx b/src/app/components/pages/SubjectOverviewPage.tsx index f215d548f3..a7b07fb2a6 100644 --- a/src/app/components/pages/SubjectOverviewPage.tsx +++ b/src/app/components/pages/SubjectOverviewPage.tsx @@ -8,6 +8,7 @@ import { PageContextState, ShortcutResponse } from "../../../IsaacAppTypes"; import { ListView, ListViewCardProps, ListViewCards } from "../elements/list-groups/ListView"; import { LandingPageFooter } from "./SubjectLandingPage"; import { DifficultyIcon } from "../elements/svg/DifficultyIcons"; +import { AbstractListViewItemState } from "../elements/list-groups/AbstractListViewItem"; const SubjectCards = ({context}: { context: PageContextState }) => { const deviceSize = useDeviceSize(); @@ -28,6 +29,7 @@ const SubjectCards = ({context}: { context: PageContextState }) => { }, url: `/${context.subject}/11_14`, stage: LEARNING_STAGE["11_TO_14"], + subject: context.subject, }, { item: { @@ -40,6 +42,8 @@ const SubjectCards = ({context}: { context: PageContextState }) => { }, url: `/${context.subject}/gcse`, stage: LEARNING_STAGE.GCSE, + subject: context.subject, + state: context.subject === "biology" ? AbstractListViewItemState.COMING_SOON : undefined, }, { item: { @@ -52,6 +56,7 @@ const SubjectCards = ({context}: { context: PageContextState }) => { }, url: `/${context.subject}/a_level`, stage: LEARNING_STAGE.A_LEVEL, + subject: context.subject, }, { item: { @@ -64,22 +69,9 @@ const SubjectCards = ({context}: { context: PageContextState }) => { }, url: `/${context.subject}/university`, stage: LEARNING_STAGE.UNIVERSITY, + subject: context.subject, }, - ].map(({stage, ...card}) => (PHY_NAV_SUBJECTS[context.subject as Subject] as readonly LearningStage[])?.includes(stage) ? card : null); - - if (context.subject === "biology") { - cards.push({ - item: { - title: "GCSE (COMING SOON)", - subtitle: `Our GCSE ${humanSubject} resources develop the ${humanSubject} knowledge needed at GCSE through the use of questions, concepts and books.` - }, - className: "disabled", - icon: { - type: "img" as const, - icon: `/assets/phy/icons/redesign/subject-${context.subject}.svg`, - } - }); - } + ].map(({stage, ...card}) => (PHY_NAV_SUBJECTS[context.subject as Subject] as readonly LearningStage[])?.includes(stage) || card.state === AbstractListViewItemState.COMING_SOON ? card : null); return a ? (b ? 0 : -1) : 1) // put nulls at the end diff --git a/src/scss/phy/list-groups.scss b/src/scss/phy/list-groups.scss index d9319ad966..d6bd529cbc 100644 --- a/src/scss/phy/list-groups.scss +++ b/src/scss/phy/list-groups.scss @@ -24,10 +24,6 @@ border-radius: 0; background-color: transparent; - &.disabled { - background-color: $color-neutral-200; - } - @include media-breakpoint-down(lg) { &:not(:last-child) { border-bottom: 1px solid var(--border-light); @@ -35,14 +31,6 @@ &:not(:first-child) { border-top: 1px solid var(--border-light); } - &:nth-child(1) { - border-top-left-radius: inherit; - border-top-right-radius: inherit; - } - &:nth-last-child(1) { - border-bottom-left-radius: inherit; - border-bottom-right-radius: inherit; - } } @include media-breakpoint-up(lg) { @@ -58,18 +46,6 @@ &:nth-last-child(n+3) { border-bottom: 1px solid var(--border-light); } - &:nth-child(1) { - border-top-left-radius: inherit; - } - &:nth-child(2) { - border-top-right-radius: inherit; - } - &:nth-last-child(2) { - border-bottom-left-radius: inherit; - } - &:nth-last-child(1) { - border-bottom-right-radius: inherit; - } } } } @@ -171,4 +147,9 @@ margin-left: 0.5rem; } } + + img { + // For items that use images rather than icons (e.g. subject logos), to remove the need to include a seperate greyscale image + filter: grayscale(100%); + } } From f45bcc2599f04174867f00da3d02526c301fca12 Mon Sep 17 00:00:00 2001 From: Sol Dubock <94075844+sjd210@users.noreply.github.com> Date: Wed, 28 May 2025 10:38:38 +0100 Subject: [PATCH 8/8] Reduce sample question width --- src/app/components/pages/SubjectOverviewPage.tsx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/app/components/pages/SubjectOverviewPage.tsx b/src/app/components/pages/SubjectOverviewPage.tsx index a7b07fb2a6..85e0a34a59 100644 --- a/src/app/components/pages/SubjectOverviewPage.tsx +++ b/src/app/components/pages/SubjectOverviewPage.tsx @@ -79,7 +79,7 @@ const SubjectCards = ({context}: { context: PageContextState }) => { } />; }; -const ExampleQuestions = ({ subject }: { subject: Subject }) => { +const ExampleQuestions = ({ subject, className }: { subject: Subject, className: string }) => { const items: { [key in Subject]: ShortcutResponse[] } = { maths: [{ title: "Sample Maths Questions", @@ -103,7 +103,7 @@ const ExampleQuestions = ({ subject }: { subject: Subject }) => { }], }; - return items[subject].length > 0 ? : null; + return items[subject].length > 0 ? : null; }; export const SubjectOverviewPage = withRouter((props: RouteComponentProps) => { @@ -170,7 +170,9 @@ export const SubjectOverviewPage = withRouter((props: RouteComponentProps) => {

- +
+ +
}