Guidelines.md

   1 # Guidelines for future use
   2 ---
   3 ## Git
   4
   5 Use master branch.
   6
   7 historical info: Ignore the responsive branch. Changes there have been
   8 manually brought back into master, this was necessary because Zak was
   9 not using git properly.
  10
  11 ## Images:
  12
  13 * If it's a logo then ALWAYS export the images from its VECTOR (.svg, .eps, .pdf) source. If a vector source isn't available, use a very large image and scale it down.
  14
  15 * Do not put a logo next to a product or vice-versa, Always use images with the same nature (i.e. product versus product; logo versus logo)
  16
  17 * Charities' logos should be exported to 580px × 580px, transparent PNG
  18
  19 * Products' images, "good" or "naughty" should be put inside transparent, square PNG files at 350px × 350px, and a padding consistent with existing images.
  20
  21 ## BUY/GET button
  22
  23 * Copy the entire block of code including the two lines for comments before and after the Divs.
  24
  25 * Paste it just after the **h5** line.
  26
  27 * Append a unique string to the `id` `href` `aria-controls` of the **a** elements, as well as the `id` of the next div and the content of `document.getElementById('...')` so that all have the same text. Example: `get-iem-smartphone` `get-item-compact` ...
  28
  29 * Change the content of the Anchor link **a** and its `href` attributes to link to different sellers.
  30
  31 * If the product has only one source use this code instead:
  32
  33 `<a class="btn get-item" role="button" href="#">BUY</a>`
  34
  35
  36 ## General Best Practices
  37
  38 * Resist the urge to add another list-element **li** to announce a SALE, a BONUS, or anything unrelated to being a PROS or CONS. Instead use the SALE triangle, and Bootstrap's *alert* (Check its documentation, or existing code if unsure)
  39
  40 * Avoid using very long titles as they tend to wrap into multiple lines on mobile devices. Be concise.