Commit 803434ac authored by Marek Veselý's avatar Marek Veselý
Browse files

Merge branch '446-instructor-s-view-learning-objectives-and-activities-color' into 'main' 

make reached LO/LA more prominent

Closes #446

See merge request inject/frontend!376
parents ec653304 9f1e28dc

frontend/src/instructor/InstructorMilestones/MilestoneIndicator.tsx

+9 −2
Original line number Diff line number Diff line 
import { Alert, Icon, SwitchCard, Tag, Tooltip } from '@blueprintjs/core'

import {

  Alert,

  Colors,

  Icon,

  SwitchCard,

  Tag,

  Tooltip,

} from '@blueprintjs/core'

import type { MilestoneState } from '@inject/graphql/fragments/MilestoneState.generated'

import { useSetMilestone } from '@inject/graphql/mutations/SetMilestone.generated'

import Timestamp from '@inject/shared/components/Timestamp'
@@ -104,7 +111,7 @@ const MilestoneIndicator: FC<MilestoneIndicatorProps> = ({ 
          <Icon

            icon='dot'

            style={{

              color: reached ? '#128f00' : '#8f1200',

              color: reached ? Colors.GREEN3 : Colors.RED3,

              marginRight: '0.5rem',

            }}

            size={20}

frontend/src/instructor/LearningObjectives/LearningActivity.tsx

+5 −2
Original line number Diff line number Diff line 
import { CardList, Section, SectionCard } from '@blueprintjs/core'

import { CardList, Colors, Section, SectionCard } from '@blueprintjs/core'

import { Tick } from '@blueprintjs/icons'

import type { TeamLearningActivity } from '@inject/graphql/fragments/TeamLearningActivity.generated'

import type { FC } from 'react'

import MilestoneIndicator from '../InstructorMilestones/MilestoneIndicator'

import { reached } from './classes'



interface LearningActivityProps {

  activity: TeamLearningActivity
@@ -12,7 +14,8 @@ const LearningActivity: FC<LearningActivityProps> = ({ activity, teamId }) => ( 
  <Section

    title={activity.activity.name}

    subtitle={activity.activity.tags}

    icon={activity.reached ? 'tick' : undefined}

    className={activity.reached ? reached : undefined}

    icon={activity.reached ? <Tick color={Colors.GREEN3} /> : undefined}

  >

    <SectionCard>

      <CardList bordered={false}>

frontend/src/instructor/LearningObjectives/LearningObjective.tsx

+5 −2
Original line number Diff line number Diff line 
import { Section, SectionCard } from '@blueprintjs/core'

import { Colors, Section, SectionCard } from '@blueprintjs/core'

import { Tick } from '@blueprintjs/icons'

import { css } from '@emotion/css'

import type { TeamLearningObjective } from '@inject/graphql/fragments/TeamLearningObjective.generated'

import type { FC } from 'react'

import LearningActivity from './LearningActivity'

import { reached } from './classes'



const activities = css`

  display: flex;
@@ -23,7 +25,8 @@ const LearningObjective: FC<LearningObjectiveProps> = ({ 
    title={objective.objective.name}

    subtitle={objective.objective.tags}

    collapsible

    icon={objective.reached ? 'tick' : undefined}

    className={objective.reached ? reached : undefined}

    icon={objective.reached ? <Tick color={Colors.GREEN3} /> : undefined}

  >

    <SectionCard className={activities}>

      {objective.activities.map(activity => (

frontend/src/instructor/LearningObjectives/classes.ts

0 → 100644
+6 −0
Original line number Diff line number Diff line 
import { Colors } from '@blueprintjs/core'

import { css } from '@emotion/css'



export const reached = css`

  box-shadow: 0 0 0 1px ${Colors.GREEN3} !important;

`