Playground for CEP

No Results Found 0/0

TAG NEW

Functional overview

Paragraph block

  • Bullet list block

Headings

Hierarchy: Start at V3 and move down incrementaly down (e.g. section > sub section > sub sub section

Text with Icon block

We use the “text with icon” field to quickly orient the user with the type of information/content to expect in the inline copy by using common and easy to understand visual cues/icons.

Used when providing guidance/best practice/recommendations re delivering care/permission to do something. 

For example:

Used when providing external links to recommendations/further information. 

For example:

Used when conveying REALLY important information that applies to the whole population, high risks, red flags, gov’t requirements, etc.  The point of use is to make the user STOP and read.  So we tended to use it sparingly otherwise the impact of the icon will be diluted.

For example:

  • Any persons experiencing one of the following should be told to self-isolate and tested as soon as possible:
    • Fever (temperature of 37.8°C or greater)
    • New/worsening cough
    • Shortness of breath (dyspnea)
    • Sore throat
    • Difficulty swallowing
    • New olfactory or taste disorder(s)
    • Nausea/vomiting, diarrhea, abdominal pain
    • Runny nose, or nasal congestion (in absence of underlying reason for these symptoms such as seasonal allergies, post nasal drip, etc.)
  • There is only low-quality evidence available on COVID-19, as it is an emerging virus. Many studies being released have not been peer-reviewed. Among those that have been peer-reviewed, many are small, retrospective observational studies and thus have serious limitations and risks of bias. While the findings of emerging COVID-19 studies can be useful in helping to broaden our understanding about how the virus might operate, the results of COVID-19 studies should not be considered validated.
  • As reports of children experiencing a multi-system inflammatory syndrome multiply, the Canadian Paediatric Surveillance Program issued a Public Health Alert (CPSP, May 12, 2020) encouraging those providing paediatric care to familiarize themselves with the presentations of this emerging syndrome. It has now been included in the case definition and is reportable to public health.

Generally used when conveying information that applies to the part of the population, things that are “strongly recommended” but maybe not yet mandated, cautions, etc. Similar criteria as the (!) icon, but with a content that isn’t quite as MUST READ. The point of use is to make the user PAUSE and read.  Used more frequently.

For example:

  • OCFP and CFPC suggest strongly considering PPE use for all patient encounters that involve less than 6 feet of separation due to the possibility of asymptomatic and pre-symptomatic transmission. For more information on PPE, see Infection prevention and control: PPE, HCW infection control, cleaning.
  • While rare, clinicians should be aware of this potential syndrome and maintain a high index of suspicion to identify cases. Some patients have deteriorated quickly and have required intensive care unit admission for vasopressors and mechanical ventilation.
  • Caution should be taken when using NSAIDs in the context of acute respiratory infections (ARI) and patients with the following conditions.

Commonly used and understood icon that conveys “geolocate”. Used when linking out to regional/local resources.  

For example:

Used for when we provide talking tips.

For example:

  • Responding to questions about unproven therapies for COVID-19: “Though research is underway, there are currently no medications recommended for preventing or treating COVID-19 because there is not enough evidence to make any conclusions yet” (CMAJ, 2020).
  • “This is your home and we will make every effort to make you comfortable in your new room with all of your belongings.”
  • “In-room dining is important for you and other residents so that we can protect everyone, including yourself.”

Table block options

Table

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec non maximus tellus, at tristique velit. Aliquam interdum arcu orci, id congue lacus elementum ac. Phasellus congue aliquam lectus sed porta. Morbi turpis tellus, pharetra fermentum consectetur sollicitudin, viverra pretium ex. Quisque consectetur faucibus felis et varius. Nulla mattis maximus dolor, in consequat est pulvinar ac. Pellentesque eleifend eu tortor et cursus. Integer iaculis quis sapien congue commodo. Proin ullamcorper posuere eros, nec ultrices odio elementum aliquam. Aliquam erat volutpat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec non maximus tellus, at tristique velit. Aliquam interdum arcu orci, id congue lacus elementum ac. Phasellus congue aliquam lectus sed porta. Morbi turpis tellus, pharetra fermentum consectetur sollicitudin, viverra pretium ex. Quisque consectetur faucibus felis et varius. Nulla mattis maximus dolor, in consequat est pulvinar ac. Pellentesque eleifend eu tortor et cursus. Integer iaculis quis sapien congue commodo. Proin ullamcorper posuere eros, nec ultrices odio elementum aliquam. Aliquam erat volutpat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec non maximus tellus, at tristique velit. Aliquam interdum arcu orci, id congue lacus elementum ac. Phasellus congue aliquam lectus sed porta. Morbi turpis tellus, pharetra fermentum consectetur sollicitudin, viverra pretium ex. Quisque consectetur faucibus felis et varius. Nulla mattis maximus dolor, in consequat est pulvinar ac. Pellentesque eleifend eu tortor et cursus. Integer iaculis quis sapien congue commodo. Proin ullamcorper posuere eros, nec ultrices odio elementum aliquam. Aliquam erat volutpat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec non maximus tellus, at tristique velit. Aliquam interdum arcu orci, id congue lacus elementum ac. Phasellus congue aliquam lectus sed porta. Morbi turpis tellus, pharetra fermentum consectetur sollicitudin, viverra pretium ex. Quisque consectetur faucibus felis et varius. Nulla mattis maximus dolor, in consequat est pulvinar ac. Pellentesque eleifend eu tortor et cursus. Integer iaculis quis sapien congue commodo. Proin ullamcorper posuere eros, nec ultrices odio elementum aliquam. Aliquam erat volutpat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec non maximus tellus, at tristique velit. Aliquam interdum arcu orci, id congue lacus elementum ac. Phasellus congue aliquam lectus sed porta. Morbi turpis tellus, pharetra fermentum consectetur sollicitudin, viverra pretium ex. Quisque consectetur faucibus felis et varius. Nulla mattis maximus dolor, in consequat est pulvinar ac. Pellentesque eleifend eu tortor et cursus. Integer iaculis quis sapien congue commodo. Proin ullamcorper posuere eros, nec ultrices odio elementum aliquam. Aliquam erat volutpat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec non maximus tellus, at tristique velit. Aliquam interdum arcu orci, id congue lacus elementum ac. Phasellus congue aliquam lectus sed porta. Morbi turpis tellus, pharetra fermentum consectetur sollicitudin, viverra pretium ex. Quisque consectetur faucibus felis et varius. Nulla mattis maximus dolor, in consequat est pulvinar ac. Pellentesque eleifend eu tortor et cursus. Integer iaculis quis sapien congue commodo. Proin ullamcorper posuere eros, nec ultrices odio elementum aliquam. Aliquam erat volutpat.

  • Mostly commonly used “table”. “cleanest” in look and feel.  Allows for a maximum of 3 columns, infinite rows.
  • For example, used consistently throughout the tool in a section’s “Top resources”.
  • Inner border can be grey or blue.

FAQ/info block

Answer 1

Answer 2

Answer 3

Another “click to reveal” block. commonly used for FAQs, chronic disease mgmt, special pops, etc. For example:

Please note the content contained within the answer is NOT searchable using the search function.

Card block

We use this block when displaying similar information that has consistent headings/categories. It was originally developed to contain rx info. Allows us to use horizontal real estate and not overload the vertical/infinite scroll issue. Also gives provides opportunity to add additional information with each card that pops out for more details. Mobile friendly. Searchable in search function. For example:

Pop-out block

Designed for talking tips, etc. Generally used to contain information that is not necessarily immediately relevant for all users. But, for those that are interested, they can click to “opt-in” to view the content. Content is NOT searchable using the search function. For example:

Image block

Used for images of diagrams, static flow charts, evidence tables that go beyond three columns, etc. Please note, if we can we try NOT to use images for evidence tables are they do not render well in mobile. Where possible, consider how the content can be summarized differently/more succiently before going down the image route. For example:

practice

Updated Pretend title

Health Canada has approved the Pfizer vaccine for use in children aged 5 and over and the Moderna vaccine for use in children aged 12 and over. The Pfizer vaccine will be administered at a lower dose (10 mcg of mRNA) in children ages 5-11, compared to the 30 mcg dose for ages 12 and over. The recommended interval between doses of the pediatric Pfizer vaccine is 8 weeks (56 days). In light of the Omicron variant both NACI and the Ontario Immunization Advisory Committee continue to recommend this interval in order to optimize for a strong and robust immune response in children. It is recommended as a precaution that children ages 5-11 do not receive the Pfizer COVID-19 vaccines within 14 days of other vaccinations. (MOH, November 22, 2021, Health Canada, November 19, 2021, Public Health Ontario, December 23, 2021)

covid title

Primary care has a critical role to play in the effort for a successful flu campaign. Aside from physically administering the vaccine, communication by trusted health professionals about the importance of the vaccine is directly linked to its uptake: 69% of survey respondents reported that the opinion of their family doctor, general practitioner or nurse practitioner was an important factor in their decision to get the flu vaccine

Sample title

Christina's page

Dina's page

Ellen's page

Makayla's page

Nithusa's page

Taylor's page