From: Ian Kelling Date: Mon, 20 Nov 2017 19:03:16 +0000 (-0500) Subject: docs changes from responsive X-Git-Url: https://vcs.fsf.org/?p=fsf-giving-guide.git;a=commitdiff_plain;h=9ac636d0e3059539d91af9e353613a11d3897cda;hp=69bb52fea031700207f6bb19cef3030d5c5b8f2c docs changes from responsive --- diff --git a/.gitignore b/.gitignore index 81ac380..4336d02 100644 --- a/.gitignore +++ b/.gitignore @@ -2,3 +2,4 @@ .developmentserverrc index.html Backup +*~ diff --git a/Guidelines.md b/Guidelines.md index 0b2447b..48b652c 100644 --- a/Guidelines.md +++ b/Guidelines.md @@ -1,12 +1,32 @@ -#Guidelines for future use +# Guidelines for future use --- -##Images: +## Images: -* If it's a logo then ALWAYS export the images from its verctor source. -* 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) -* Always export images and logos to a square, transparent PNG, preferably to 500px*500px. Otherwise put in in the template.png and export. +* 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. +* 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) -##Text: +* Charities' logos should be exported to 580px × 580px, transparent PNG -* Be brief, people do not usually read long text. +* Products' images, "good" or "naughty" should be put inside transparent, square PNG files at 350px × 350px, and a padding consistent with existing images. + +## BUY/GET button + +* Copy the entire block of code including the two lines for comments before and after the Divs. + +* Paste it just after the **h5** line. + +* 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` ... + +* Change the content of the Anchor link **a** and its `href` attributes to link to different sellers. + +* If the product has only one source use this code instead: + +`BUY` + + +## General Best Practices + +* 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) + +* Avoid using very long titles as they tend to wrap into multiple lines on mobile devices. Be concise. diff --git a/README.md b/README.md index 8841021..b7478d3 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,8 @@ # FSF Holiday Giving Guide README +## Deployment +The git repo holding the live copy of the site is in the master branch. + ## Adding images Make sure that, for side-by-side comparisons, both images are a similar height