/tb-solutions

Primary LanguageJavaScript

tb-challenge

Used Grid for these tasks:

  • For desktop and tablet, the widget should be three columns and two rows (3x2). Include the item title and branding below each image. Add a header to the top of the widget with your choice of text.
  • For smartphone, the widget should be one column with six rows (1x6). Include the item title and branding below each image. Add a header to the top of the widget with your choice of text.
  • For each item in the widget, the thumbnail image, item title, and branding text should be clickable links that load the url of that item (use the corresponding item url value provided in the response).

Used Ellipsis:

  • Limit the number of lines that the item title can take up to be three lines, truncating longer titles with an ellipsis (…). Make sure you don’t break the layout!

Checked if the category exists, render and show it on the images:

  • If the item has a category (as seen in the JSON response), display that category with that item in the widget. Where/how you display it is up to you!

Used navigator language for detecting languages:

  • If the user is viewing the widget from the United States, show the header text in English. If the user is viewing from outside the US, show the header text in another language (can be a catch-all, doesn’t need to be country specific).