Initial commit

LICENSE

@@ -0,0 +1,121 @@
+Creative Commons Legal Code
+
+CC0 1.0 Universal
+
+    CREATIVE COMMONS CORPORATION IS NOT A LAW FIRM AND DOES NOT PROVIDE
+    LEGAL SERVICES. DISTRIBUTION OF THIS DOCUMENT DOES NOT CREATE AN
+    ATTORNEY-CLIENT RELATIONSHIP. CREATIVE COMMONS PROVIDES THIS
+    INFORMATION ON AN "AS-IS" BASIS. CREATIVE COMMONS MAKES NO WARRANTIES
+    REGARDING THE USE OF THIS DOCUMENT OR THE INFORMATION OR WORKS
+    PROVIDED HEREUNDER, AND DISCLAIMS LIABILITY FOR DAMAGES RESULTING FROM
+    THE USE OF THIS DOCUMENT OR THE INFORMATION OR WORKS PROVIDED
+    HEREUNDER.
+
+Statement of Purpose
+
+The laws of most jurisdictions throughout the world automatically confer
+exclusive Copyright and Related Rights (defined below) upon the creator
+and subsequent owner(s) (each and all, an "owner") of an original work of
+authorship and/or a database (each, a "Work").
+
+Certain owners wish to permanently relinquish those rights to a Work for
+the purpose of contributing to a commons of creative, cultural and
+scientific works ("Commons") that the public can reliably and without fear
+of later claims of infringement build upon, modify, incorporate in other
+works, reuse and redistribute as freely as possible in any form whatsoever
+and for any purposes, including without limitation commercial purposes.
+These owners may contribute to the Commons to promote the ideal of a free
+culture and the further production of creative, cultural and scientific
+works, or to gain reputation or greater distribution for their Work in
+part through the use and efforts of others.
+
+For these and/or other purposes and motivations, and without any
+expectation of additional consideration or compensation, the person
+associating CC0 with a Work (the "Affirmer"), to the extent that he or she
+is an owner of Copyright and Related Rights in the Work, voluntarily
+elects to apply CC0 to the Work and publicly distribute the Work under its
+terms, with knowledge of his or her Copyright and Related Rights in the
+Work and the meaning and intended legal effect of CC0 on those rights.
+
+1. Copyright and Related Rights. A Work made available under CC0 may be
+protected by copyright and related or neighboring rights ("Copyright and
+Related Rights"). Copyright and Related Rights include, but are not
+limited to, the following:
+
+  i. the right to reproduce, adapt, distribute, perform, display,
+     communicate, and translate a Work;
+ ii. moral rights retained by the original author(s) and/or performer(s);
+iii. publicity and privacy rights pertaining to a person's image or
+     likeness depicted in a Work;
+ iv. rights protecting against unfair competition in regards to a Work,
+     subject to the limitations in paragraph 4(a), below;
+  v. rights protecting the extraction, dissemination, use and reuse of data
+     in a Work;
+ vi. database rights (such as those arising under Directive 96/9/EC of the
+     European Parliament and of the Council of 11 March 1996 on the legal
+     protection of databases, and under any national implementation
+     thereof, including any amended or successor version of such
+     directive); and
+vii. other similar, equivalent or corresponding rights throughout the
+     world based on applicable law or treaty, and any national
+     implementations thereof.
+
+2. Waiver. To the greatest extent permitted by, but not in contravention
+of, applicable law, Affirmer hereby overtly, fully, permanently,
+irrevocably and unconditionally waives, abandons, and surrenders all of
+Affirmer's Copyright and Related Rights and associated claims and causes
+of action, whether now known or unknown (including existing as well as
+future claims and causes of action), in the Work (i) in all territories
+worldwide, (ii) for the maximum duration provided by applicable law or
+treaty (including future time extensions), (iii) in any current or future
+medium and for any number of copies, and (iv) for any purpose whatsoever,
+including without limitation commercial, advertising or promotional
+purposes (the "Waiver"). Affirmer makes the Waiver for the benefit of each
+member of the public at large and to the detriment of Affirmer's heirs and
+successors, fully intending that such Waiver shall not be subject to
+revocation, rescission, cancellation, termination, or any other legal or
+equitable action to disrupt the quiet enjoyment of the Work by the public
+as contemplated by Affirmer's express Statement of Purpose.
+
+3. Public License Fallback. Should any part of the Waiver for any reason
+be judged legally invalid or ineffective under applicable law, then the
+Waiver shall be preserved to the maximum extent permitted taking into
+account Affirmer's express Statement of Purpose. In addition, to the
+extent the Waiver is so judged Affirmer hereby grants to each affected
+person a royalty-free, non transferable, non sublicensable, non exclusive,
+irrevocable and unconditional license to exercise Affirmer's Copyright and
+Related Rights in the Work (i) in all territories worldwide, (ii) for the
+maximum duration provided by applicable law or treaty (including future
+time extensions), (iii) in any current or future medium and for any number
+of copies, and (iv) for any purpose whatsoever, including without
+limitation commercial, advertising or promotional purposes (the
+"License"). The License shall be deemed effective as of the date CC0 was
+applied by Affirmer to the Work. Should any part of the License for any
+reason be judged legally invalid or ineffective under applicable law, such
+partial invalidity or ineffectiveness shall not invalidate the remainder
+of the License, and in such case Affirmer hereby affirms that he or she
+will not (i) exercise any of his or her remaining Copyright and Related
+Rights in the Work or (ii) assert any associated claims and causes of
+action with respect to the Work, in either case contrary to Affirmer's
+express Statement of Purpose.
+
+4. Limitations and Disclaimers.
+
+ a. No trademark or patent rights held by Affirmer are waived, abandoned,
+    surrendered, licensed or otherwise affected by this document.
+ b. Affirmer offers the Work as-is and makes no representations or
+    warranties of any kind concerning the Work, express, implied,
+    statutory or otherwise, including without limitation warranties of
+    title, merchantability, fitness for a particular purpose, non
+    infringement, or the absence of latent or other defects, accuracy, or
+    the present or absence of errors, whether or not discoverable, all to
+    the greatest extent permissible under applicable law.
+ c. Affirmer disclaims responsibility for clearing rights of other persons
+    that may apply to the Work or any use thereof, including without
+    limitation any person's Copyright and Related Rights in the Work.
+    Further, Affirmer disclaims responsibility for obtaining any necessary
+    consents, permissions or other rights required for any use of the
+    Work.
+ d. Affirmer understands and acknowledges that Creative Commons is not a
+    party to this document and has no duty or obligation with respect to
+    this CC0 or use of the Work.

README.md

@@ -0,0 +1,117 @@
+![image](https://user-images.githubusercontent.com/103902448/164163511-37d22660-905c-4355-a6f4-91c6eee2d1a4.png)
+# Unemployables Portfolio Template
+A template for the Unemployables who need to showcase their creative work, whatever that may be.
+<br /><br />
+**Demo:** https://ndoherty-xyz.github.io/unemployables-portfolio-template/
+<br />
+<br />
+
+#### Table of Contents:
+<a href="https://github.com/ndoherty-xyz/unemployables-portfolio-template#about-this-template">About this template</a></br>
+<a href="https://github.com/ndoherty-xyz/unemployables-portfolio-template#getting-started">Getting started</a></br>
+<a href="https://github.com/ndoherty-xyz/unemployables-portfolio-template#how-to-customize-this-template">How to customize this template</a></br>
+&nbsp;&nbsp;&nbsp;<a href="https://github.com/ndoherty-xyz/unemployables-portfolio-template#creating-a-new-project-page-and-adding-it-to-the-homepage">Creating a new project page</a></br>
+&nbsp;&nbsp;&nbsp;<a href="https://github.com/ndoherty-xyz/unemployables-portfolio-template#adding-images-to-the-project-gallery">Adding gallery images</a></br>
+<a href="https://github.com/ndoherty-xyz/unemployables-portfolio-template#publishing-with-github-pages">Publishing with Github Pages</a></br>
+<br />
+<br />
+
+## About this template
+After seeing the mission of Unemployables (https://unemployables.io/) to help people become self-employed and grow their businesses, I immediately thought about helping people build portfolios. It's something that I've helped friends with in the past and really enjoyed doing. <br /><br />
+This template is mobile friendly, so you won't have to worry about your site not working on phones.
+<br />
+<br />
+
+**The goals of this template are:**
+- To be a starting point for someone who's never touched web development but wants to build their own portfolio website. 
+- Help keep costs of running a portfolio website low by publishing the website on Github Pages for free (instructions further down).
+<br />
+<br />
+
+## Getting started
+**If you haven't used Git / Github before, here's some guides to get you started:**
+- Basics of git: https://www.freecodecamp.org/news/learn-the-basics-of-git-in-under-10-minutes-da548267cc91/
+- Forking a repository: https://docs.github.com/en/get-started/quickstart/fork-a-repo
+<br />
+
+**Template instructions:**
+1. Click the `Use As Template` button above and name your new repository (it should be set to public).
+2. Clone your newly created repo to your local machine.
+3. Navigate to the cloned repo on your machine and open `index.html` with your browser.
+4. Open the repo folder in your favorite code editor and start editing. (Make sure to refresh the browser to see the code changes you make!)
+5. Publish your site by pushing your commits to your repo.
+6. Set up Github Pages (guide further down!)
+<br />
+<br />
+
+## How to customize this template
+**All changes that need to be made are commented in the code with a `TODO` tag.**
+Search for it and you'll find all the changes you need to make. That being said, there are some high level things to know:
+
+- Image assets that you add for projects, header photo, or the favicon should go in the `assets/images` folder
+- For every new project page, make a copy of `project-template.html` and keep it in the `project-pages` folder
+- All styling is located in the `css` folder, have at it if you feel like changing up the styling.
+- The `js` folder holds one script file that you can add any custom Javascript into.
+<br />
+
+### Creating a new project page and adding it to the homepage
+1. Make a copy of `project-template.html` in the `project-pages` folder and rename it to `<project-name>.html`
+2. Open `index.html` and find the `div` with `className='project-container'`
+3. Add a new project card into that div. Here's the template for a project card:
+```
+  <div class="project-card">
+    <img src="./assets/images/IMAGE_NAME" class="project-image">
+    <div class="project-card-text-container">
+      <div class="subheader-text project-title">PROJECT_NAME</div>
+      <div class="body-text project-card-text">SMALL_PROJECT_DESCRIPTION</div>
+    </div>
+    <a class="button" href="./project-pages/PROJECT_PAGE_NAME.html">
+      <span class="button-text">Read More</span>
+      <image src="./assets/icons/arrow-right.svg" class="right-arrow-icon"/>
+    </a>
+  </div>
+```
+4. Change `PROJECT_PAGE_NAME.html` to the name of the new html file you copied from the project template
+5. The project page is now linked to the homepage! Customize the page and `"project-card"` to your heart's content. 
+<br />
+
+### Adding images to the project gallery
+1. Make sure the images that you want to show are added to the `assets/images` folder
+2. Open the project page you want to edit and find the `div` with `class="project-gallery-content"`
+3. To add an image, copy one of the two templates below and paste them into the `project-gallery-content`
+```
+Full Width Image:
+
+    <div class="gallery-image-container">
+      <img src="../assets/images/IMAGE_NAME" class="gallery-image">
+      <span class="image-caption">IMAGE_CAPTION</span>
+    </div>
+
+
+Half Width Image:
+
+    <div class="gallery-image-container half-width">
+      <img src="../assets/images/IMAGE_NAME" class="gallery-image">
+      <span class="image-caption">IMAGE_CAPTION</span>
+    </div>
+```
+4. Change IMAGE_NAME to the filename of the image you added to `assets/images` and IMAGE_CAPTION to whatever caption you want (or remove it, I don't mind)
+5. Refresh the project page in your browser and boom! Your image has been added to the gallery.
+<br />
+<br />
+
+## Publishing with Github Pages
+Github Pages allows us to host this website for free! It's pretty simple to set up as well.
+
+1. Head to `Settings` on the repository
+2. The repository will need to be public for this work (if it's not, navigate to `General` and scroll all the way down to `Change repository visibility`. Make it public)
+3. Navigate to `Pages` in the sidebar
+5. For `Source` choose `main` from the dropdown. Save the changes.
+6. That's it! Github should give you a URL that your website is published on (give it a few minutes to update).
+7. To add a custom domain (i.e. yourname.com), follow this guide: https://medium.com/codex/add-a-custom-domain-to-your-github-pages-personal-website-53ab40e7c7d0
+<br />
+<br />
+
+## That's it!
+Feel free to send me pictures of your portfolio website once it's up and running. Would love to see them!
+https://twitter.com/ndoherty_xyz