You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I think we should create a style guide for this repository.
Since bootstrap increases the density of html code white space between logical chunks should be permitted. Ex:
<a class="dropdown-item dropdown-list-item" href="https://discord.gg/ckQ52gA"
target="_blank" rel="noopener noreferrer">Discord Chat!!!</a>
<a class="dropdown-item dropdown-list-item" href="https://www.facebook.com/groups/w3develops/"
target="_blank" rel="noopener noreferrer">Facebook Group</a>```
I believe the space in between each item makes it easier to read. This code will be frequently updated so when it's important to know that there's one item the extra space helps amplify that and is easier on the eyes (and mental load).
Terminating lines before 80th Column: Another important item is with regard to how far out items should go. Perhaps this is a traditional academic view but normally column 80 is significant and code isn't traditionally supposed to run past it. In html there are sometimes long URLs, these tend to be less important with regards to needing to be read. One starts to read it and says "I get the point already!" Anyway URLs can go past this 80th column, just be sure to wrap after the end of the href.
Indentation: Traditional thought is when you open a tag there should be an indentation underneath the item. I believe there are exceptions to this. For example a stray `<div>` that is used as a container or to mark a logical division between items. This could be placed at the beginning of a chunk of code, an extra line break should be applied before and after the `div` tags.
ex:
```</section>
<div>
<p> some sort of text would go here I guess... </p>
<p> some more text maybe </p>
</div>
<section>```
I'm not sure what else we should have. HTML can quickly become a mess. If you have any style ideas that you would like to suggest feel free to comment here! I'm sure there are also templates for styles for each language and I think we should check into that as well.
html
https://www.w3schools.com/html/html5_syntax.asp
css articles
google - https://google.github.io/styleguide/htmlcssguide.html
https://levelup.gitconnected.com/the-complete-css-style-guide-for-your-next-project-bb5a5d8f7bc9
https://css-tricks.com/css-style-guides/
5 things to consider when making a css style guide - https://blog.logrocket.com/5-things-to-consider-when-creating-your-css-style-guide-7b85fa70039d
a list of css style guides for inspiration- https://www.webfx.com/blog/web-design/css-style-guides/
sass
https://css-tricks.com/sass-style-guide/
javascript
https://javascript.info/coding-style#style-guides
google - https://google.github.io/styleguide/jsguide.html
react
https://css-tricks.com/react-code-style-guide/
general
http://styleguides.io/
http://alistapart.com/article/creating-style-guides/
https://css-tricks.com/?s=style+guide&orderby=relevance&post_type=post%2Cpage%2Cguide
php -
https://gist.github.com/ryansechrest/8138375
https://mitsloan.mit.edu/shared/content/PHP_Code_Style_Guide.php
must read google guides -
https://github.com/google/styleguide
what is a brand style guide -
https://www.executionists.com/website-brand-style-guide/
The text was updated successfully, but these errors were encountered: