Commit | Line | Data |
---|---|---|
9ac636d0 | 1 | # Guidelines for future use |
ce68d50b | 2 | --- |
0ca09d46 IK |
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 | ||
9ac636d0 | 11 | ## Images: |
ce68d50b | 12 | |
9ac636d0 | 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. |
afb35b89 | 14 | |
9ac636d0 | 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) |
ce68d50b | 16 | |
9ac636d0 | 17 | * Charities' logos should be exported to 580px × 580px, transparent PNG |
ce68d50b | 18 | |
9ac636d0 IK |
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. |