client/src/components/SessionSummary.js
changeset 190 01ad654237d5
parent 174 ac1a026edd58
child 191 3f71ad81a5a9
equal deleted inserted replaced
189:3470535a6caa 190:01ad654237d5
     7 
     7 
     8 const SessionSummary = ({notes}) => (
     8 const SessionSummary = ({notes}) => (
     9   <div className="session-summary-list">
     9   <div className="session-summary-list">
    10     <ul className="list-group sticky-left">
    10     <ul className="list-group sticky-left">
    11       {notes.map((note) => {
    11       {notes.map((note) => {
    12         const bgColor = note.categories.length > 0 ? Color(note.categories[0].color).lighten(0.5).hex() : "transparent";
    12         let bgColor = "transparent";
       
    13         if(note.categories.length > 0) {
       
    14           const hsl = Color(note.categories[0].color).hsl();
       
    15           const l = hsl.lightness();
       
    16           bgColor = hsl.lighten(50.0/l-0.5).hex();
       
    17         }
    13         return (
    18         return (
    14         <li className="list-group-item border-0 py-1" key={note._id}>
    19         <li className="list-group-item border-0 py-1" key={note._id}>
    15             <a href={'#note-' + note._id}>
    20             <a href={'#note-' + note._id}>
    16               <small className="note-time text-irinotes-time px-1 bg-irinotes-headers border-0 text-center">{formatTimestamp(note.startedAt)}</small>
    21               <small className="note-time text-irinotes-time px-1 bg-irinotes-headers border-0 text-center">{formatTimestamp(note.startedAt)}</small>
    17               <small className="note-length font-weight-bold text-muted text-center badge" style={{ backgroundColor: bgColor }}>{_.words(note.plain).length} mots</small>
    22               <small className="note-length font-weight-bold text-muted text-center badge" style={{ backgroundColor: bgColor }}>{_.words(note.plain).length} mots</small>