Move SCSS to styles folder

This commit is contained in:
mDuo13
2020-07-07 13:20:05 -07:00
parent 6c3aba129c
commit dd7b467b16
6 changed files with 1335 additions and 4 deletions

View File

@@ -25,6 +25,7 @@ The XRPL Dev Portal provides comprehensive documentation of the the XRP Ledger,
- [content/\_snippets/](content/_snippets/) - Reusable chunks of Markdown text that are included in other content files, using the Dactyl preprocessor.
- [img/](img/) - Images used by the documentation contents.
- [tool/](tool/) - Templates, style-checker rules, and other scripts.
- [styles/](styles/) - Source files (SCSS) to generate the CSS files in the assets folder.
- [`dactyl-config.yml`](dactyl-config.yml) - Main config file, which contains the metadata for all the docs. For information on our conventions, see [Config Formatting](#config-formatting).
## Requirements for a Successful Pull Request

File diff suppressed because one or more lines are too long

37
styles/README.md Normal file
View File

@@ -0,0 +1,37 @@
# XRPL Styles
This folder contains the source files for the XRP Ledger Dev Portal CSS. The combined, minified version of these styles is `assets/css/devportal.css`.
## Prerequisites
To edit or modify these styles, you need to install Bootstrap's SCSS files. The included `package.json` file should help you do this using [Yarn](https://yarnpkg.com/) or [NPM](https://www.npmjs.com/). For example, if you have Yarn installed, run the following command from this directory:
```sh
$ yarn
```
You also need a SASS/SCSS compiler; the dependency file should install [node-sass](https://www.npmjs.com/package/sass) and a script for running it by default. You can also use [`sassc`](https://github.com/sass/sassc/), which can be installed using your system's package manager (Linux) or Homebrew (macOS).
## Building
To build the output file using node-sass, run the following command from this directory:
```sh
$ yarn run build-css
```
(You could also use `npm` instead of `yarn`.)
To build the output file using sassc, run the following command from this directory:
```sh
$ sassc xrpl.scss -t compressed -m > ../assets/css/devportal.css
```
You can omit the `-m` (include source map) to reduce the output file size. It provides useful information when debugging styles, about which original file specific rules came from.
## Files
`xrpl.scss` is the master file that includes all the other, `_`-prefixed SCSS files. This file also defines common colors and other utilities.
Files prefixed with `_dactyl-` are pulled from the Dactyl built-in styles. You should edit these files as little as possible so that they we can pull in updates from upstream as easily as possible. ***TODO: Publish these files on NPM so they can be imported/installed the same way the Bootstrap styles are.***

9
styles/package.json Normal file
View File

@@ -0,0 +1,9 @@
{
"devDependencies": {
"bootstrap": "^4.5.0",
"node-sass": "^4.14.1"
},
"scripts": {
"build-css": "node-sass --include-path scss xrpl.scss ../assets/css/devportal.css --output-style compressed"
}
}

1282
styles/yarn.lock Normal file

File diff suppressed because it is too large Load Diff