Anson/Redline-Racing-Website
1
0
Fork 0
mirror of https://gitlab.com/redline-racing-division/redline-racing-website.git synced 2025-07-31 02:21:29 +00:00
Code Releases Activity

complete redo

Browse Source
This commit is contained in:
Anson
2019-11-06 18:03:33 -07:00
parent 326ba84663
commit 1ef8b0739b
145 changed files with 51809 additions and 20275 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
README.md
View File

@@ -1,72 +1,68 @@
# Website Documentation
# [Start Bootstrap - One Page Wonder](https://startbootstrap.com/template-overviews/one-page-wonder/)
The idea of this page is to make it so that even a monkey can make changes to the website. Unfortunately these docs were also written by a monkey so when you inevitably run into issues I suggest you consult [Google](https://google.com) or in dire cases you may want to contact the mysterious [Anson Biggs](mailto:anson@ansonbiggs.com).
[One Page Wonder](http://startbootstrap.com/template-overviews/one-page-wonder/) is a basic one page template for [Bootstrap](http://getbootstrap.com/) created by [Start Bootstrap](http://startbootstrap.com/).
- [Website Documentation](#website-documentation)
- [Background Image](#background-image)
- [Updating Sponsors](#updating-sponsors)
- [Field Descriptions](#field-descriptions)
- [Example list.json](#example-listjson)
## Preview
## Background Image
[![One Page Wonder Preview](https://startbootstrap.com/assets/img/screenshots/themes/one-page-wonder.png)](https://blackrockdigital.github.io/startbootstrap-one-page-wonder/)
Most images are embedded in `html` and its pretty straight forward to update them. However, background images are defined by CSS which means you will unfortunately have to dig a little deeper. I would actually recommend just replacing `images\bg.webp` and `images\bg-min.webp` which means that you won't have to change any code to change the background. `webp` is a fancy file extension for internet stuff that supposedly loads faster, and the `-min` file is just a smaller version of the image for smaller screens like phones.
**[View Live Preview](https://blackrockdigital.github.io/startbootstrap-one-page-wonder/)**
The file you have to update is: `assets\css\main.css`. This is where almost all of the styling of the website lives and it is a *scary* file because there isn't a person on earth that can use CSS correctly, and at the time of writing the file is 4275 lines long. I would recommend just using ctrl-f to find the `background-image` property and going from there.
## Status
**[I would recommend ImageMagick to compress any new background images.](https://imagemagick.org/index.php)**
[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://raw.githubusercontent.com/BlackrockDigital/startbootstrap-one-page-wonder/master/LICENSE)
[![npm version](https://img.shields.io/npm/v/startbootstrap-one-page-wonder.svg)](https://www.npmjs.com/package/startbootstrap-one-page-wonder)
[![Build Status](https://travis-ci.org/BlackrockDigital/startbootstrap-one-page-wonder.svg?branch=master)](https://travis-ci.org/BlackrockDigital/startbootstrap-one-page-wonder)
[![dependencies Status](https://david-dm.org/BlackrockDigital/startbootstrap-one-page-wonder/status.svg)](https://david-dm.org/BlackrockDigital/startbootstrap-one-page-wonder)
[![devDependencies Status](https://david-dm.org/BlackrockDigital/startbootstrap-one-page-wonder/dev-status.svg)](https://david-dm.org/BlackrockDigital/startbootstrap-one-page-wonder?type=dev)
## Updating Sponsors
## Download and Installation
Updating the sponsors is as simple as downloading a nice looking image of the sponsors logo, dropping it into the `./images/sponsors/` directory and editing the file in the `sponsors` directory named `list.json`. Inside the `list.json` file there is a list of companies with some metadata information that is used for building the webpage and telling search engines what the image actually is so its important that all fields are filled out as fully as possible and correctly.
To begin using this template, choose one of the following options to get started:
* [Download the latest release on Start Bootstrap](https://startbootstrap.com/template-overviews/one-page-wonder/)
* Install via npm: `npm i startbootstrap-one-page-wonder`
* Clone the repo: `git clone https://github.com/BlackrockDigital/startbootstrap-one-page-wonder.git`
* [Fork, Clone, or Download on GitHub](https://github.com/BlackrockDigital/startbootstrap-one-page-wonder)
*Make sure alt text is properly filled in. This is information for disabled and blind people to understand what the image is, [and not using it means we could be vulnerable to a lawsuit.](https://www.latimes.com/politics/story/2019-10-07/blind-person-dominos-ada-supreme-court-disabled)*
## Usage
### Field Descriptions
### Basic Usage
```json
{
"companyName": "Should be the full name of the company",
"company_URL": "Should be the url pointing to the home page of the company unless otherwise specified. Preferably a https:// link.",
"company_image": "images/sponsors/imgName.ext - This can also be a url to an image hosted on another site if the sponsor wants that, otherwise try to keep the file local and inside of the sponsors directory.",
"SponsorLevel": "simply 'gold', 'silver', or 'bronze'",
"altText": "Full name of company and maybe their slogan or something. This describes what the image is to search engines and people that can't see well (more common than you would think). Try to keep this to 2-3 scentences don't write a novel like I am right now."
}
```
After downloading, simply edit the HTML and CSS files included with the template in your favorite text editor to make changes. These are the only files you need to worry about, you can ignore everything else! To preview the changes you make to the code, you can open the `index.html` file in your web browser.
### Example list.json
### Advanced Usage
```json
{
"Companies": [
{
"companyName": "Red Bull Racing",
"company_URL": "https://redbullracing.redbull.com/",
"company_image": "images/sponsors/RedBullEnergy.png",
"SponsorLevel": "gold",
"altText": "Red Bull Formula 1 Racing"
},
{
"companyName": "Mercedes AMG",
"company_URL": "https://www.mercedes-amg.com/en.html",
"company_image": "images/sponsors/mercedes.png",
"SponsorLevel": "bronze",
"altText": "Mercedes Benz AMG"
},
{
"companyName": "The Hub Grill and Bar",
"company_URL": "https://www.hubgrill.com",
"company_image": "images/sponsors/HUB_LOGO_OFFICIAL.png",
"SponsorLevel": "silver",
"altText": "The Hub Grill and Bar Mesa, Az"
},
{
"companyName": "Haas F1",
"company_URL": "http://haasf1team.com/",
"company_image": "https://proxy.duckduckgo.com/iu/?u=https%3A%2F%2Fcdn.bleacherreport.net%2Fimages%2Fteam_logos%2F328x328%2Fhaas.png&f=1&nofb=1",
"SponsorLevel": "gold",
"altText": "Haas Formula One Team"
}
]
}
```
After installation, run `npm install` and then run `npm start` which will open up a preview of the template in your default browser, watch for changes to core template files, and live reload the browser when changes are saved. You can view the `gulpfile.js` to see which tasks are included with the dev environment.
#### Gulp Tasks
- `gulp` the default task that builds everything
- `gulp watch` browserSync opens the project in your default browser and live reloads when changes are made
- `gulp css` compiles SCSS files into CSS and minifies the compiled CSS
- `gulp js` minifies the themes JS file
- `gulp vendor` copies dependencies from node_modules to the vendor directory
You must have npm installed globally in order to use this build environment.
## Bugs and Issues
Have a bug or an issue with this template? [Open a new issue](https://github.com/BlackrockDigital/startbootstrap-one-page-wonder/issues) here on GitHub or leave a comment on the [template overview page at Start Bootstrap](http://startbootstrap.com/template-overviews/one-page-wonder/).
## About
Start Bootstrap is an open source library of free Bootstrap templates and themes. All of the free templates and themes on Start Bootstrap are released under the MIT license, which means you can use them for any purpose, even for commercial projects.
* https://startbootstrap.com
* https://twitter.com/SBootstrap
Start Bootstrap was created by and is maintained by **[David Miller](http://davidmiller.io/)**, Owner of [Blackrock Digital](http://blackrockdigital.io/).
* http://davidmiller.io
* https://twitter.com/davidmillerskt
* https://github.com/davidtmiller
Start Bootstrap is based on the [Bootstrap](http://getbootstrap.com/) framework created by [Mark Otto](https://twitter.com/mdo) and [Jacob Thorton](https://twitter.com/fat).
## Copyright and License
Copyright 2013-2019 Blackrock Digital LLC. Code released under the [MIT](https://github.com/BlackrockDigital/startbootstrap-one-page-wonder/blob/gh-pages/LICENSE) license.