├── .gitignore ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── Workflow.md ├── accessories.html ├── asset-gathering.md ├── audio.html ├── computers.html ├── css ├── computers.css ├── global_styles.css ├── products.css ├── sidebar_styles.css ├── styles.css └── variables.css ├── favicon.ico ├── img ├── boy_review.png ├── carousel_img │ ├── caraousel_comp_01.jpg │ ├── caraousel_drone_01.jpg │ ├── caraousel_drone_02.jpg │ ├── caraousel_headphones_01.jpg │ ├── caraousel_headphones_02.jpg │ ├── elects_banner.png │ └── home-banner.jpg ├── computer-home.jpg ├── computer-travel.jpg ├── computer-work.jpg ├── favicon.ico ├── friends_01.jpg ├── friends_02.jpg ├── friends_03.png ├── friends_04.jpg ├── labels │ ├── big-sale-offers.png │ ├── discount_01.png │ ├── discount_02.png │ ├── discount_03.png │ ├── discount_04.png │ ├── discount_05.png │ ├── free_01.png │ ├── free_02.png │ ├── free_03.png │ ├── sale_01.png │ ├── sale_02.png │ ├── sale_03.png │ ├── sale_04.png │ ├── sale_05.png │ └── sale_06.png ├── products │ ├── Computer-Pc-Monitor-Imac-Screen-Personal-Computer-2493287.png │ ├── accessories │ │ ├── tech_access_01.jpg │ │ ├── tech_access_02.jpg │ │ ├── tech_access_03.png │ │ ├── tech_access_04.png │ │ ├── tech_access_05.png │ │ └── tech_access_06.jpg │ ├── audio │ │ ├── a12b50ml8.jpg │ │ ├── bfs-900.jpg │ │ ├── bfs-99x.jpg │ │ ├── h-402m-blk.jpg │ │ ├── h7902.jpg │ │ ├── headphones_01.jpg │ │ ├── headphones_02.png │ │ ├── headphones_03.jpeg │ │ ├── headphones_04.png │ │ ├── headphones_05.png │ │ ├── headphones_06.jpg │ │ ├── headphones_07.jpg │ │ ├── headphones_08.jpg │ │ ├── headphones_09.jpg │ │ ├── headphones_10.jpg │ │ ├── headphones_11.jpg │ │ ├── headphones_11.png │ │ ├── headphones_12.png │ │ ├── headphones_13.png │ │ ├── headphones_14.png │ │ ├── headphones_15.png │ │ ├── headphones_16.png │ │ ├── headphones_17.png │ │ ├── headphones_18.png │ │ └── speaker_01.png │ ├── audio_setup.jpg │ ├── club-back.jpg │ ├── computer_options.jpg │ ├── consumer-electronics.png │ ├── controller_01.jpeg │ ├── cooldj.png │ ├── dj.png │ ├── drone_01.jpg │ ├── drone_02.png │ ├── drone_03.png │ ├── ecommerce-store.jpg │ ├── ecommerce_sales.jpg │ ├── electronics.png │ ├── electronics_01.png │ ├── electronics_02.png │ ├── family_01.png │ ├── girl-laptop1.png │ ├── girl-laptop2.png │ ├── girl-laptop3.png │ ├── girl.png │ ├── girl_01.png │ ├── hp-pavilion.jpg │ ├── imac.png │ ├── images.jpg │ ├── img0677.png │ ├── kids_busy.png │ ├── laptop_01.jpg │ ├── laptop_01.png │ ├── laptop_02.jpg │ ├── laptop_02.png │ ├── laptop_03.png │ ├── male_01.png │ ├── male_02.png │ ├── phone_01.png │ ├── product.png │ ├── products.png │ ├── ps4.png │ ├── screens.png │ ├── tablet_01.jpg │ ├── tablet_02.jpg │ ├── tablet_03.jpg │ ├── tablet_04.jpg │ ├── tablet_05.jpg │ ├── tablet_06.jpg │ └── tablet_07.jpg ├── rating-star.png ├── site-so-far.jpg ├── team │ └── clone_download.jpg ├── tech_family.png ├── user_female_01.jpg ├── user_male_01.jpg └── user_male_02.jpg ├── inc ├── content.php ├── footer.php ├── header.php ├── home.php └── nav.php ├── index.html ├── index.php ├── js ├── checkout.js ├── main.js ├── products.js └── ratings.js ├── onsale.html ├── product.html ├── product.php ├── ratings.html ├── rb ├── .gitignore ├── 1-24.png ├── 2-16.png ├── 2-6.png ├── 2-7.png ├── README.md ├── css │ ├── bootstrap.min.css │ ├── fa-all.css │ ├── main.css │ └── style.css ├── data │ ├── data.csv │ ├── data.json │ ├── data.ods │ └── data.txt ├── demo.html ├── home.html ├── index.html ├── js │ ├── app.js │ ├── bootstrap.min.js │ ├── csv-parse.js │ ├── functions.js │ ├── index.js │ ├── jquery-3.3.1.js │ ├── jquery-3.3.1.slim.min.js │ ├── nav.js │ ├── products.js │ ├── rb-demo.js │ ├── useful.js │ ├── vm-app.js │ ├── vue-app.js │ └── vue.js ├── product.html ├── rb-logo.jpg └── vm.html └── wireframes ├── categories.jpg ├── proto.png └── single-product.png /.gitignore: -------------------------------------------------------------------------------- 1 | *.old 2 | 3 | # General 4 | .DS_Store 5 | .AppleDouble 6 | .LSOverride 7 | 8 | 9 | # Editors 10 | .vscode 11 | .code-workspace 12 | 13 | 14 | # Local Servers 15 | dashboard 16 | webalizer 17 | xampp 18 | config.php 19 | connection.php 20 | 21 | 22 | # Icon must end with two \r 23 | Icon 24 | 25 | 26 | # Thumbnails 27 | ._* 28 | 29 | # Files that might appear in the root of a volume 30 | .DocumentRevisions-V100 31 | .fseventsd 32 | .Spotlight-V100 33 | .TemporaryItems 34 | .Trashes 35 | .VolumeIcon.icns 36 | .com.apple.timemachine.donotpresent 37 | 38 | # Directories potentially created on remote AFP share 39 | .AppleDB 40 | .AppleDesktop 41 | Network Trash Folder 42 | Temporary Items 43 | .apdisk 44 | phpsandbox 45 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # CONTRIBUTING 2 | 3 | Below are details on how to contribute to the project. If you have any questions, you can always ask by creating an **Issue** here in the repository. 4 | 5 | 6 | Following these guidelines helps to communicate that you respect the time of the developers managing and developing this open source project. In return, they should reciprocate that respect in addressing your issue, assessing changes, and helping you finalize your pull requests. 7 | 8 | ## Your First Contribution 9 | 10 | ### Getting started 11 | If you are a first time contributor, acknowledge that a healthy understanding of the fundamentals of git and collaborating on Github are necessary and required. There are helpful tutorials on both in the [README](https://github.com/GWGweb-projectgroup/practice-project/blob/master/README.md) file. 12 | 13 | Here are a couple of friendly tutorials to look over 14 | 15 | * [Make A Pull Request](http://makeapullrequest.com/) 16 | * [First Timers Only](http://www.firsttimersonly.com/) 17 | * Free tutorial series: [How to Contribute to an Open Source Project on GitHub](https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github) 18 | 19 | ### The workflow 20 | 21 | >If you have time, also refer to the [GitHub Flow](https://guides.github.com/introduction/flow/) workflow, which is similar and recommended 22 | 23 | 1. Fork this repository **GWGweb-projectgroup/practice-project** into your own GitHub account 24 | 25 | 2. Clone that forked copy of the **practice-project** repo onto your local machine 26 | 27 | 3. On your machine, add an upstream to the main repo to help pull our master branch to your machine 28 | 29 | ``` 30 | git remote add upstream https://github.com/GWGweb-projectgroup/practice-project.git 31 | ``` 32 | 33 | Whenever you want to pull our latest changes 34 | 35 | ``` 36 | git pull upstream master 37 | ``` 38 | 39 | 4. Create a separate branch in your repository to begin the work, preferably using **yourname-dev** syntax, I would write 40 | 41 | ``` 42 | git checkout -b chrisvneal-dev 43 | ``` 44 | 45 | 5. Push your commits to your GitHub repository 46 | 47 | ``` 48 | git push -u origin [name-of-your-branch] 49 | ``` 50 | 51 | The **-u** is to indicate that that branch will be an "upstream" branch: so that now whenever you want to push changes you can just type ```git push``` 52 | 53 | 6. Make the pull request to the necessary branch on our main repo and the **Git Assistance** team will handle everything from there _(reviewing and merging code)_ 54 | 55 |
56 | 57 | > NOTE: Making a pull request for the **[master]** branch is ok for now, however when we begin adding more files and merging code, please pull request for the **[dev]** branch! 58 | 59 |
60 | 61 | >NOTE: We will aslo be using the pull request feature as a means of discussing code issues during review and going over ideas. Even if you have a feature you want to discuss with others, make a pull request and explain your feature and we can take it from there! 62 | 63 |
64 | 65 | ## Code review process 66 | Members of the **Git Assistance** team will be reviewing code to be merged into our branches, especially the master. If you have experience with this, [join the team](https://github.com/GWGweb-projectgroup/practice-project#project-team-sign-up)! 67 | 68 | As we all have varying time constraints, someone will get to your pull request and review in a timely manner. We are all here to help each other and get your code through! 69 | 70 | After feedback has been given, we expect responses and any changes to be made within a few days from feedback. After that period, we may close the pull request if it isn't showing any activity or isn't something we can fix ourselves. 71 | 72 |
73 | 74 | ## Commit message & branch naming conventions 75 | 76 | * We really don't have any conventions on commit messages, but I heard it was useful to use an "imperative" tone.

77 | "```add stylesheet link to index.html```" would be a good commit message if you added a link in the index.html file, for example. Other than, it really doesn't matter. Come up with a style that is meaningful to you. 78 | 79 | * To reiterate branch naming, branches you create from **[master]** could be

80 | ```yourname-dev```

81 | Or whatever you like, just make sure you push to the right branch. 82 | 83 |
84 | 85 | Thank you for reviewing the CONTRIBUTING.md file, if you are a contributor and have feedback or issues, make a pull request with your changes or ask myself **@chrisvneal** using an Issue. 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | BSD 2-Clause License 2 | 3 | Copyright (c) 2018, GwG Web Project Group 4 | All rights reserved. 5 | 6 | Redistribution and use in source and binary forms, with or without 7 | modification, are permitted provided that the following conditions are met: 8 | 9 | * Redistributions of source code must retain the above copyright notice, this 10 | list of conditions and the following disclaimer. 11 | 12 | * Redistributions in binary form must reproduce the above copyright notice, 13 | this list of conditions and the following disclaimer in the documentation 14 | and/or other materials provided with the distribution. 15 | 16 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" 17 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 18 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 19 | DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE 20 | FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL 21 | DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR 22 | SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER 23 | CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, 24 | OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 25 | OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 26 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Welcome! 2 | 3 | Welcome to the **GWGweb-projectgroup** _practice project_ repository! 4 | 5 | The purpose of this **practice repository** is to get comfortable using the front end skills we've learned so far. Also to gain experience using & collaborating with **git** and the **GitHub** online repository service. If you don't have one already, please [create a GitHub account](http://www.github.com) as it is required to contribute to the project. 6 | 7 | :warning: **IMPORTANT: Please fork this repository to _your_ account and work as you would locally from there.** Please refer to the [CONTRIBUTING](https://github.com/GWGweb-projectgroup/practice-project/blob/master/CONTRIBUTING.md) file for more information. 8 | 9 | ## Progress 10 | This section will be updated so that any newcomers can quickly view the progress of our project! 11 | 12 | [view the website](https://gwgweb-projectgroup.github.io/practice-project/) _(in progress)_ 13 | 14 | ![](img/site-so-far.jpg) 15 | 16 | 17 | ### Table of Contents 18 | 19 | [Learning Git and GitHub](#learning-git-and-github) 20 | 21 | [Current Group Tasks and Deadlines](#current-group-tasks-and-deadlines) 22 | 23 | [Project Goals](#project-goals) 24 | 25 | [Project Team Sign Up](#project-team-sign-up) 26 | 27 | [Teams](#teams) 28 | 29 | 30 | ## Learning Git and Github 31 | If you haven't already, please begin learning **the fundamentals of git** and **collaborating on GitHub**. Most of the fundamental learning will involve using git on your local machine and we will be using GitHub's collaborative features to build together. 32 | 33 | > #### This is necessary, especially if you plan to contribute code to the project. 34 | 35 | 36 | ### Git and GitHub Learning Resources 37 | Here's some links that were passed around in the forums that I believe are some of the best and I added some that really got me on track with making pull requests and stuff (**SPOILER**: it's easy!). 38 | 39 | * [Udacity Course: How To Use Git and GitHub](https://www.udacity.com/course/how-to-use-git-and-github--ud775) *(course)* 40 | 41 | * [How Not To F- Up Your Local Files w/ Git pt 1](https://medium.com/@francesco.agnoletto/how-to-not-f-up-your-local-files-with-git-part-1-e0756c88fd3c) *(article)* 42 | * [GitHub Help Guide: Forking Projects](https://guides.github.com/activities/forking/) *(article)* 43 | * [YouTube: Creating A Simple Github Pull Request](https://www.youtube.com/watch?v=rgbCcBNZcdQ) *(video)* 44 | * [Youtube: Git & GitHub Tutorial for Beginners #11 - Collaborating on GitHub](https://www.youtube.com/watch?v=MnUd31TvBoU&t=402s) *(#12, too! video)* 45 | * [How To Collaborate on GitHub](https://code.tutsplus.com/tutorials/how-to-collaborate-on-github--net-34267) *(article)* 46 | * [Git Forks and Upstreams](https://www.atlassian.com/git/articles/git-forks-and-upstreams) *(article)* 47 | 48 | 49 | 50 | [[back to top]](#readme) 51 | 52 | 53 | ## Current Group Tasks and Deadlines 54 | 55 | * We have **1 week** *(by March 10th or 11th)* to [choose a team](#project-team-sign-up) to contribute with. How would you like to contribute? **More details below.** 56 | 57 | * Take as much time as you need to understand the basics of git and collaborating, but I'm hoping in about a week or so we will 58 | * Know and understand the fundamentals of git and collaborating on GitHub 59 | * Establish main idea for website 60 | * Create somewhat of an initial layout/design of the main page 61 | 62 | ## Project Goals 63 | * Learn git/GitHub & web development in a "remote group environment" 64 | * Create a simple project; **1-2 pages** *w/ room to expand* 65 | * Practice what we've learned so far in the course 66 | * Be challenged! Not overwhelmed 67 | * Work in small teams, hoping everyone will have a meaningful role 68 | 69 | 70 | ## Project Team Sign Up 71 | 72 | > **Instruction:** Let's keep this process simple! 73 | > 74 | >The only change you will be making for now is adding your name to whichever team you'd like to contribute with using the format below. Add your name to a team and push your changes to the main repo's **dev** branch, creating a pull request. Once approved, the changes will be merged 75 | 76 | **This syntax creates a table in Markdown, all you have to do is edit/insert your information like so:** 77 | 78 | ``` 79 | Name | Disc Forum @ | Slack @ | Link (optional) 80 | ----- | ----- | ----- | ----- 81 | (your name) | (your @) | your @ | optional link 82 | ``` 83 | You'll get it when you see how others have done it. If not, just ask someone. This list will determine who the contributors are for this project. Adding your name to a table is as easy as separating your info with the **pipe** character like this: 84 | 85 | ```name | disc forum name | slack name | (optional link) ``` 86 | 87 | 88 | >#### You can be on more than one team, just make sure there are enough duties for everyone to contribute meaningfully. 89 | 90 | [[back to top]](#readme) 91 | 92 | --- 93 | 94 | ### Teams 95 | 96 | * [Wireframe and layout design](#wireframe-and-layout-design) 97 | * [Initial HTML Development](#initial-html-development) 98 | * [HTML refactoring and optimization](#html-refactoring-and-optimization) 99 | * [CSS refactoring and optimization](#css-refactoring-and-optimization) 100 | * [JavaScript refactoring and optimization](#javascript-refactoring-and-optimization) 101 | * [Asset Gathering](#asset-gathering) 102 | * [Copy and grammar editing](#copy-and-grammar-editing) 103 | * [Git assistance](#git-assistance) 104 | 105 | ### Wireframe and layout design 106 | Contributors in this group will create a mockup/wireframe/sketch of what the site would look like and would most likely be **initiating CSS styling**. 107 | 108 | Name | Disc Forum @ | Slack @ | Link (optional) 109 | ----- | ----- | ----- | ----- 110 | Ivan Huddleston | taskmaster | taskmaster | [github/elementWebDev](https://github.com/elementWebDev) 111 | 112 | ### Initial HTML development 113 | Contributors in this group will work with the wireframe and layout design team to create the initial *index.html* file. 114 | 115 | Name | Disc Forum @ | Slack @ | Link (optional) 116 | ----- | ----- | ----- | ----- 117 | Dionne Petty | | @Dionne | [github/ddpetty](https://github.com/ddpetty) 118 | Ivan Huddleston | taskmaster | taskmaster | [github/elementWebDev](https://github.com/elementWebDev) 119 | Chris Neal | chrisneal | Chris N | [github/chrisvneal](https://github.com/chrisvneal/GWGpractice) 120 | 121 | 122 | ### HTML refactoring and optimization 123 | Contributors in this group will refactor and optimize the structure and semantics of the ***index.html*** file *(checking syntax errors, etc.)* 124 | 125 | Name | Disc Forum @ | Slack @ | Link (optional) 126 | ----- | ----- | ----- | ----- 127 | Chris Neal | chrisneal | Chris N | [github/chrisvneal](https://github.com/chrisvneal/GWGpractice) 128 | Ivan Huddleston | taskmaster | taskmaster | [github/elementWebDev](https://github.com/elementWebDev) 129 | Dionne Petty | | @Dionne | [github/ddpetty](https://github.com/ddpetty) 130 | 131 | 132 | ### CSS refactoring and optimization 133 | Contributors in this group will refactor and optimize the structure and semantics of the ***stylesheet*** file *(checking syntax errors, etc.)* 134 | 135 | Name | Disc Forum @ | Slack @ | Link (optional) 136 | ----- | ----- | ----- | ----- 137 | Chris Neal | chrisneal | Chris N | [github/chrisvneal](https://github.com/chrisvneal/GWGpractice) 138 | Ivan Huddleston | taskmaster | taskmaster | [github/elementWebDev](https://github.com/elementWebDev) 139 | Cynthia Clinton | cclinc2005jz5kd | @Cynthia | [github/Cynth42](https://github.com/Cynth42) 140 | Dionne Petty | | @Dionne | [github/ddpetty](https://github.com/ddpetty) 141 | Megan Spaulding | | @Megan Spaulding | [github/meganspauldingcreative](https://github.com/meganspauldingcreative) 142 | 143 | ### JavaScript refactoring and optimization 144 | Contributors in this group will refactor and optimize the structure and semantics of the ***.js*** file, ensuring best practices *(checking syntax errors, etc.)* Contributors may also choose to **initiate interactivity scripting** when necessary. 145 | 146 | Name | Disc Forum @ | Slack @ | Link (optional) 147 | ----- | ----- | ----- | ----- 148 | Cynthia Clinton | cclinc2005jz5kd | @Cynthia | [github/Cynth42](https://github.com/Cynth42) 149 | Dionne Petty | | @Dionne | [github/ddpetty](https://github.com/ddpetty) 150 | Ivan Huddleston | taskmaster | taskmaster | [github/elementWebDev](https://github.com/elementWebDev) 151 | Chris Neal | chrisneal | Chris N | [github/chrisvneal](https://github.com/chrisvneal/GWGpractice) 152 | 153 | ### Asset gathering 154 | Contributors in this group will gather resources for images, icons, and media pertaining to the main concept while working closely with the ***wireframe layout*** and ***index.html*** teams for guidance. 155 | 156 | Name | Disc Forum @ | Slack @ | Link (optional) 157 | ----- | ----- | ----- | ----- 158 | Ivan Huddleston | taskmaster | taskmaster | [github/elementWebDev](https://github.com/elementWebDev) 159 | Chris Neal | chrisneal | Chris N | [github/chrisvneal](https://github.com/chrisvneal/GWGpractice) 160 | 161 | ### Copy and grammar editing 162 | Contributors in this group will help spot grammatical and spelling errors within the site's body & content. 163 | 164 | Name | Disc Forum @ | Slack @ | Link (optional) 165 | ----- | ----- | ----- | ----- 166 | Chris Neal | chrisneal | Chris N | [github/chrisvneal](https://github.com/chrisvneal/GWGpractice) 167 | 168 | ### Git Assistance 169 | Contributors in this group will 170 | 171 | * help manage the main project repo *practice-project* 172 | * help others with git and pull requests on Github and 173 | * *help with code review* of any code before it gets merged into the main project branch, **master**. 174 | 175 | Name | Disc Forum @ | Slack @ | Link (optional) 176 | ----- | :-----: | :-----: | :----- 177 | Chris Neal | chrisneal | Chris N | [github/chrisvneal](https://github.com/chrisvneal/GWGpractice) 178 | 179 | [[back to top]](#readme) 180 | -------------------------------------------------------------------------------- /Workflow.md: -------------------------------------------------------------------------------- 1 | Short of a full tutorial, I'd like to explain how a pull request would work for us. If you don't understand the basics of _git/version control_ and using **GitHub** to collaborate, please refer to [these resources in the README file](https://github.com/chrisvneal/practice-project#learning-git-and-github) to get up to speed. 2 | 3 | Here is a quick run down of how to contribute to this project. 4 | 5 | ## 1. Fork the main project repo 6 | 7 | 1. **Do not fork my copy!** lol Visit [GWGweb-projectgroup/practice-project](https://github.com/GWGweb-projectgroup/practice-project) 8 | 9 | 2. **"Fork the repo"**. This means you have to click the fork icon at the top right of the page. This will make a copy of our project, take you back to _your own GitHub account_ and copy it there. Same project, same files, same everything. Now you can work on the project from your own environment! 10 | 11 |
12 | 13 | ## 2. Clone your copy 14 | 1. Click the **"Clone or download"** button. This will give you options for dowloading all the files to your local machine. 15 | 16 | ![](img/team/clone_download.jpg) 17 | 18 | 2. If you want to clone using your terminal, open the terminal, navigate to where you want to dump the files. It will create its own folder so putting it in your _[open-source_projects]_ folder is fine. Copy the link, https://github.com/GWGweb-projectgroup/practice-project.git 19 | and in your terminal where you want to put the project type 20 | 21 | ```git clone https://github.com/GWGweb-projectgroup/practice-project.git``` and pess Enter. You should now be on the **[master]** branch of your copy of the project. 22 | 23 |
24 | 25 | ## 3. Create an "upstream" to the main repo 26 | In order to stay up to date with what's going on and keeping your **master** code current, create an _upstream_ to the main project repository so that you can easily pull in the latest changes to your local copy. Doing this will allow you to create a separate branch and work from the most current project state avoiding a lot of complications down the road. 27 | 28 | 1. In your terminal type 29 | 30 | ```git remote add upstream https://github.com/GWGweb-projectgroup/practice-project.git``` 31 | 32 | 2. Whenever you feel there's been changes to our **master**, just type 33 | 34 | ```git pull upstream master``` and that should pull the current code down from our **[master]** branch. 35 | 36 |
37 | 38 | ## 4. Make a separate branch to work on 39 | 1. To always have a clean copy to work from, leave your copy's **[master]** branch alone and create a separate branch to work on by typing 40 | 41 | ```git checkout -b [yourname-dev]``` 42 | 43 | >_That branch syntax is preferred, but call it whatever you like_! 44 | 45 | 2. Now you're free to play around and make changes as you see fit 46 | 47 | >IMPORTANT: Pull the main repo's **[master]** branch onto your machine everytime before you begin working on additions, ensuring your working with the latest changes. 48 | 49 |
50 | 51 | ## 5. Push your separate branch up to your GitHub account 52 | 1. Any serious changes should be committed and pushed to your online GitHub copy of the project repo by typing in the terminal 53 | 54 | ```git push -u origin [this branch name]``` 55 | 56 | The ```origin``` was already created when you cloned this repo and the ```-u``` is creating an upstream to that repo. 57 | 58 | 2. Now whenever you want to push your changes, just type ```git push``` in that branch and it will do just that 59 | 60 |
61 | 62 | ## 6. Make a pull request 63 | This part usually trips people up, but it's easy 64 | 65 | 1. When you go back to your copy of the repo on GitHub, it will prompt you to **make a pull request** and allow you to add some message. 66 | 67 | >IMPORTANT: Make sure your changes are going into to our **[dev]** branch and not the **[master]** branch. 68 | 69 | 2. When you click to make the pull request, it will take you to the main repo's copy to compare if you need to and confirm the request. If everything is good to go, you'll see green text confirming that a merge would be successful! 70 | 71 |
72 | 73 | 74 | ### Conclusion 75 | After this, members of the [**Git Assistance** team](https://github.com/GWGweb-projectgroup/practice-project#git-assistance) will review and accept the merge to the **[dev]** branch. I can help with any part of this process as I am also still learning git and GitHub so bear with me. All I ask is that you either refer to the resources mentioned earlier or get through this quick rundown for making a basic pul request. 76 | 77 | #### most used git commands 78 | * ```git pull upstream master``` 79 | 80 | * ```git checkout -b [yourname-dev]``` 81 | 82 | * ```git push -u origin [this branch name]``` 83 | 84 | * ```git push``` 85 | 86 | * On your branch separate from master, ```git merge master``` to copy the latest changes after you pull from the **_upstream_** _(main project repo)_ 87 | 88 | -------------------------------------------------------------------------------- /accessories.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | GwG eCommerce 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 64 | 65 | 66 |
67 |
68 | 74 | 75 |
76 | left side 77 |
78 | 79 | 80 |
81 | 82 |
83 | 91 | 99 | 107 |
108 | 109 | 110 |
111 |

Home

112 | 113 |
114 |
115 |
116 | Card image cap 117 |
118 |
Apple 21.5" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)
119 |

120 | 121 | star rating 122 | 123 | 124 | star rating 125 | 126 | 127 | star rating 128 | 129 | 130 | star rating 131 | 132 | 133 | star rating 134 | 135 | (20 reviews) 136 |

137 |
138 |
    139 |
  • Price: $1,049.00
  • 140 |
  • In Stock
  • 141 |
  • Ships in 24 hours
  • 142 |
143 | 146 |
147 |
148 | Card image cap 149 |
150 |
Dell XPS 14Z X14z-2310ELS 14-Inch Laptop (Elemental Silver)
151 |

152 | 153 | star rating 154 | 155 | 156 | star rating 157 | 158 | 159 | star rating 160 | 161 | 162 | star rating 163 | 164 | 165 | star rating 166 | 167 | (2 reviews) 168 |

169 |
170 |
    171 |
  • Refurbished Price: $349.99
  • 172 |
  • Out of Stock
  • 173 |
  • Ships in 48 hours
  • 174 |
175 | 178 |
179 |
180 | Card image cap 181 |
182 |
HP Pavilion DV 2000
183 |

184 | 185 | star rating 186 | 187 | (3 reviews) 188 |

189 |
190 |
    191 |
  • Refurbished Price: $499.00
  • 192 |
  • In Stock
  • 193 |
  • Ships in 24 hours
  • 194 |
195 | 198 |
199 |
200 |
201 |
202 | 203 | 204 | 205 |
206 |

Travel

207 | 208 |
209 |
210 |
211 | Card image cap 212 |
213 |
Apple 21.5" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)
214 |

215 | 216 | star rating 217 | 218 | 219 | star rating 220 | 221 | 222 | star rating 223 | 224 | 225 | star rating 226 | 227 | 228 | star rating 229 | 230 | (20 reviews) 231 |

232 |
233 |
    234 |
  • Price: $1,049.00
  • 235 |
  • In Stock
  • 236 |
  • Ships in 24 hours
  • 237 |
238 | 241 |
242 |
243 | Card image cap 244 |
245 |
Dell XPS 14Z X14z-2310ELS 14-Inch Laptop (Elemental Silver)
246 |

247 | 248 | star rating 249 | 250 | 251 | star rating 252 | 253 | 254 | star rating 255 | 256 | 257 | star rating 258 | 259 | 260 | star rating 261 | 262 | (2 reviews) 263 |

264 |
265 |
    266 |
  • Refurbished Price: $349.99
  • 267 |
  • Out of Stock
  • 268 |
  • Ships in 48 hours
  • 269 |
270 | 273 |
274 |
275 | Card image cap 276 |
277 |
HP Pavilion DV 2000
278 |

279 | 280 | star rating 281 | 282 | (3 reviews) 283 |

284 |
285 |
    286 |
  • Refurbished Price: $499.00
  • 287 |
  • In Stock
  • 288 |
  • Ships in 24 hours
  • 289 |
290 | 293 |
294 |
295 |
296 |
297 | 298 | 299 | 300 |
301 |

Work

302 | 303 |
304 |
305 |
306 | Card image cap 307 |
308 |
Apple 21.5" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)
309 |

310 | 311 | star rating 312 | 313 | 314 | star rating 315 | 316 | 317 | star rating 318 | 319 | 320 | star rating 321 | 322 | 323 | star rating 324 | 325 | (20 reviews) 326 |

327 |
328 |
    329 |
  • Price: $1,049.00
  • 330 |
  • In Stock
  • 331 |
  • Ships in 24 hours
  • 332 |
333 | 336 |
337 |
338 | Card image cap 339 |
340 |
Dell XPS 14Z X14z-2310ELS 14-Inch Laptop (Elemental Silver)
341 |

342 | 343 | star rating 344 | 345 | 346 | star rating 347 | 348 | 349 | star rating 350 | 351 | 352 | star rating 353 | 354 | 355 | star rating 356 | 357 | (2 reviews) 358 |

359 |
360 |
    361 |
  • Refurbished Price: $349.99
  • 362 |
  • Out of Stock
  • 363 |
  • Ships in 48 hours
  • 364 |
365 | 368 |
369 |
370 | Card image cap 371 |
372 |
HP Pavilion DV 2000
373 |

374 | 375 | star rating 376 | 377 | (3 reviews) 378 |

379 |
380 |
    381 |
  • Refurbished Price: $499.00
  • 382 |
  • In Stock
  • 383 |
  • Ships in 24 hours
  • 384 |
385 | 388 |
389 |
390 |
391 |
392 | 393 |
394 |
395 | 396 | 397 | 398 | 399 | 400 | 401 | 402 | 403 | 404 | 405 | 406 | 407 | -------------------------------------------------------------------------------- /asset-gathering.md: -------------------------------------------------------------------------------- 1 | ## Resources 2 | 3 | Resource | Link | Additional info 4 | ----- | ----- | ----- 5 | [Color Themes] | (https://color.adobe.com/explore/?filter=most-popular&time=month) | browse - customize 6 | [Fontawesome Icon Gallery] | (https://fontawesome.com/icons?d=gallery) | icons! 7 | [Stock Images] | (https://stock.adobe.com/images) | Need to vote - **contact Ivan** (paid subscriber) for final download 8 | [Bootstrap Grid] | (https://getbootstrap.com/docs/4.0/layout/grid/) | bootstrap layout 9 | [Dev Docs] | (https://devdocs.io) | All in one site -------------------------------------------------------------------------------- /audio.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | GwG eCommerce 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 64 | 65 | 66 |
67 |
68 | 74 | 75 |
76 | left side 77 |
78 | 79 | 80 |
81 | 82 |
83 | 91 | 99 | 107 |
108 | 109 | 110 |
111 |

Home

112 | 113 |
114 |
115 |
116 | Card image cap 117 |
118 |
Apple 21.5" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)
119 |

120 | 121 | star rating 122 | 123 | 124 | star rating 125 | 126 | 127 | star rating 128 | 129 | 130 | star rating 131 | 132 | 133 | star rating 134 | 135 | (20 reviews) 136 |

137 |
138 |
    139 |
  • Price: $1,049.00
  • 140 |
  • In Stock
  • 141 |
  • Ships in 24 hours
  • 142 |
143 | 146 |
147 |
148 | Card image cap 149 |
150 |
Dell XPS 14Z X14z-2310ELS 14-Inch Laptop (Elemental Silver)
151 |

152 | 153 | star rating 154 | 155 | 156 | star rating 157 | 158 | 159 | star rating 160 | 161 | 162 | star rating 163 | 164 | 165 | star rating 166 | 167 | (2 reviews) 168 |

169 |
170 |
    171 |
  • Refurbished Price: $349.99
  • 172 |
  • Out of Stock
  • 173 |
  • Ships in 48 hours
  • 174 |
175 | 178 |
179 |
180 | Card image cap 181 |
182 |
HP Pavilion DV 2000
183 |

184 | 185 | star rating 186 | 187 | (3 reviews) 188 |

189 |
190 |
    191 |
  • Refurbished Price: $499.00
  • 192 |
  • In Stock
  • 193 |
  • Ships in 24 hours
  • 194 |
195 | 198 |
199 |
200 |
201 |
202 | 203 | 204 | 205 |
206 |

Travel

207 | 208 |
209 |
210 |
211 | Card image cap 212 |
213 |
Apple 21.5" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)
214 |

215 | 216 | star rating 217 | 218 | 219 | star rating 220 | 221 | 222 | star rating 223 | 224 | 225 | star rating 226 | 227 | 228 | star rating 229 | 230 | (20 reviews) 231 |

232 |
233 |
    234 |
  • Price: $1,049.00
  • 235 |
  • In Stock
  • 236 |
  • Ships in 24 hours
  • 237 |
238 | 241 |
242 |
243 | Card image cap 244 |
245 |
Dell XPS 14Z X14z-2310ELS 14-Inch Laptop (Elemental Silver)
246 |

247 | 248 | star rating 249 | 250 | 251 | star rating 252 | 253 | 254 | star rating 255 | 256 | 257 | star rating 258 | 259 | 260 | star rating 261 | 262 | (2 reviews) 263 |

264 |
265 |
    266 |
  • Refurbished Price: $349.99
  • 267 |
  • Out of Stock
  • 268 |
  • Ships in 48 hours
  • 269 |
270 | 273 |
274 |
275 | Card image cap 276 |
277 |
HP Pavilion DV 2000
278 |

279 | 280 | star rating 281 | 282 | (3 reviews) 283 |

284 |
285 |
    286 |
  • Refurbished Price: $499.00
  • 287 |
  • In Stock
  • 288 |
  • Ships in 24 hours
  • 289 |
290 | 293 |
294 |
295 |
296 |
297 | 298 | 299 | 300 |
301 |

Work

302 | 303 |
304 |
305 |
306 | Card image cap 307 |
308 |
Apple 21.5" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)
309 |

310 | 311 | star rating 312 | 313 | 314 | star rating 315 | 316 | 317 | star rating 318 | 319 | 320 | star rating 321 | 322 | 323 | star rating 324 | 325 | (20 reviews) 326 |

327 |
328 |
    329 |
  • Price: $1,049.00
  • 330 |
  • In Stock
  • 331 |
  • Ships in 24 hours
  • 332 |
333 | 336 |
337 |
338 | Card image cap 339 |
340 |
Dell XPS 14Z X14z-2310ELS 14-Inch Laptop (Elemental Silver)
341 |

342 | 343 | star rating 344 | 345 | 346 | star rating 347 | 348 | 349 | star rating 350 | 351 | 352 | star rating 353 | 354 | 355 | star rating 356 | 357 | (2 reviews) 358 |

359 |
360 |
    361 |
  • Refurbished Price: $349.99
  • 362 |
  • Out of Stock
  • 363 |
  • Ships in 48 hours
  • 364 |
365 | 368 |
369 |
370 | Card image cap 371 |
372 |
HP Pavilion DV 2000
373 |

374 | 375 | star rating 376 | 377 | (3 reviews) 378 |

379 |
380 |
    381 |
  • Refurbished Price: $499.00
  • 382 |
  • In Stock
  • 383 |
  • Ships in 24 hours
  • 384 |
385 | 388 |
389 |
390 |
391 |
392 | 393 |
394 |
395 | 396 |
© 2018 GwG
397 | 398 | 399 | 400 | 401 | 402 | 403 | 404 | 405 | 406 | 407 | -------------------------------------------------------------------------------- /computers.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | GwG eCommerce 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 66 | 67 | 68 |
69 |
70 | 76 | 77 |
78 | left side 79 |
80 | 81 | 82 |
83 | 84 |
85 | 93 | 101 | 109 |
110 | 111 | 112 |
113 |

Home

114 | 115 |
116 |
117 |
118 | Card image cap 119 |
120 |
Apple 21.5" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)
121 |

122 | 123 | star rating 124 | 125 | 126 | star rating 127 | 128 | 129 | star rating 130 | 131 | 132 | star rating 133 | 134 | 135 | star rating 136 | 137 | (20 reviews) 138 |

139 |
140 |
    141 |
  • Price: $1,049.00
  • 142 |
  • In Stock
  • 143 |
  • Ships in 24 hours
  • 144 |
145 | 148 |
149 |
150 | Card image cap 151 |
152 |
Dell XPS 14Z X14z-2310ELS 14-Inch Laptop (Elemental Silver)
153 |

154 | 155 | star rating 156 | 157 | 158 | star rating 159 | 160 | 161 | star rating 162 | 163 | 164 | star rating 165 | 166 | 167 | star rating 168 | 169 | (2 reviews) 170 |

171 |
172 |
    173 |
  • Refurbished Price: $349.99
  • 174 |
  • Out of Stock
  • 175 |
  • Ships in 48 hours
  • 176 |
177 | 180 |
181 |
182 | Card image cap 183 |
184 |
HP Pavilion DV 2000
185 |

186 | 187 | star rating 188 | 189 | (3 reviews) 190 |

191 |
192 |
    193 |
  • Refurbished Price: $499.00
  • 194 |
  • In Stock
  • 195 |
  • Ships in 24 hours
  • 196 |
197 | 200 |
201 |
202 |
203 |
204 | 205 | 206 | 207 |
208 |

Travel

209 | 210 |
211 |
212 |
213 | Card image cap 214 |
215 |
Apple 21.5" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)
216 |

217 | 218 | star rating 219 | 220 | 221 | star rating 222 | 223 | 224 | star rating 225 | 226 | 227 | star rating 228 | 229 | 230 | star rating 231 | 232 | (20 reviews) 233 |

234 |
235 |
    236 |
  • Price: $1,049.00
  • 237 |
  • In Stock
  • 238 |
  • Ships in 24 hours
  • 239 |
240 | 243 |
244 |
245 | Card image cap 246 |
247 |
Dell XPS 14Z X14z-2310ELS 14-Inch Laptop (Elemental Silver)
248 |

249 | 250 | star rating 251 | 252 | 253 | star rating 254 | 255 | 256 | star rating 257 | 258 | 259 | star rating 260 | 261 | 262 | star rating 263 | 264 | (2 reviews) 265 |

266 |
267 |
    268 |
  • Refurbished Price: $349.99
  • 269 |
  • Out of Stock
  • 270 |
  • Ships in 48 hours
  • 271 |
272 | 275 |
276 |
277 | Card image cap 278 |
279 |
HP Pavilion DV 2000
280 |

281 | 282 | star rating 283 | 284 | (3 reviews) 285 |

286 |
287 |
    288 |
  • Refurbished Price: $499.00
  • 289 |
  • In Stock
  • 290 |
  • Ships in 24 hours
  • 291 |
292 | 295 |
296 |
297 |
298 |
299 | 300 | 301 | 302 |
303 |

Work

304 | 305 |
306 |
307 |
308 | Card image cap 309 |
310 |
Apple 21.5" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)
311 |

312 | 313 | star rating 314 | 315 | 316 | star rating 317 | 318 | 319 | star rating 320 | 321 | 322 | star rating 323 | 324 | 325 | star rating 326 | 327 | (20 reviews) 328 |

329 |
330 |
    331 |
  • Price: $1,049.00
  • 332 |
  • In Stock
  • 333 |
  • Ships in 24 hours
  • 334 |
335 | 338 |
339 |
340 | Card image cap 341 |
342 |
Dell XPS 14Z X14z-2310ELS 14-Inch Laptop (Elemental Silver)
343 |

344 | 345 | star rating 346 | 347 | 348 | star rating 349 | 350 | 351 | star rating 352 | 353 | 354 | star rating 355 | 356 | 357 | star rating 358 | 359 | (2 reviews) 360 |

361 |
362 |
    363 |
  • Refurbished Price: $349.99
  • 364 |
  • Out of Stock
  • 365 |
  • Ships in 48 hours
  • 366 |
367 | 370 |
371 |
372 | Card image cap 373 |
374 |
HP Pavilion DV 2000
375 |

376 | 377 | star rating 378 | 379 | (3 reviews) 380 |

381 |
382 |
    383 |
  • Refurbished Price: $499.00
  • 384 |
  • In Stock
  • 385 |
  • Ships in 24 hours
  • 386 |
387 | 390 |
391 |
392 |
393 |
394 | 395 |
396 |
397 | 398 |
© 2018 GwG
399 | 400 | 401 | 402 | 403 | 404 | 405 | 406 | 407 | 408 | 409 | -------------------------------------------------------------------------------- /css/computers.css: -------------------------------------------------------------------------------- 1 | /*Computers page styles */ 2 | 3 | 4 | /* location section styles */ 5 | 6 | .location-header { 7 | margin-bottom: 1.2rem; 8 | } 9 | 10 | .location-img { 11 | height: 180px; 12 | width: 200px; 13 | border-radius: 100%; 14 | } 15 | 16 | 17 | /* Card section styles */ 18 | 19 | .card { 20 | width: 18rem; 21 | } 22 | 23 | .card-text span { 24 | display: inline-flex; 25 | width: .5rem; 26 | } 27 | 28 | .card-text span img { 29 | width: .938rem; 30 | height: .938rem; 31 | } 32 | 33 | 34 | /*Header Styling*/ 35 | 36 | .caption { 37 | padding: 85px 0; 38 | } 39 | 40 | -------------------------------------------------------------------------------- /css/global_styles.css: -------------------------------------------------------------------------------- 1 | /* Global styles */ 2 | 3 | body { 4 | font-family: var(--maintext-font), Arial, sans-serif; 5 | color: var(--maintext-color); 6 | } 7 | 8 | table { 9 | margin-top: 2rem; 10 | } 11 | 12 | thead { 13 | font-weight: 700; 14 | } 15 | 16 | footer { 17 | text-align: center; 18 | color: white; 19 | background: gray; 20 | padding: 1.5rem; 21 | } 22 | 23 | h1, 24 | h2, 25 | h3, 26 | h4 { 27 | margin: 0; 28 | } 29 | 30 | a:link { 31 | text-decoration: none; 32 | } 33 | 34 | /* This may change, I noticed bootstrap's navbar.scss has styling */ 35 | a:active { 36 | font-weight: 700; 37 | } 38 | 39 | a h2 { 40 | color: var(--maintext-color); 41 | } 42 | 43 | .center-div { 44 | text-align: center; 45 | } 46 | 47 | 48 | 49 | 50 | /* Layout styles */ 51 | 52 | .page-banner { 53 | height: var(--mainpage-bannerheight); 54 | max-height: var(--mainpage-bannerheight); 55 | margin-bottom: 2rem; 56 | } 57 | 58 | .banner-accessories { 59 | display: flex; 60 | flex-direction: column; 61 | justify-content: start; 62 | } 63 | 64 | 65 | 66 | .audio-section, 67 | .tech-section, 68 | .computers-section, 69 | .accessories-section { 70 | margin-bottom: 2rem; 71 | } 72 | 73 | .banner-accessories { 74 | display: flex; 75 | flex-direction: column; 76 | justify-content: space-between; 77 | align-items: center; 78 | } 79 | 80 | .banner-accessories .bannerpic-smaller { 81 | width: 100%; 82 | height: 150px; 83 | border-radius: 2px; 84 | } 85 | 86 | #boy-pic { 87 | width: 60%; 88 | height: 100%; 89 | /* border: 1px solid blue; */ 90 | margin: 0 auto; 91 | } 92 | 93 | .review-quote h2 { 94 | color: gray; 95 | line-height: 2; 96 | font-style: italic; 97 | margin: 0 auto; 98 | width: 90%; 99 | position: relative; 100 | top: 20%; 101 | } 102 | 103 | .review-quote h2::before, .review-quote h2::after { 104 | content: '\0022'; 105 | margin: 5px; 106 | } 107 | 108 | 109 | 110 | 111 | /* Products styles */ 112 | 113 | .products-display { 114 | display: flex; 115 | flex-flow: row wrap; 116 | justify-content: space-between; 117 | align-content: center; 118 | } 119 | 120 | .product-header+p { 121 | margin-bottom: 2rem; 122 | 123 | } 124 | 125 | .product { 126 | /* text-align: center; */ 127 | margin-bottom: 3.2rem; 128 | } 129 | 130 | .product-name { 131 | margin-bottom: 2.2rem; 132 | } 133 | 134 | .product-img { 135 | width: 210px; 136 | height: 400px; 137 | margin-bottom: 2rem; 138 | max-width: 100%; 139 | max-height: 180px; 140 | transition: transform .2s ease-in-out; 141 | } 142 | 143 | .product-img:hover { 144 | -webkit-transform: scale(1.2); 145 | transform: scale(1.2); 146 | border-radius: 2px; 147 | cursor: pointer; 148 | } 149 | 150 | .product-price { 151 | font-size: 1.3rem; 152 | margin-bottom: 1.5rem; 153 | } 154 | 155 | .product-header { 156 | margin-bottom: 2rem; 157 | text-align: center; 158 | } 159 | 160 | .see-more { 161 | visibility: hidden; 162 | } 163 | 164 | 165 | /* Reviews section styles */ 166 | 167 | .product-reviews { 168 | margin-bottom: 2rem; 169 | display: flex; 170 | flex-flow: row wrap; 171 | justify-content: space-between; 172 | } 173 | 174 | .product-reviews .review { 175 | width: 210px; 176 | text-align: center; 177 | } 178 | 179 | .product-reviews .customer-img { 180 | border-radius: 100px; 181 | margin-bottom: 0.9rem; 182 | } 183 | 184 | .product-reviews .customer-info { 185 | color: #909090; 186 | } 187 | 188 | .product-reviews blockquote { 189 | font-style: italic; 190 | } 191 | 192 | .product-reviews .customer-rating { 193 | display: flex; 194 | flex-flow: row wrap; 195 | justify-content: space-around; 196 | align-items: flex-start; 197 | } 198 | 199 | .product-reviews .rating-star { 200 | width: 30px; 201 | } 202 | 203 | 204 | /* main page sliding banner styles */ 205 | 206 | .carousel-inner img { 207 | width: 100%; 208 | height: var(--mainpage-bannerheight); 209 | } 210 | 211 | .comp_mountain h2 { 212 | color: var(--green); 213 | } 214 | 215 | .comp_mountain p { 216 | color: var(--brown-light); 217 | } 218 | 219 | 220 | /* ratings to be implemented */ 221 | 222 | .stars-outer { 223 | position: relative; 224 | display: inline-block; 225 | } 226 | 227 | .stars-inner { 228 | position: absolute; 229 | top: 0; 230 | left: 0; 231 | white-space: nowrap; 232 | overflow: hidden; 233 | width: 0; 234 | } 235 | 236 | .stars-outer::before { 237 | content: "\f005 \f005 \f005 \f005 \f005"; 238 | font-family: 'Font Awesome 5 Free'; 239 | font-weight: 900; 240 | color: #ccc; 241 | } 242 | 243 | .stars-inner::before { 244 | content: "\f005 \f005 \f005 \f005 \f005"; 245 | font-family: 'Font Awesome 5 Free'; 246 | font-weight: 900; 247 | color: #f8ce0b; 248 | } 249 | -------------------------------------------------------------------------------- /css/products.css: -------------------------------------------------------------------------------- 1 | .banner-computer { 2 | background: url(../img/products/computer_options.jpg); 3 | background-size: cover; 4 | } 5 | 6 | .banner-audio { 7 | background: url(../img/products/audio_setup.jpg); 8 | /* background-size: cover; */ 9 | } 10 | 11 | 12 | /* Global product page styles */ 13 | 14 | .caption { 15 | text-align: center; 16 | } 17 | 18 | .caption h1 { 19 | font-size: 2.25rem; 20 | line-height: 1.6; 21 | margin-bottom: 20px; 22 | } 23 | 24 | .caption h1, 25 | .caption p { 26 | color: #fff; 27 | } 28 | 29 | .product-card .card-img-top { 30 | height: 215px; 31 | } 32 | 33 | .product-card .card-body { 34 | height: 170px; 35 | } 36 | 37 | .product .dropdown { 38 | margin: 1.3rem 0; 39 | } 40 | 41 | 42 | /* Single Product page styles */ 43 | 44 | .table-specs { 45 | margin: 0; 46 | } 47 | 48 | .product-full { 49 | display: grid; 50 | grid-template-columns: 1fr 1fr; 51 | grid-template-rows: repeat(3, minmax(150px, auto)); 52 | grid-row-gap: 4rem; 53 | } 54 | 55 | .product-title, 56 | .product-section--header { 57 | margin-bottom: 1.6rem; 58 | } 59 | 60 | .product-spotlight { 61 | grid-area: 1 / 1 / 2 / 2; 62 | } 63 | 64 | .product-spotlight img { 65 | border-radius: 2px; 66 | } 67 | 68 | .product-image { 69 | margin-bottom: 2rem; 70 | } 71 | 72 | .product-details { 73 | grid-area: 1 / 2 / 2 / 3; 74 | } 75 | 76 | .product-features ul { 77 | padding: 0; 78 | margin-bottom: 2rem; 79 | } 80 | 81 | .product-features li { 82 | margin-bottom: 1rem; 83 | } 84 | 85 | .product-specs { 86 | grid-area: 2 / 1 / 3 / 5; 87 | } 88 | 89 | .product-similar { 90 | grid-area: 3 / 1 / 4 / 5; 91 | margin-bottom: 3rem; 92 | } 93 | 94 | .product-similar div { 95 | display: flex; 96 | justify-content: space-around; 97 | margin: 2rem 0; 98 | } 99 | 100 | .review-ratings .stars { 101 | display: flex; 102 | flex-flow: flow wrap; 103 | justify-content: flex-start; 104 | margin-bottom: 1.2rem; 105 | } 106 | 107 | .review-ratings .rating-star { 108 | width: 35px; 109 | height: 35px; 110 | margin: 0 1rem 1rem 0; 111 | } -------------------------------------------------------------------------------- /css/sidebar_styles.css: -------------------------------------------------------------------------------- 1 | .left-sidebar__list { 2 | margin: 0; 3 | padding: 0; 4 | list-style-type: none; 5 | } 6 | 7 | .left-sidebar__list-item, .dropdown-list li { 8 | margin-bottom: 2.2em; 9 | } 10 | 11 | 12 | .left-sidebar__list-item.dropdown { 13 | cursor: pointer; 14 | } 15 | 16 | .left-sidebar__header { 17 | margin-bottom: .80em; 18 | } 19 | 20 | .left-sidebar__statement { 21 | font-size: .90em; 22 | font-style: italic; 23 | } 24 | 25 | 26 | 27 | .dropdown-list { 28 | position: relative; 29 | top: -15px; 30 | } 31 | 32 | .dropdown-list ul { 33 | padding-left: 2em; 34 | list-style: none; 35 | } 36 | 37 | /* drop down styles */ 38 | /* .remove-dropdown { 39 | display: none; 40 | } */ -------------------------------------------------------------------------------- /css/styles.css: -------------------------------------------------------------------------------- 1 | @import url(variables.css); 2 | @import url(global_styles.css); 3 | @import url(sidebar_styles.css); 4 | @import url(products.css); 5 | @import url(computers.css); 6 | 7 | -------------------------------------------------------------------------------- /css/variables.css: -------------------------------------------------------------------------------- 1 | :root { 2 | --maintext-font: Quicksand; 3 | --maintext-color: #343434; 4 | --mainpage-bannerheight: 330px; 5 | --green: #98C07F; 6 | --brown-dark: #beb9a4; 7 | --brown-light: #f6f0e4; 8 | } -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/favicon.ico -------------------------------------------------------------------------------- /img/boy_review.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/boy_review.png -------------------------------------------------------------------------------- /img/carousel_img/caraousel_comp_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/carousel_img/caraousel_comp_01.jpg -------------------------------------------------------------------------------- /img/carousel_img/caraousel_drone_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/carousel_img/caraousel_drone_01.jpg -------------------------------------------------------------------------------- /img/carousel_img/caraousel_drone_02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/carousel_img/caraousel_drone_02.jpg -------------------------------------------------------------------------------- /img/carousel_img/caraousel_headphones_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/carousel_img/caraousel_headphones_01.jpg -------------------------------------------------------------------------------- /img/carousel_img/caraousel_headphones_02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/carousel_img/caraousel_headphones_02.jpg -------------------------------------------------------------------------------- /img/carousel_img/elects_banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/carousel_img/elects_banner.png -------------------------------------------------------------------------------- /img/carousel_img/home-banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/carousel_img/home-banner.jpg -------------------------------------------------------------------------------- /img/computer-home.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/computer-home.jpg -------------------------------------------------------------------------------- /img/computer-travel.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/computer-travel.jpg -------------------------------------------------------------------------------- /img/computer-work.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/computer-work.jpg -------------------------------------------------------------------------------- /img/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/favicon.ico -------------------------------------------------------------------------------- /img/friends_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/friends_01.jpg -------------------------------------------------------------------------------- /img/friends_02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/friends_02.jpg -------------------------------------------------------------------------------- /img/friends_03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/friends_03.png -------------------------------------------------------------------------------- /img/friends_04.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/friends_04.jpg -------------------------------------------------------------------------------- /img/labels/big-sale-offers.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/big-sale-offers.png -------------------------------------------------------------------------------- /img/labels/discount_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/discount_01.png -------------------------------------------------------------------------------- /img/labels/discount_02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/discount_02.png -------------------------------------------------------------------------------- /img/labels/discount_03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/discount_03.png -------------------------------------------------------------------------------- /img/labels/discount_04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/discount_04.png -------------------------------------------------------------------------------- /img/labels/discount_05.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/discount_05.png -------------------------------------------------------------------------------- /img/labels/free_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/free_01.png -------------------------------------------------------------------------------- /img/labels/free_02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/free_02.png -------------------------------------------------------------------------------- /img/labels/free_03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/free_03.png -------------------------------------------------------------------------------- /img/labels/sale_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/sale_01.png -------------------------------------------------------------------------------- /img/labels/sale_02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/sale_02.png -------------------------------------------------------------------------------- /img/labels/sale_03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/sale_03.png -------------------------------------------------------------------------------- /img/labels/sale_04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/sale_04.png -------------------------------------------------------------------------------- /img/labels/sale_05.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/sale_05.png -------------------------------------------------------------------------------- /img/labels/sale_06.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/labels/sale_06.png -------------------------------------------------------------------------------- /img/products/Computer-Pc-Monitor-Imac-Screen-Personal-Computer-2493287.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/Computer-Pc-Monitor-Imac-Screen-Personal-Computer-2493287.png -------------------------------------------------------------------------------- /img/products/accessories/tech_access_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/accessories/tech_access_01.jpg -------------------------------------------------------------------------------- /img/products/accessories/tech_access_02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/accessories/tech_access_02.jpg -------------------------------------------------------------------------------- /img/products/accessories/tech_access_03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/accessories/tech_access_03.png -------------------------------------------------------------------------------- /img/products/accessories/tech_access_04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/accessories/tech_access_04.png -------------------------------------------------------------------------------- /img/products/accessories/tech_access_05.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/accessories/tech_access_05.png -------------------------------------------------------------------------------- /img/products/accessories/tech_access_06.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/accessories/tech_access_06.jpg -------------------------------------------------------------------------------- /img/products/audio/a12b50ml8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/a12b50ml8.jpg -------------------------------------------------------------------------------- /img/products/audio/bfs-900.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/bfs-900.jpg -------------------------------------------------------------------------------- /img/products/audio/bfs-99x.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/bfs-99x.jpg -------------------------------------------------------------------------------- /img/products/audio/h-402m-blk.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/h-402m-blk.jpg -------------------------------------------------------------------------------- /img/products/audio/h7902.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/h7902.jpg -------------------------------------------------------------------------------- /img/products/audio/headphones_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_01.jpg -------------------------------------------------------------------------------- /img/products/audio/headphones_02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_02.png -------------------------------------------------------------------------------- /img/products/audio/headphones_03.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_03.jpeg -------------------------------------------------------------------------------- /img/products/audio/headphones_04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_04.png -------------------------------------------------------------------------------- /img/products/audio/headphones_05.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_05.png -------------------------------------------------------------------------------- /img/products/audio/headphones_06.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_06.jpg -------------------------------------------------------------------------------- /img/products/audio/headphones_07.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_07.jpg -------------------------------------------------------------------------------- /img/products/audio/headphones_08.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_08.jpg -------------------------------------------------------------------------------- /img/products/audio/headphones_09.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_09.jpg -------------------------------------------------------------------------------- /img/products/audio/headphones_10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_10.jpg -------------------------------------------------------------------------------- /img/products/audio/headphones_11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_11.jpg -------------------------------------------------------------------------------- /img/products/audio/headphones_11.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_11.png -------------------------------------------------------------------------------- /img/products/audio/headphones_12.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_12.png -------------------------------------------------------------------------------- /img/products/audio/headphones_13.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_13.png -------------------------------------------------------------------------------- /img/products/audio/headphones_14.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_14.png -------------------------------------------------------------------------------- /img/products/audio/headphones_15.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_15.png -------------------------------------------------------------------------------- /img/products/audio/headphones_16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_16.png -------------------------------------------------------------------------------- /img/products/audio/headphones_17.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_17.png -------------------------------------------------------------------------------- /img/products/audio/headphones_18.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/headphones_18.png -------------------------------------------------------------------------------- /img/products/audio/speaker_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio/speaker_01.png -------------------------------------------------------------------------------- /img/products/audio_setup.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/audio_setup.jpg -------------------------------------------------------------------------------- /img/products/club-back.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/club-back.jpg -------------------------------------------------------------------------------- /img/products/computer_options.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/computer_options.jpg -------------------------------------------------------------------------------- /img/products/consumer-electronics.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/consumer-electronics.png -------------------------------------------------------------------------------- /img/products/controller_01.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/controller_01.jpeg -------------------------------------------------------------------------------- /img/products/cooldj.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/cooldj.png -------------------------------------------------------------------------------- /img/products/dj.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/dj.png -------------------------------------------------------------------------------- /img/products/drone_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/drone_01.jpg -------------------------------------------------------------------------------- /img/products/drone_02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/drone_02.png -------------------------------------------------------------------------------- /img/products/drone_03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/drone_03.png -------------------------------------------------------------------------------- /img/products/ecommerce-store.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/ecommerce-store.jpg -------------------------------------------------------------------------------- /img/products/ecommerce_sales.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/ecommerce_sales.jpg -------------------------------------------------------------------------------- /img/products/electronics.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/electronics.png -------------------------------------------------------------------------------- /img/products/electronics_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/electronics_01.png -------------------------------------------------------------------------------- /img/products/electronics_02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/electronics_02.png -------------------------------------------------------------------------------- /img/products/family_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/family_01.png -------------------------------------------------------------------------------- /img/products/girl-laptop1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/girl-laptop1.png -------------------------------------------------------------------------------- /img/products/girl-laptop2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/girl-laptop2.png -------------------------------------------------------------------------------- /img/products/girl-laptop3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/girl-laptop3.png -------------------------------------------------------------------------------- /img/products/girl.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/girl.png -------------------------------------------------------------------------------- /img/products/girl_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/girl_01.png -------------------------------------------------------------------------------- /img/products/hp-pavilion.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/hp-pavilion.jpg -------------------------------------------------------------------------------- /img/products/imac.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/imac.png -------------------------------------------------------------------------------- /img/products/images.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/images.jpg -------------------------------------------------------------------------------- /img/products/img0677.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/img0677.png -------------------------------------------------------------------------------- /img/products/kids_busy.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/kids_busy.png -------------------------------------------------------------------------------- /img/products/laptop_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/laptop_01.jpg -------------------------------------------------------------------------------- /img/products/laptop_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/laptop_01.png -------------------------------------------------------------------------------- /img/products/laptop_02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/laptop_02.jpg -------------------------------------------------------------------------------- /img/products/laptop_02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/laptop_02.png -------------------------------------------------------------------------------- /img/products/laptop_03.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/laptop_03.png -------------------------------------------------------------------------------- /img/products/male_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/male_01.png -------------------------------------------------------------------------------- /img/products/male_02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/male_02.png -------------------------------------------------------------------------------- /img/products/phone_01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/phone_01.png -------------------------------------------------------------------------------- /img/products/product.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/product.png -------------------------------------------------------------------------------- /img/products/products.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/products.png -------------------------------------------------------------------------------- /img/products/ps4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/ps4.png -------------------------------------------------------------------------------- /img/products/screens.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/screens.png -------------------------------------------------------------------------------- /img/products/tablet_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/tablet_01.jpg -------------------------------------------------------------------------------- /img/products/tablet_02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/tablet_02.jpg -------------------------------------------------------------------------------- /img/products/tablet_03.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/tablet_03.jpg -------------------------------------------------------------------------------- /img/products/tablet_04.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/tablet_04.jpg -------------------------------------------------------------------------------- /img/products/tablet_05.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/tablet_05.jpg -------------------------------------------------------------------------------- /img/products/tablet_06.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/tablet_06.jpg -------------------------------------------------------------------------------- /img/products/tablet_07.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/products/tablet_07.jpg -------------------------------------------------------------------------------- /img/rating-star.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/rating-star.png -------------------------------------------------------------------------------- /img/site-so-far.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/site-so-far.jpg -------------------------------------------------------------------------------- /img/team/clone_download.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/team/clone_download.jpg -------------------------------------------------------------------------------- /img/tech_family.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/tech_family.png -------------------------------------------------------------------------------- /img/user_female_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/user_female_01.jpg -------------------------------------------------------------------------------- /img/user_male_01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/user_male_01.jpg -------------------------------------------------------------------------------- /img/user_male_02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/img/user_male_02.jpg -------------------------------------------------------------------------------- /inc/content.php: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/inc/content.php -------------------------------------------------------------------------------- /inc/footer.php: -------------------------------------------------------------------------------- 1 | 2 |
© 2018 GwG
3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /inc/header.php: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <?php print $title; ?> 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /inc/home.php: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | 39 | 40 |
41 |
42 | left side 43 |
44 | 45 |
46 | center 47 |
48 | 49 |
50 | aside 51 |
52 | 53 |
54 |
55 | 56 | -------------------------------------------------------------------------------- /inc/nav.php: -------------------------------------------------------------------------------- 1 | 2 | 3 | 39 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | GwG eCommerce 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 64 | 65 | 66 |
67 |
68 |
69 | 104 | 105 |
106 | 150 | 151 |
152 | center 153 |
154 | 155 |
156 | aside 157 |
158 | 159 |
160 |
161 | 162 | 163 | 164 | 165 | 166 | 167 | 168 | 169 | 170 | 171 | -------------------------------------------------------------------------------- /index.php: -------------------------------------------------------------------------------- 1 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /js/checkout.js: -------------------------------------------------------------------------------- 1 | // WIP: Building cart module 2 | 3 | 4 | function getTotal() { 5 | 6 | // subTotal 7 | var subTotal = productPrice * quantity; 8 | // shipping 9 | var shipping; // flat, percent, or weight? 10 | // total 11 | var total = subTotal + shipping; 12 | } 13 | 14 | 15 | 16 | // WIP: 17 | var itemPrice, quantity, subtotal, shipping, totalPrice; 18 | 19 | $(document).ready(function() { 20 | $(document).getElementById ( "shipping" ) { 21 | function totalPrice(subtotal, shipping) { 22 | $(document).getElementById( "ship") { 23 | function getTotal(subtotal, shipping) { 24 | var shipping = 5.99; 25 | var totalPrice = subtotal + shipping; 26 | return "..."; 27 | } // end ship 28 | } // end ready(function) 29 | -------------------------------------------------------------------------------- /js/main.js: -------------------------------------------------------------------------------- 1 | $(document).ready(function() { 2 | 3 | 4 | // list drop down functionality 5 | 6 | $('.left-sidebar__list-item.dropdown').on('click', function() { 7 | $(this).next('li').toggle(); 8 | }); 9 | 10 | 11 | 12 | // TODO: Change the caret icon when the dropdown list is collapsed 13 | // Change the caret icon 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | }); -------------------------------------------------------------------------------- /js/products.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Filling in product.html 3 | */ 4 | 5 | function singleProduct() { 6 | 7 | // Setup 8 | var productTitle = $('.product-title'); 9 | var productImage = $('.product-image'); 10 | var productPrice = $('.price'); 11 | // WIP: var productRating = $('.rating'); 12 | var productDescription = $('.description'); 13 | var productFeatures = $('.product-features'); 14 | var productSpecs = $('.product-specs'); 15 | var similarProducts; 16 | 17 | // TODO: Pull product info by id 18 | 19 | } 20 | 21 | /** 22 | * need to come back to link for Features to be included in table 23 | */ 24 | var products = [ 25 | // Computers 26 | { 27 | "id": "1", 28 | "name": "Apple 21.5\" iMac, 2.3GHz Dual-Core Intel Core i5, 8GB RAM, 1TB HDD (Mid 2017)", 29 | "price": 1049.00, 30 | "inventory": 5, 31 | "rating": 3.8, 32 | "image": "../img/products/Computer-Pc-Monitor-Imac-Screen-Personal-Computer-2493287.png", 33 | "description": "Description goes here", 34 | // dateAdded is useful for listing New Products 35 | "dateAdded": 201803220930, // yy/mm/dd/24hr-time 36 | }, 37 | { 38 | "id": "2", 39 | "name": "Dell XPS 14Z X14z-2310ELS 14-Inch Laptop", 40 | "price": 39.95, 41 | "inventory": 0, 42 | "rating": 3.6, 43 | "image": "../img/products/laptop_03.png", 44 | "description": "Description goes here", 45 | "dateAdded": 201803220931 46 | }, 47 | { 48 | "id": "3", 49 | "name": "HP Pavilion DV 2000", 50 | "price": 499.00, 51 | "inventory": 1, 52 | "rating": 3.2, 53 | "image": "../img/products/laptop_01.png", 54 | "description": "Description goes here", 55 | "dateAdded": 201803220932 56 | }, 57 | // Audio 58 | { 59 | "id": "4", 60 | "name": "BT Headphones with LED flashing light", 61 | "price": 29.99, 62 | "inventory": 20, 63 | "rating": 3.2, 64 | "image": "../img/products/audio/a12b50ml8.jpg", 65 | "description": "Cut the cord with this Bluetooth® stereo headset! With up to six hours of use on a full charge, you can study, clean, or game without being restricted by the cord connected to your device. Featuring a built-in microphone and micro SD card, you can have all the benefits of hands-free calling as well as not be dependent on your phone or other Bluetooth® enabled device for your music.", 66 | "dateAdded": 201803231118 67 | }, 68 | { 69 | "id": "5", 70 | "name": "QFX Stereo Headphones with Microphone - Black", 71 | "price": 12.99, 72 | "inventory": 25, 73 | "rating": 3.2, 74 | "image": "../img/products/audio/h-402m-blk.jpg", 75 | "description": "The H-402M headset folds up for easy transport and storage anywhere you want. Designed with cushioned, pressure-relieving ear pads that rest comfortably on the ears--versus completely covering the ears. They are extremely comfortable for long periods of use", 76 | "dateAdded": 201803231136 77 | }, 78 | { 79 | "id": "6", 80 | "name": "beFree Sound 5.1 Channel Surround Sound Bluetooth Speaker System- Yellow", 81 | "price": 195.99, 82 | "inventory": 5, 83 | "rating": 3.6, 84 | "image": "../img/products/audio/h7902.jpg", 85 | "description": "beFree Sound Bluetooth Speaker System provides clear sound from all satellite speakers and amplifier from up to 30 feet away. You can sync any Bluetooth enabled device; your phone, tablet, media player or even your computer. For other non-Bluetooth devices, there is a USB and SD input ports. Additional conveniences include a remote control. You've got full power to fill your room with big, balanced sound. All the speakers and the amplifier are magnetically shielded to provide protection against image distortion from external electronic sources. Compatible with all smartphones and all mp3 players. The system comes complete, with all necessary cables.", 86 | "dateAdded": 201803231142 87 | }, 88 | { 89 | "id": "7", 90 | "name": "beFree Sound 5.1 Channel Surround Sound Bluetooth Speaker System", 91 | "price": 249.99, 92 | "inventory": 5, 93 | "rating": 3.6, 94 | "image": "../img/products/audio/bfs-900.jpg", 95 | "description": "The beFree Sound speaker system with Bluetooth wireless technology features 5 built-in high-powered speakers and easily connects to your Smartphone or other Bluetooth enabled audio devices. Accessories and features included: Remote Control, Bluetooth technology, FM radio, USB and SD inputs.", 96 | "dateAdded": 201803231155 97 | }, 98 | { 99 | "id": "8", 100 | "name": "beFree Sound 2.1 Channel Surround Sound Bluetooth Speaker System in Red", 101 | "price": 189.99, 102 | "inventory": 5, 103 | "rating": 3.6, 104 | "image": "../img/products/audio/bfs-99x.jpg", 105 | "description": "Enjoy the ultimate home theater experience with beFree Sound's 2.1 Channel Surround Sound Bluetooth Speaker System. This speaker system is designed with sophistication, featuring a sleek look and smooth sound. With Bluetooth, USB, SD and FM radio capability, the system offers the best possible listening options for your enjoyment.", 106 | "dateAdded": 201803231155 107 | } 108 | ]; 109 | 110 | 111 | /** 112 | * WIP: 113 | 114 | // Id for cart to pull from and default values 115 | var cart = { 116 | "1": 2, 117 | "2": 5, 118 | "3": 5 119 | }; 120 | 121 | 122 | // In Stock 123 | 124 | function inStock() { 125 | if( inventory > 0) { 126 | return "In Stock"; 127 | } else { 128 | return "Out of Stock"; 129 | } 130 | } 131 | 132 | */ 133 | -------------------------------------------------------------------------------- /js/ratings.js: -------------------------------------------------------------------------------- 1 | /** 2 | * TODO: Put this in a function and insert into products.js 3 | */ 4 | 5 | // Initial Ratings 6 | const ratings = { 7 | // change these to reflect product 8 | sony: 3.3, 9 | samsung: 3.4, 10 | panasonic: 3.6 11 | }; 12 | 13 | // Total Stars 14 | const starsTotal = 5; 15 | 16 | // Run getRatings when DOM loads 17 | document.addEventListener("DOMContentLoaded", getRatings); 18 | 19 | // Get Ratings 20 | function getRatings() { 21 | for (let rating in ratings) { 22 | // Get percentage 23 | const starPercentage = ratings[rating] / starsTotal * 100; 24 | 25 | // Round to nearest 10 26 | const starPercentageRounded = `${Math.round(starPercentage / 10) * 10}%`; 27 | 28 | // Set width of stars-inner to percentage 29 | document.querySelector( 30 | `.${rating} .stars-inner` 31 | ).style.width = starPercentageRounded; 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /product.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | <?php print $title; ?> 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 63 | 64 | 65 |
66 |
67 | 72 |
73 |
74 | 75 |
76 | left side 77 |
78 | 79 | 80 | 81 | 82 | 83 |
84 | 85 | 86 |
87 | 88 | 89 |

Product title

90 | 91 | 92 | image placeholder 93 | 94 | 95 |
96 |

Reviews

97 |
98 | rating star 99 | rating star 100 | rating star 101 |
102 | 103 |
104 |
105 | 106 | 107 | 108 |
109 |

Details

110 | 111 |

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quam, atque. Inventore recusandae dolore nostrum voluptate.

112 | 113 |
114 |

Features

115 | 116 |
    117 |
  • Feature 1
  • 118 |
  • Feature 2
  • 119 |
  • Feature 3
  • 120 |
  • 1 year guarantee!
  • 121 |
  • Lowest price guarantee!
  • 122 |
123 |
124 | 125 |

$0.00

126 | 127 | 128 |
129 | 130 | 131 | 132 |
133 |

Specs

134 | 135 |
136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 152 | 153 |
TypeDescription
CPU3.2 Ghz 8-core
RAM16 GB
154 |
155 | 156 |
157 | 158 | 159 |
160 |

Similar Products

161 |
162 | image placeholder 163 | image placeholder 164 | image placeholder 165 | image placeholder 166 |
167 |
168 | 169 |
170 | 171 | 172 |
173 | aside 174 |
175 | 176 |
177 | 178 |
179 | 180 | 181 |
© 2018 GwG
182 | 183 | 184 | 185 | 186 | 187 | 188 | 189 | 190 | -------------------------------------------------------------------------------- /product.php: -------------------------------------------------------------------------------- 1 |
2 |
3 | 8 |
9 |
10 | 11 |
12 | left side 13 |
14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 |
23 | 24 | 25 |

Product title

26 | 27 | 28 | image placeholder 29 | 30 | 31 |
32 |

Reviews

33 |
34 | rating star 35 | rating star 36 | rating star 37 |
38 | 39 |
40 |
41 | 42 | 43 | 44 |
45 |

Details

46 | 47 |

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quam, atque. Inventore recusandae dolore nostrum voluptate.

48 | 49 |
50 |

Features

51 | 52 |
    53 |
  • Feature 1
  • 54 |
  • Feature 2
  • 55 |
  • Feature 3
  • 56 |
  • 1 year guarantee!
  • 57 |
  • Lowest price guarantee!
  • 58 |
59 |
60 | 61 |

$0.00

62 | 63 | 64 |
65 | 66 | 67 | 68 |
69 |

Specs

70 | 71 |
72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 |
TypeDescription
CPU3.2 Ghz 8-core
RAM16 GB
90 |
91 | 92 |
93 | 94 | 95 |
96 |

Similar Products

97 |
98 | image placeholder 99 | image placeholder 100 | image placeholder 101 | image placeholder 102 |
103 |
104 | 105 |
106 | 107 | 108 |
109 | aside 110 |
111 | 112 |
113 | 114 |
115 | 116 | -------------------------------------------------------------------------------- /ratings.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | GwG eCommerce 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 63 | 64 | 65 |
66 |

To edit the rating for now:

67 | 70 | 71 | 72 |
73 | 74 |
75 |
76 |
77 |
78 | 79 |
80 |
81 | 82 |
83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | -------------------------------------------------------------------------------- /rb/.gitignore: -------------------------------------------------------------------------------- 1 | fa 2 | rb 3 | rackbusters 4 | thumb 5 | img 6 | csv-parser.html 7 | js/proto.js 8 | -------------------------------------------------------------------------------- /rb/1-24.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/rb/1-24.png -------------------------------------------------------------------------------- /rb/2-16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/rb/2-16.png -------------------------------------------------------------------------------- /rb/2-6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/rb/2-6.png -------------------------------------------------------------------------------- /rb/2-7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/rb/2-7.png -------------------------------------------------------------------------------- /rb/README.md: -------------------------------------------------------------------------------- 1 | # TODO 2 | 3 | ## Categories 4 | 5 | ![category Placeholders](2-16.png) 6 | 7 | 8 | 9 | ## Product 10 | 11 | ![Jan 24](1-24.png) 12 | 13 | ## Features 14 | 15 | - [ ] Promotions (cycle) 16 | - [ ] Discount Code 17 | - [ ] Search 18 | - [ ] Product Listing 19 | - [ ] Reviews 20 | - [ ] Star Rating 21 | - [ ] Review text 22 | 23 | ## Images ( non-stock Production Ready ) 24 | 25 | - [ ] banners 26 | - [ ] Holiday Sales 27 | - [ ] Categories (use search in Product_Category) 28 | - [ ] Pool Cues 29 | - [ ] Cue Cases 30 | - [ ] Cue Accessories 31 | - [ ] Table Accessories 32 | - [ ] Training Aids 33 | - [ ] Gameroom 34 | - [ ] Darts 35 | - [ ] Clothing 36 | 37 | --- 38 | 39 | ``` 40 | products.findIndex(x => x.Parent_Sku === 'ZZSP'); // 3896 41 | 42 | findProductByParentSku (product) { 43 | console.log(this); 44 | if(this.Parent_Sku === this[0]) { 45 | } 46 | } 47 | 48 | var task = tasks.find(findProductByParentSku, ZZSP); 49 | console.log(JSON.stringify(product)); 50 | ``` 51 | 52 | ## Navigation 53 | 54 | - [ ] Home 55 | - [ ] Category 56 | - [ ] Pool Cues 57 | 58 | ``` 59 | cues = [ 60 | 5280, 61 | Action, 62 | Athena, 63 | Blade, 64 | Cuetec, 65 | Dufferin, 66 | Elite, 67 | Griffin, 68 | Harley Davidson, 69 | Joss, 70 | Lucasi, 71 | Mayhem, 72 | McDermott, 73 | McFarland, 74 | Meucci, 75 | Mezz, 76 | Outlaw, 77 | Peradon, 78 | Riley, 79 | Schon, 80 | Scorpion, 81 | Stealth, 82 | Tiger, 83 | Trouble Shooter Cues, 84 | Valley (one-piece cues), 85 | Viking, 86 | Voodoo, 87 | ] 88 | ``` 89 | 90 | - [ ] Brand 91 | - [ ] Product 92 | - [ ] similar 93 | - [ ] accessories 94 | - [ ] bundles 95 | - [ ] Category 96 | 97 | ## Search Filters 98 | 99 | - [ ] byPrice 100 | - [ ] byBrand 101 | - [ ] byDiscount 102 | - [ ] byRewards 103 | 104 | --- 105 | 106 | -------------------------------------------------------------------------------- /rb/css/main.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | margin: 0; 4 | padding: 0; 5 | } 6 | body { 7 | margin: 32px auto; 8 | font-family: tahoma; 9 | color: #282828; 10 | margin: 0px; 11 | } 12 | header { 13 | background: #000; 14 | } 15 | input { 16 | /* margin: 8px 1em; */ 17 | display: inline-block; 18 | } 19 | ul { 20 | list-style-type: none; 21 | } 22 | #top-menu{ 23 | padding: 16px; 24 | font-size: 18px; 25 | } 26 | .nav-bar { 27 | color: #aaa; 28 | } 29 | #user i.fas.fa-user { 30 | float: right; 31 | border: #999 2px solid; 32 | border-radius: 50%; 33 | padding: 5px; 34 | } 35 | #header-logo { 36 | margin-top: -45px; 37 | } 38 | .search { 39 | padding: 0 1em; 40 | } 41 | .nav-bar { 42 | background: linear-gradient(-90deg, #000, #a00); 43 | height: 60px; 44 | margin-bottom: 15px; 45 | } 46 | .product { 47 | display: flex; 48 | flex-flow: wrap; 49 | padding: 1rem; 50 | } 51 | 52 | img { 53 | border: 1px solid #d8d8d8; 54 | width: 70%; 55 | margin: 55px; 56 | box-shadow: 0px 1px 1px #d8d8d8; 57 | } 58 | 59 | .product-image { 60 | width: 80%; 61 | } 62 | 63 | .product-image, 64 | .product-info { 65 | margin-top: 10px; 66 | width: 50%; 67 | } 68 | 69 | .color-box { 70 | width: 40px; 71 | height: 40px; 72 | margin-top: 5px; 73 | } 74 | 75 | .cart { 76 | margin-right: 25px; 77 | float: right; 78 | border: 1px solid #d8d8d8; 79 | padding: 5px 20px; 80 | } 81 | 82 | button { 83 | margin-top: 30px; 84 | border: none; 85 | background-color: #1E95EA; 86 | color: white; 87 | height: 40px; 88 | width: 100px; 89 | font-size: 14px; 90 | } 91 | 92 | .disabledButton { 93 | background-color: #d8d8d8; 94 | } 95 | 96 | .review-form { 97 | width: 400px; 98 | padding: 20px; 99 | margin: 40px; 100 | border: 1px solid #d8d8d8; 101 | } 102 | 103 | input { 104 | width: 100%; 105 | height: 25px; 106 | margin-bottom: 20px; 107 | } 108 | 109 | textarea { 110 | width: 100%; 111 | height: 60px; 112 | } 113 | 114 | .tab { 115 | margin-left: 20px; 116 | cursor: pointer; 117 | } 118 | 119 | .activeTab { 120 | color: #16C0B0; 121 | text-decoration: underline; 122 | } 123 | -------------------------------------------------------------------------------- /rb/css/style.css: -------------------------------------------------------------------------------- 1 | /* === GLOBALS === */ 2 | 3 | a { 4 | color: #999; 5 | } 6 | a:hover { 7 | color: #f33; 8 | text-decoration: none; 9 | } 10 | ul { 11 | list-style-type: none; 12 | } 13 | .btn-link { 14 | color: #f33; 15 | } 16 | .btn-link:hover { 17 | color: #999; 18 | } 19 | .bg-dark, .navbar-bark { 20 | background-color: #333; 21 | } 22 | /* === HEADER === */ 23 | 24 | header { 25 | background-color: black; 26 | /* background-image: linear-gradient(to right, black, #9b001f); */ 27 | text-align: center; 28 | color: whitesmoke; 29 | } 30 | header h1, header p { 31 | margin-left: 16px; 32 | } 33 | #mainBody { 34 | padding-right: 0; 35 | } 36 | #sideNav button { 37 | padding-left: 0; 38 | } 39 | .cue-img { 40 | max-width: 100%; 41 | } 42 | .logo { 43 | background: #000; 44 | text-align: center; 45 | max-width: 100%; 46 | } 47 | #logo { 48 | /* width: 800px; 49 | height: 600px; */ 50 | max-width: 100%; 51 | height: auto; 52 | } 53 | #branding { 54 | height: 250px; 55 | display: inline-block; 56 | } 57 | /* === NAVIGATION === */ 58 | #top-menu { 59 | padding: 16px; 60 | font-size: 18px; 61 | } 62 | .nav-bar { 63 | color: #aaa; 64 | } 65 | #user i.fas.fa-user { 66 | float: right; 67 | border: #999 2px solid; 68 | border-radius: 50%; 69 | padding: 5px; 70 | } 71 | .navbar-dark .navbar-nav .nav-link:hover { 72 | color: #f33; 73 | } 74 | nav a { 75 | color: #f33; 76 | } 77 | #sideNav { 78 | margin: 0; 79 | padding: 0; 80 | } 81 | #sideNav .card-header h5 button { 82 | font-size: 16px; 83 | } 84 | #brand-logos { 85 | padding: 2em 0; 86 | background-color: #000; 87 | filter: grayscale(100%); 88 | opacity: .9; 89 | } 90 | #brand-logos img { 91 | max-width: 100px; 92 | max-height: 100px; 93 | padding: .5em; 94 | filter: invert(100%); 95 | } 96 | /* === CARD === */ 97 | .card-header { 98 | text-align: center; 99 | line-height: 3rem; 100 | } 101 | .card-body ul li { 102 | list-style-type: none; 103 | } 104 | .sale-price { 105 | font-size: 1.3em; 106 | font-weight: bold; 107 | } 108 | .btn-danger a { 109 | color: #e5e5e5; 110 | } 111 | /* === MAIN CONTENT === */ 112 | 113 | .container { 114 | max-width: 100%; 115 | } 116 | .fade { 117 | background-image: linear-gradient(to right, black, crimson); 118 | height: 200px; 119 | display: inline-block; 120 | } 121 | 122 | /*=== CATEGORIES ===*/ 123 | #categories { 124 | display: block; 125 | padding-left: 1em; 126 | margin: auto; 127 | } 128 | .category { 129 | background-image: url("../img/thumb/BBELE.JPG"); 130 | float: left; 131 | text-align: center; 132 | border: 1px rgba(0,0,0, .1) solid; 133 | border-radius: .5em; 134 | margin: 0 10px 10px 0; 135 | /* width: 30%;*/ 136 | max-width: 30%; 137 | min-width: 272px; 138 | /* width: calc((95% - 22px)/3); */ 139 | height: 200px; 140 | } 141 | #cues { 142 | background-image: url('../img/thumb/ZZSP.JPG'); 143 | background-repeat: no-repeat; 144 | background-position-y: 50%; 145 | } 146 | #cases { 147 | background-image: url('../img/thumb/ACSC07.jpg'); 148 | background-repeat: no-repeat; 149 | background-position-y: 50%; 150 | } 151 | .left { 152 | width: 50%; 153 | display: inline-block; 154 | } 155 | .right { 156 | width: 50%; 157 | height: 100%; 158 | background-color: rgba(170, 170, 170, 0.8); 159 | /* float: right; */ 160 | padding: 3em 0; 161 | display: inline-block; 162 | margin-right: -1em; 163 | border-radius: 0 .5em .5em 0; 164 | } 165 | .right h3 { 166 | font-size: 1em; 167 | /* line-height: 3em;*/ 168 | } 169 | .right button { 170 | margin: auto; /* alignment */ 171 | 172 | } 173 | /*=== CUES === */ 174 | 175 | #vertical { 176 | margin: 10px 43%;/* text-align: center; */ 177 | } 178 | .lg-img { 179 | width: 900px; 180 | } 181 | .lg-rotate { 182 | transform: rotate(-90deg); 183 | transform-origin: 100%, 0; 184 | } 185 | /* === Scroll to Top === */ 186 | 187 | /* Back to top button */ 188 | #back-top { 189 | position: fixed; 190 | bottom: 30px; 191 | margin-left: 75px; 192 | } 193 | #back-top a { 194 | width: 108px; 195 | display: block; 196 | text-align: center; 197 | font: 11px/100% Arial, Helvetica, sans-serif; 198 | text-transform: uppercase; 199 | text-decoration: none; 200 | color: #bbb; 201 | /* background color transition */ 202 | -webkit-transition: 1s; 203 | -moz-transition: 1s; 204 | transition: 1s; 205 | } 206 | #back-top a:hover { 207 | color: #000; 208 | } 209 | /* arrow icon (span tag) */ 210 | #back-top span { 211 | width: 108px; 212 | height: 108px; 213 | display: block; 214 | margin-bottom: 7px; 215 | background: #ddd url("up-arrow.png") no-repeat center center; 216 | /* rounded corners */ 217 | -webkit-border-radius: 15px; 218 | -moz-border-radius: 15px; 219 | border-radius: 15px; 220 | /* background color transition */ 221 | -webkit-transition: 1s; 222 | -moz-transition: 1s; 223 | transition: 1s; 224 | } 225 | #back-top a:hover span { 226 | background-color: #777; 227 | } 228 | /* === FOOTER === */ 229 | footer { 230 | margin: 0 auto; 231 | text-align: center; 232 | background: #c0c0c0; 233 | padding-top: 1em; 234 | padding-bottom: 1em; 235 | } 236 | footer p { 237 | padding-top: 2em; 238 | } 239 | footer a { 240 | color: #555; 241 | } 242 | /* === MEDIA QUERIES === */ 243 | 244 | /* === TEMPORARY === */ 245 | #ship-promo { 246 | background: goldenrod; 247 | color: #333; 248 | margin: 0; 249 | } 250 | -------------------------------------------------------------------------------- /rb/data/data.ods: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/rb/data/data.ods -------------------------------------------------------------------------------- /rb/demo.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 |

16 |
17 | 18 | 28 | 29 | 30 | 31 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /rb/home.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | RackBusters - Home 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 |
26 | 27 |
28 | 29 |
©2009-2019 Rack Busters
30 | 31 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /rb/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 11 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | Rack Busters | Billiard & Game Room Supplies 23 | 24 | 25 | 26 | 27 |
28 | 29 | 33 | 34 | 35 | Rack Busters Logo 36 |

Billiard & Game Room Supplies

37 | 38 |

39 | Free Shipping (on orders over $100) 40 |

41 | 42 | 63 |
64 | 65 |
66 |
67 | 68 |
69 |
70 |
71 |
72 |
73 | 77 |
78 |
79 | 80 |
81 |
82 | 113 |
114 |
115 |
116 |
117 |
118 |
119 | 123 |
124 |
125 |
126 |
127 | 137 |
138 |
139 |
140 |
141 |
142 |
143 | 147 |
148 |
149 |
150 |
151 | 163 |
164 |
165 |
166 |
167 |
168 |
169 | 173 |
174 |
175 | 176 |
177 |
178 | 195 |
196 |
197 |
198 |
199 |
200 |
201 | 205 |
206 |
207 |
208 |
209 | 215 |
216 |
217 |
218 |
219 |
220 |
221 | 225 |
226 |
227 |
228 |
229 | 240 |
241 |
242 |
243 | 244 | 245 |
246 |
247 |
248 | 252 |
253 |
254 | 255 |
256 |
Need to build nav
257 |
258 |
259 |
260 |
261 |
262 | 266 |
267 |
268 |
269 |
270 |
    271 |
  • 272 |
273 |
274 |
275 |
276 |
277 |
278 |
279 | 283 |
284 |
285 | 286 |
287 |
288 |
    289 |
  • 290 |
  • 291 |
292 |
293 |
294 |
295 |
296 | 297 |
298 | 299 | 300 | 301 | 302 |
303 | 308 |
309 | 310 | 311 |
312 |
313 | 314 | 315 | 316 |

{{ cues.title }}

317 | 318 |
319 |
320 |
321 | 322 | 323 |

{{ cases.title }}

324 | 325 |
326 |
327 |
328 | 329 | 330 |

{{ cueAcc.title }}

331 | 332 |
333 |
334 |
335 | 336 | 337 |
338 |
339 | 340 | 341 |

{{ tableAcc.title }}

342 | 343 |
344 |
345 |
346 | 347 | 348 |

{{ balls.title }}

349 | 350 |
351 |
352 |
353 | 354 | 355 |

{{ felt.title }}

356 | 357 |
358 |
359 |
360 | 361 | 362 |
363 |
364 | 365 | 366 |

{{ lights.title }}

367 | 368 |
369 |
370 |
371 | 372 | 373 |

{{ training.title }}

374 | 375 |
376 |
377 |
378 | 379 | 380 |

{{ clothing.title }}

381 | 382 |
383 |
384 |
385 |
386 |
387 | 388 |
389 | 390 |
391 |
392 | 393 | 394 |
395 |

Todos:

396 |
    397 |
  1. 398 | 408 |
  2. 409 |
410 |
411 | 412 | 413 | 414 |
415 |

416 | Specials | About | 417 | Contact 418 |

419 |
420 | 421 | Predator Pool Cues 422 | Valley Pool Cues 423 | Harley Davidson pool cues 424 | Deadstroke brand 425 | Griffin Pool Cues 426 | Meucci pool cue brand 427 | Schon Pool Cues 428 | Viking pool cues 429 |
430 |

©2019 RackBusters Billiards

431 |
432 | 433 | 434 | 435 | 436 | 437 | 438 | 439 | 440 | 441 | 442 | 443 | -------------------------------------------------------------------------------- /rb/js/app.js: -------------------------------------------------------------------------------- 1 | var products = function ( Full_Sku, Parent_Sku, Child_Sku, Detail_Image_Name, Thumbnail_Image_Name, New_Product, Product_Category, Product_Name, Available_Options, Weight_lb, MSRP, MAP, MAP_, Wholesale_Price, Box_Width_in, Box_Length_in, Box_Height_in, Number_of_Boxes, Ships_in_Own_Box, Country_Of_Origin, Description_1, Description_2, Description_3, Description_4, Description_5, Description_6, Description_7, Description_8, Description_9, Description_10, Description_11, Description_12, Description_13, Description_14, Description_15, Description_16) { 2 | this.Full_Sku = fSku, 3 | this.Parent_Sku = pSku, 4 | this.Child_Sku = cSku, 5 | this.Detail_Image_Name = image, 6 | this.Thumbnail_Image_Name = thumb, 7 | this.New_Product = isNew, 8 | this.Product_Category = category, 9 | this.Product_Name = pName, 10 | this.Available_Options = options, 11 | this.Weight_lb = weight, 12 | this.MSRP = retail, 13 | this.MAP = minPrice, 14 | this.MAP_ = discount, 15 | this. Wholesale_Price = cost, 16 | // shipping (proper assignment? use seperate function?) 17 | this.Box_Width_in = width, 18 | this.Box_Length_in = length, 19 | this.Box_Height_in = height, 20 | this.Number_of_Boxes = numBoxes, 21 | this.Ships_in_Own_Box = ownBox, 22 | this.Country_Of_Origin = country, 23 | // details (proper assignment? use seperate function?) 24 | this.Description_1 = detail[0], 25 | this.Description_2 = detail[1], 26 | this.Description_3 = detail[2], 27 | this.Description_4 = detail[3], 28 | this.Description_5 = detail[4], 29 | this.Description_6 = detail[5], 30 | this.Description_7 = detail[6], 31 | this.Description_8 = detail[7], 32 | this.Description_9 = detail[8], 33 | this.Description_10 = detail[9], 34 | this.Description_11 = detail[10], 35 | this.Description_12 = detail[11], 36 | this.Description_13 = detail[12], 37 | this.Description_14 = detail[13], 38 | this.Description_15 = detail[14], 39 | this.Description_16 = detail[15] 40 | }; 41 | 42 | var output = document.getElementById('output'); 43 | 44 | for(product in products){ 45 | output.innerHTML += product + '
'; 46 | }; -------------------------------------------------------------------------------- /rb/js/csv-parse.js: -------------------------------------------------------------------------------- 1 | new Vue({ 2 | el: "#app", 3 | data() { 4 | return { 5 | channel_name: "", 6 | channel_fields: [], 7 | channel_entries: [], 8 | parse_header: [], 9 | parse_csv: [], 10 | sortOrders: {}, 11 | sortKey: "" 12 | }; 13 | }, 14 | filters: { 15 | capitalize: function(str) { 16 | return str.charAt(0).toUpperCase() + str.slice(1); 17 | } 18 | }, 19 | methods: { 20 | sortBy: function(key) { 21 | var vm = this; 22 | vm.sortKey = key; 23 | vm.sortOrders[key] = vm.sortOrders[key] * -1; 24 | }, 25 | csvJSON(csv) { 26 | var vm = this; 27 | var lines = csv.split("\n"); 28 | var result = []; 29 | var headers = lines[0].split(","); 30 | vm.parse_header = lines[0].split(","); 31 | lines[0].split(",").forEach(function(key) { 32 | vm.sortOrders[key] = 1; 33 | }); 34 | 35 | lines.map(function(line, indexLine) { 36 | if (indexLine < 1) return; // Jump header line 37 | 38 | var obj = {}; 39 | var currentline = line.split(","); 40 | 41 | headers.map(function(header, indexHeader) { 42 | obj[header] = currentline[indexHeader]; 43 | }); 44 | 45 | result.push(obj); 46 | }); 47 | 48 | result.pop(); // remove the last item because undefined values 49 | 50 | return result; // JavaScript object 51 | }, 52 | loadCSV(e) { 53 | var vm = this; 54 | if (window.FileReader) { 55 | var reader = new FileReader(); 56 | reader.readAsText(e.target.files[0]); 57 | // Handle errors load 58 | reader.onload = function(event) { 59 | var csv = event.target.result; 60 | vm.parse_csv = vm.csvJSON(csv); 61 | }; 62 | reader.onerror = function(evt) { 63 | if (evt.target.error.name == "NotReadableError") { 64 | alert("Canno't read file !"); 65 | } 66 | }; 67 | } else { 68 | alert("FileReader are not supported in this browser."); 69 | } 70 | } 71 | } 72 | }); 73 | -------------------------------------------------------------------------------- /rb/js/functions.js: -------------------------------------------------------------------------------- 1 | var product = function (Full_Sku, Parent_Sku, Child_Sku, Detail_Image_Name, Thumbnail_Image_Name, New_Product, Product_Category, Product_Name, Available_Options, Weight_lb, MSRP, MAP, MAP_, Wholesale_Price, Box_Width_in, Box_Length_in, Box_Height_in, Number_of_Boxes, Ships_in_Own_Box, Country_Of_Origin, Description_1, Description_2, Description_3, Description_4, Description_5, Description_6, Description_7, Description_8, Description_9, Description_10, Description_11, Description_12, Description_13, Description_14, Description_15, Description_16) { 2 | this.Full_Sku = fSku, 3 | this.Parent_Sku = pSku, 4 | this.Child_Sku = cSku, 5 | this.Detail_Image_Name = image, 6 | this.Thumbnail_Image_Name = thumb, 7 | this.New_Product = isNew, 8 | this.Product_Category = category, 9 | this.Product_Name = pName, 10 | this.Available_Options = options, 11 | this.Weight_lb = weight, 12 | this.MSRP = retail, 13 | this.MAP = minPrice, 14 | this.MAP_ = discount, 15 | this. Wholesale_Price = cost, 16 | // shipping (proper assignment? use seperate function?) 17 | this.Box_Width_in = width, 18 | this.Box_Length_in = length, 19 | this.Box_Height_in = height, 20 | this.Number_of_Boxes = numBoxes, 21 | this.Ships_in_Own_Box = ownBox, 22 | this.Country_Of_Origin = country, 23 | // details (proper assignment? use seperate function?) 24 | this.Description_1 = detail[0], 25 | this.Description_2 = detail[1], 26 | this.Description_3 = detail[2], 27 | this.Description_4 = detail[3], 28 | this.Description_5 = detail[4], 29 | this.Description_6 = detail[5], 30 | this.Description_7 = detail[6], 31 | this.Description_8 = detail[7], 32 | this.Description_9 = detail[8], 33 | this.Description_10 = detail[9], 34 | this.Description_11 = detail[10], 35 | this.Description_12 = detail[11], 36 | this.Description_13 = detail[12], 37 | this.Description_14 = detail[13], 38 | this.Description_15 = detail[14], 39 | this.Description_16 = detail[15] 40 | }; 41 | 42 | 43 | 44 | // product data 45 | var obj = JSON.parse(json); 46 | 47 | details.innerHTML += JSON.stringify(json) + '
'; 48 | var json = require('./data/data.json'); 49 | 50 | 51 | var details = document.getElementById('details'); 52 | 53 | 54 | 55 | 56 | obj.forEach(function(item, i){ 57 | for(p in item){ 58 | details.innerHTML += p + ': ' + item[p] + '
'; 59 | } 60 | details.innerHTML += '
'; 61 | }); 62 | 63 | for(p in obj){ 64 | details.innerHTML += obj[p] + '
'; 65 | } 66 | // // shipping calculation 67 | // var shipping = function(shipRate, width, length, height, numBoxes, /*ownBox,*/ country) { 68 | // var shipPrice = width * length * height * shipRate * numBoxes; 69 | // shipCost.innerHTML += '

shipping: $' + shipPrice + '

'; 70 | // shipCost.innerHTML += '

Made in ' + country + '

'; 71 | // } 72 | // var shipCost = document.getElementById('shipping-cost'); 73 | 74 | // var output2 = document.getElementById('output2'); 75 | 76 | 77 | // console.log(str.toLowerCase()); 78 | 79 | 80 | // categories 81 | 82 | cueBrands = [ 83 | '5280', 84 | 'Action', 85 | 'Athena', 86 | 'Blade', 87 | 'Cuetec', 88 | 'Dufferin', 89 | 'Elite', 90 | 'Griffin', 91 | 'Harley Davidson', 92 | 'Joss', 93 | 'Lucasi', 94 | 'Mayhem', 95 | 'McDermott', 96 | 'McFarland', 97 | 'Meucci', 98 | 'Mezz', 99 | 'Outlaw', 100 | 'Peradon', 101 | 'Riley', 102 | 'Schon', 103 | 'Scorpion', 104 | 'Stealth', 105 | 'Tiger', 106 | 'Trouble Shooter Cues', 107 | 'Valley', 108 | 'Viking', 109 | 'Voodoo' 110 | ]; 111 | -------------------------------------------------------------------------------- /rb/js/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * product access 3 | */ 4 | // is this correct? or use Full_Sku: 5 | // function getFullSku() { 6 | // fullSku = pSku + ' ' + cSku + '.0 '; 7 | // } 8 | 9 | // function getDescription() { 10 | // if (description1 != "") { 11 | // console.log(this); 12 | // } 13 | // } 14 | 15 | /** 16 | * 17 | */ 18 | 19 | 20 | new Vue({ 21 | el: '#app', 22 | data: { 23 | pSku: Parent_Sku, 24 | cSku: Child_Sku, 25 | fSku: Full_Sku, 26 | image: Detail_Image_Name, 27 | thumb: Thumbnail_Image_Name, 28 | new: New_Product, 29 | cat: Product_Category, 30 | pName: Product_Name, 31 | pOptions: Available_Options, 32 | weight: Weight_lb, 33 | price: MSRP, 34 | minPrice: MAP, 35 | cost: Wholesale_Price, 36 | shipping: [ 37 | Box_Width_in, 38 | Box_Length_in, 39 | Box_Height_in, 40 | Number_of_Boxes, 41 | Ships_in_Own_Box, 42 | Country_Of_Origin 43 | ], 44 | details: [ 45 | Description_1, 46 | Description_2, 47 | Description_3, 48 | Description_4, 49 | Description_5, 50 | Description_6, 51 | Description_7, 52 | Description_8, 53 | Description_9, 54 | Description_10, 55 | Description_11, 56 | Description_12, 57 | Description_13, 58 | Description_14, 59 | Description_15, 60 | Description_16 61 | ] 62 | } 63 | }); 64 | 65 | 66 | 67 | // nav 68 | 69 | // promo 70 | 71 | // featured categories 72 | 73 | // banner ad slider - affilliates 74 | 75 | // top Picks 76 | 77 | // Popular 78 | 79 | // top selling products 80 | 81 | // category listings 82 | 83 | 84 | 85 | /*, 86 | function(data) { 87 | /** 88 | * output all data to table 89 | 90 | 91 | var html = ""; 92 | html += ""; 93 | html += ""; 94 | html += ""; 95 | //html += ""; 96 | html += ""; 97 | html += ""; 98 | html += ""; 99 | html += ""; 100 | html += ""; 101 | 102 | for (var i = 0; i < data.length; i++) { 103 | html += ""; 104 | html += ""; 105 | html += ""; 106 | // 107 | html += ''; 108 | html += ""; 109 | html += ""; 110 | html += ""; 111 | } 112 | html += "
P SkuC SkuimagethumbcatpOptionsprice
" + data[i].pSku + "" + data[i].cSku + "" + data[i].cat + "" + data[i].pOptions + "" + data[i].price + "
"; 113 | 114 | document.getElementById("demo").innerHTML = html; 115 | } */ 116 | -------------------------------------------------------------------------------- /rb/js/nav.js: -------------------------------------------------------------------------------- 1 | new Vue({ 2 | el: '#brand-logos', 3 | data: { 4 | image: "old\\Logos", 5 | description: '', 6 | height: '' 7 | }, 8 | methods: { 9 | logos: function () { 10 | //alert(''); 11 | } 12 | }); 13 | 14 | new Vue({ 15 | el: '#pool-cue-brands', 16 | data: { 17 | link: 'brandLink', 18 | brand: [ 19 | 'Action', 20 | 'Athena', 21 | '', 22 | ] 23 | 24 | }, 25 | methods: { 26 | 27 | }, 28 | template: { // idea for links 29 | '
  • '{{ brand }}'
  • ' 30 | } 31 | }); 32 | -------------------------------------------------------------------------------- /rb/js/rb-demo.js: -------------------------------------------------------------------------------- 1 | // var app = new Vue({ 2 | // el: '#product', 3 | // data: { 4 | // name: 'McDermott M16', 5 | // pSku: 'CX04' 6 | // } 7 | // }); 8 | 9 | // var lookup = {}; 10 | // for (var i = 0, len = array.length; i < len; i++) { 11 | // lookup[array[i].Parent_Sku] = array[i]; 12 | // } 13 | // ... now you can use lookup[]... 14 | 15 | var app = new Vue({ 16 | el: "#app", 17 | data: { 18 | /*product: "Socks", 19 | description: "A pair of warm, fuzzy socks", 20 | image: "./img/vmSocks-green.png", 21 | url: "./img/vmSocks-blue.png", 22 | inStock: true, 23 | inventory: 100, 24 | onSale: true, 25 | details: ["80% cotton", "20% polyester", "gender-neutral"], 26 | variants: [ 27 | { 28 | variantId: 2234, 29 | variantColor: "green", 30 | variantImage: "./img/vmSocks-green.png" 31 | }, 32 | { 33 | variantId: 2235, 34 | variantColor: "blue", 35 | variantImage: "./img/vmSocks-blue.png" 36 | } 37 | ], 38 | sizes: ["small", "medium", "large"],*/ 39 | products: [ 40 | { 41 | Full_Sku: "15-4101 14 ", 42 | Parent_Sku: "15-4101", 43 | Child_Sku: 14, 44 | Detail_Image_Name: "15-4101.JPG", 45 | Thumbnail_Image_Name: "15-4101.JPG", 46 | New_Product: "", 47 | Product_Category: "Darts", 48 | Product_Name: "Bull Seeker Dart Steel Tip ", 49 | Available_Options: "14 gram", 50 | Weight_lb: 0.15, 51 | MSRP: "$4.95", 52 | MAP: "", 53 | MAP_percent: "", 54 | Wholesale_Price: "$2.75", 55 | Box_Width_in: 0, 56 | Box_Length_in: 0, 57 | Box_Height_in: 0, 58 | Number_of_Boxes: 1, 59 | Ships_in_Own_Box: "No", 60 | Country_Of_Origin: "Made in China ", 61 | Description_1: "Bull Seeker Darts", 62 | Description_2: "Brass barrels", 63 | Description_3: "Nylon shaft/Flight Combo", 64 | Description_4: "Steel Tips", 65 | Description_5: "14 gram only", 66 | Description_6: "", 67 | Description_7: "", 68 | Description_8: "", 69 | Description_9: "", 70 | Description_10: "", 71 | Description_11: "", 72 | Description_12: "", 73 | Description_13: "", 74 | Description_14: "", 75 | Description_15: "", 76 | Description_16: "" 77 | }, { 78 | Full_Sku: "15-4105 16 ", 79 | Parent_Sku: "15-4105", 80 | Child_Sku: 16, 81 | Detail_Image_Name: "15-4105.JPG", 82 | Thumbnail_Image_Name: "15-4105.JPG", 83 | New_Product: "", 84 | Product_Category: "Darts", 85 | Product_Name: "Mark-It Dart Soft Tip ", 86 | Available_Options: "16 gram", 87 | Weight_lb: 0.1, 88 | MSRP: "$7.95", 89 | MAP: "", 90 | MAP_percent: "", 91 | Wholesale_Price: "$2.50", 92 | Box_Width_in: 0, 93 | Box_Length_in: 0, 94 | Box_Height_in: 0, 95 | Number_of_Boxes: 1, 96 | Ships_in_Own_Box: "No", 97 | Country_Of_Origin: "Made in China ", 98 | Description_1: "Mark-It Darts", 99 | Description_2: "Brass barrels", 100 | Description_3: "Nylon shafts", 101 | Description_4: "2ba Nylon tips", 102 | Description_5: "16 gram only", 103 | Description_6: "", 104 | Description_7: "", 105 | Description_8: "", 106 | Description_9: "", 107 | Description_10: "", 108 | Description_11: "", 109 | Description_12: "", 110 | Description_13: "", 111 | Description_14: "", 112 | Description_15: "", 113 | Description_16: "" 114 | }, { 115 | Full_Sku: "15-4120 16 ", 116 | Parent_Sku: "15-4120", 117 | Child_Sku: 16, 118 | Detail_Image_Name: "15-4120.JPG", 119 | Thumbnail_Image_Name: "15-4120.JPG", 120 | New_Product: "", 121 | Product_Category: "Darts", 122 | Product_Name: "Inferno Dart Soft Tip ", 123 | Available_Options: "16 gram", 124 | Weight_lb: 0.55, 125 | MSRP: "$24.95", 126 | MAP: "", 127 | MAP_percent: "", 128 | Wholesale_Price: "$10.50", 129 | Box_Width_in: 0, 130 | Box_Length_in: 0, 131 | Box_Height_in: 0, 132 | Number_of_Boxes: 1, 133 | Ships_in_Own_Box: "No", 134 | Country_Of_Origin: "Made in China ", 135 | Description_1: "2 Toned Nickel plated barrels", 136 | Description_2: "Aluminum shafts", 137 | Description_3: "2ba Nylon tips", 138 | Description_4: "16 gram", 139 | Description_5: "Deluxe tri-pack case, includes: out chart, dart tool and 6 flight protectors", 140 | Description_6: "", 141 | Description_7: "6 Extra flights and 3 Extra Nylon Shafts", 142 | Description_8: "20 Extra 2ba Nylon Tips", 143 | Description_9: "*Flights and shafts may vary*", 144 | Description_10: "", 145 | Description_11: "", 146 | Description_12: "", 147 | Description_13: "", 148 | Description_14: "", 149 | Description_15: "", 150 | Description_16: "" 151 | }, { 152 | Full_Sku: "15-4120 18 ", 153 | Parent_Sku: "15-4120", 154 | Child_Sku: 18, 155 | Detail_Image_Name: "15-4120.JPG", 156 | Thumbnail_Image_Name: "15-4120.JPG", 157 | New_Product: "", 158 | Product_Category: "Darts", 159 | Product_Name: "Inferno Dart Soft Tip ", 160 | Available_Options: "18 gram", 161 | Weight_lb: 0.55, 162 | MSRP: "$24.95", 163 | MAP: "", 164 | MAP_percent: "", 165 | Wholesale_Price: "$10.50", 166 | Box_Width_in: 0, 167 | Box_Length_in: 0, 168 | Box_Height_in: 0, 169 | Number_of_Boxes: 1, 170 | Ships_in_Own_Box: "No", 171 | Country_Of_Origin: "Made in China ", 172 | Description_1: "2 Toned Nickel plated barrels", 173 | Description_2: "Aluminum shafts", 174 | Description_3: "2ba Nylon tips", 175 | Description_4: "18 gram", 176 | Description_5: "Deluxe tri-pack case, includes: out chart, dart tool and 6 flight protectors", 177 | Description_6: "", 178 | Description_7: "6 Extra flights and 3 Extra Nylon Shafts", 179 | Description_8: "20 Extra 2ba Nylon Tips", 180 | Description_9: "*Flights and shafts may vary*", 181 | Description_10: "", 182 | Description_11: "", 183 | Description_12: "", 184 | Description_13: "", 185 | Description_14: "", 186 | Description_15: "", 187 | Description_16: "" 188 | } 189 | ] 190 | }, 191 | methods: { 192 | addToCart() { 193 | this.cart += 1; 194 | }, 195 | // updateImage(products) { 196 | // image = this.Thumbnail_Image_Name 197 | // }, 198 | removeFromCart() { 199 | this.cart -= 1; 200 | }, 201 | getSingle(products) { 202 | for (p in products) { 203 | fSku = this.Full_Sku, 204 | pSku = this.Parent_Sku, 205 | cSku = this.Child_Sku, 206 | thumb = this.Thumbnail_Image_Name, 207 | image = this.Detail_Image_Name, 208 | isNew = this.New_Product, 209 | category = this.Product_Category, 210 | name = this.Product_Name, 211 | options = this.Available_Options, 212 | // weight = this.Weight_lb, 213 | retail = this.MSRP, 214 | minPrice = this.MAP, 215 | discount = this.MAP_percent, 216 | cost = this.Wholesale_Price, 217 | // Shipping 218 | width = this.Box_Width_in, 219 | length = this.Box_Length_in, 220 | height = this.Box_Height_in, 221 | numBoxes = this.Number_of_Boxes, 222 | ownBox = this.Ships_in_Own_Box, 223 | country = this.Country_Of_Origin, 224 | details = [ 225 | this.Description_1, 226 | this.Description_2, 227 | this.Description_3, 228 | this.Description_4, 229 | this.Description_5, 230 | this.Description_6, 231 | this.Description_7, 232 | this.Description_8, 233 | this.Description_9, 234 | this.Description_10, 235 | this.Description_11, 236 | this.Description_12, 237 | this.Description_13, 238 | this.Description_14, 239 | this.Description_15, 240 | this.Description_16 241 | ] 242 | } 243 | }} 244 | 245 | // featured(getSingle) { 246 | // for (let i=0; i 0) { 18 | var days_late = days_deadline-days; 19 | var opacity = (days_late*100/days_deadline)/100; 20 | opacity = (opacity < 0) ? 0 : opacity; 21 | opacity = (opacity > 1) ? 1 : opacity; 22 | if(opacity >= 0 && opacity <= 1) { 23 | console.log(opacity); 24 | document.getElementsByTagName("HTML")[0].style.opacity = opacity; 25 | 26 | } 27 | } 28 | 29 | })(); -------------------------------------------------------------------------------- /rb/js/vm-app.js: -------------------------------------------------------------------------------- 1 | /* var app = new Vue({ 2 | el: "#app", 3 | data: { 4 | product: "Socks", 5 | description: "A pair of warm, fuzzy socks", 6 | image: "./img/vmSocks-green.png", 7 | url: "./img/vmSocks-blue.png", 8 | inStock: true, 9 | inventory: 100, 10 | onSale: true, 11 | details: ["80% cotton", "20% polyester", "gender-neutral"], 12 | variants: [ //plural 13 | { 14 | variantId: 2234, 15 | variantColor: "green", 16 | variantImage: "./img/vmSocks-green.png" 17 | }, 18 | { 19 | variantId: 2235, 20 | variantColor: "blue", 21 | variantImage: "./img/vmSocks-blue.png" 22 | } 23 | ], 24 | sizes: ["small", "medium", "large"], 25 | cart: 0, 26 | }, 27 | methods: { 28 | addToCart() { 29 | this.cart += 1; 30 | }, 31 | updateProduct(variantImage) { 32 | this.image = variantImage; 33 | }, 34 | removeFromCart() { 35 | this.cart -= 1; 36 | } 37 | } 38 | }); 39 | */ 40 | 41 | new Vue({ 42 | el: "#app", 43 | // used find/replace to format data 44 | data: { 45 | products: [{ 46 | Full_Sku: "15-4101 14 ", 47 | Parent_Sku: "15-4101", 48 | Child_Sku: 14, 49 | Detail_Image_Name: "15-4101.JPG", 50 | Thumbnail_Image_Name: "15-4101.JPG", 51 | New_Product: "", 52 | Product_Category: "Darts", 53 | Product_Name: "Bull Seeker Dart Steel Tip ", 54 | Available_Options: "14 gram", 55 | Weight_lb: 0.15, 56 | MSRP: "$4.95", 57 | MAP: "", 58 | MAP_: "", 59 | Wholesale_Price: "$2.75", 60 | Box_Width_in: 0, 61 | Box_Length_in: 0, 62 | Box_Height_in: 0, 63 | Number_of_Boxes: 1, 64 | Ships_in_Own_Box: "No", 65 | Country_Of_Origin: "Made in China ", 66 | Description_1: "Bull Seeker Darts", 67 | Description_2: "Brass barrels", 68 | Description_3: "Nylon shaft/Flight Combo", 69 | Description_4: "Steel Tips", 70 | Description_5: "14 gram only", 71 | Description_6: "", 72 | Description_7: "", 73 | Description_8: "", 74 | Description_9: "", 75 | Description_10: "", 76 | Description_11: "", 77 | Description_12: "", 78 | Description_13: "", 79 | Description_14: "", 80 | Description_15: "", 81 | Description_16: "", 82 | "": "" 83 | }, { 84 | Full_Sku: "15-4105 16 ", 85 | Parent_Sku: "15-4105", 86 | Child_Sku: 16, 87 | Detail_Image_Name: "15-4105.JPG", 88 | Thumbnail_Image_Name: "15-4105.JPG", 89 | New_Product: "", 90 | Product_Category: "Darts", 91 | Product_Name: "Mark-It Dart Soft Tip ", 92 | Available_Options: "16 gram", 93 | Weight_lb: 0.1, 94 | MSRP: "$7.95", 95 | MAP: "", 96 | MAP_: "", 97 | Wholesale_Price: "$2.50", 98 | Box_Width_in: 0, 99 | Box_Length_in: 0, 100 | Box_Height_in: 0, 101 | Number_of_Boxes: 1, 102 | Ships_in_Own_Box: "No", 103 | Country_Of_Origin: "Made in China ", 104 | Description_1: "Mark-It Darts", 105 | Description_2: "Brass barrels", 106 | Description_3: "Nylon shafts", 107 | Description_4: "2ba Nylon tips", 108 | Description_5: "16 gram only", 109 | Description_6: "", 110 | Description_7: "", 111 | Description_8: "", 112 | Description_9: "", 113 | Description_10: "", 114 | Description_11: "", 115 | Description_12: "", 116 | Description_13: "", 117 | Description_14: "", 118 | Description_15: "", 119 | Description_16: "", 120 | "": "" 121 | }, { 122 | Full_Sku: "15-4120 16 ", 123 | Parent_Sku: "15-4120", 124 | Child_Sku: 16, 125 | Detail_Image_Name: "15-4120.JPG", 126 | Thumbnail_Image_Name: "15-4120.JPG", 127 | New_Product: "", 128 | Product_Category: "Darts", 129 | Product_Name: "Inferno Dart Soft Tip ", 130 | Available_Options: "16 gram", 131 | Weight_lb: 0.55, 132 | MSRP: "$24.95", 133 | MAP: "", 134 | MAP_: "", 135 | Wholesale_Price: "$10.50", 136 | Box_Width_in: 0, 137 | Box_Length_in: 0, 138 | Box_Height_in: 0, 139 | Number_of_Boxes: 1, 140 | Ships_in_Own_Box: "No", 141 | Country_Of_Origin: "Made in China ", 142 | Description_1: "2 Toned Nickel plated barrels", 143 | Description_2: "Aluminum shafts", 144 | Description_3: "2ba Nylon tips", 145 | Description_4: "16 gram", 146 | Description_5: "Deluxe tri-pack case, includes: out chart, dart tool and 6 flight protectors", 147 | Description_6: "", 148 | Description_7: "6 Extra flights and 3 Extra Nylon Shafts", 149 | Description_8: "20 Extra 2ba Nylon Tips", 150 | Description_9: "*Flights and shafts may vary*", 151 | Description_10: "", 152 | Description_11: "", 153 | Description_12: "", 154 | Description_13: "", 155 | Description_14: "", 156 | Description_15: "", 157 | Description_16: "", 158 | "": "" 159 | }, { 160 | Full_Sku: "ZZSP 20.5 ", 161 | Parent_Sku: "ZZSP", 162 | Child_Sku: 20.5, 163 | Detail_Image_Name: "ZZSP.JPG", 164 | Thumbnail_Image_Name: "ZZSP.JPG", 165 | New_Product: "", 166 | Product_Category: "Mezz Cues", 167 | Product_Name: "Mezz - Sneaky Pete ", 168 | Available_Options: "20.5 oz ", 169 | Weight_lb: 1.4, 170 | MSRP: "$545.00", 171 | MAP: "$463.25", 172 | MAP_: "15%", 173 | Wholesale_Price: "$337.90", 174 | Box_Width_in: 0, 175 | Box_Length_in: 0, 176 | Box_Height_in: 0, 177 | Number_of_Boxes: 1, 178 | Ships_in_Own_Box: "No", 179 | Country_Of_Origin: "Made in Japan ", 180 | Description_1: "Tip: A 12.8mm Moori Medium tip ", 181 | Description_2: "Ferrule: Softer X-Ferrule and special Internal Support System", 182 | Description_3: "Shaft: New WD700 shaft made of Hard rock maple", 183 | Description_4: "Joint: Mikis united Joint ", 184 | Description_5: " Pin: 5/16x14 semi quick release", 185 | Description_6: "Forearm: Hard rock maple with 4 black ebony diamonded points", 186 | Description_7: "Ring: Black with thin nickel silver ", 187 | Description_8: " Collar: High impact polished stainless steel", 188 | Description_9: "Wrap: Laminated Black high impact plastic", 189 | Description_10: "Sleeve: laminated ebony and birdseye maple", 190 | Description_11: "Plate: Plate: Black Proprietary plastic stamped with the Mezz logo ", 191 | Description_12: " Bumper: Black x-rubber rubber with Interchangeable weight bolt system", 192 | Description_13: "", 193 | Description_14: "", 194 | Description_15: "", 195 | Description_16: "" 196 | } 197 | ] 198 | }, 199 | methods: { 200 | // WIP: looking up syntax and defining variables 201 | getId(id) { 202 | id === this.Parent_Sku; 203 | }, 204 | // Cart 205 | addToCart() { 206 | this.cart += 1; 207 | }, 208 | removeFromCart() { 209 | this.cart -= 1; 210 | } 211 | } 212 | }); 213 | -------------------------------------------------------------------------------- /rb/rb-logo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/rb/rb-logo.jpg -------------------------------------------------------------------------------- /wireframes/categories.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/wireframes/categories.jpg -------------------------------------------------------------------------------- /wireframes/proto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/wireframes/proto.png -------------------------------------------------------------------------------- /wireframes/single-product.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/GWGweb-projectgroup/practice-project/355b6d1eedb886dae7d3dd31c1ead9f86dbccd9d/wireframes/single-product.png --------------------------------------------------------------------------------