π© ΠΠ΅ΡΠ΅ΡΠ±ΠΎΡΠΊΠ° Bootstrap ΡΠ°Π΄ΠΈ Π·Π°ΠΌΠ΅Π½Ρ ΡΠ²Π΅ΡΠΎΠ²
ΠΠ° ΡΡΡΠ°Π½ΠΈΡΠ΅ Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ Customize/Color Π½Π°ΠΏΠΈΡΠ°Π½ΠΎ, ΡΡΠΎ Bootstrap ΠΏΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅Ρ ΠΎΠ±ΡΠΈΡΠ½ΡΡ ΡΠ²Π΅ΡΠΎΠ²ΡΡ ΡΡ Π΅ΠΌΡ ΠΈ ΠΈΡ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΡΡΡ ΠΏΠΎΠ΄ ΠΏΡΠΎΠ΅ΠΊΡ:
Bootstrap is supported by an extensive color system that themes our styles and components. This enables more comprehensive customization and extension for any project.
Π¦Π²Π΅ΡΠ° ΡΠ΅ΠΌΡ (Primary, Success, Dark, Light) Π»Π΅ΠΆΠ°Ρ Π² ΡΠ°ΠΉΠ»Π΅ scss/_variables.scss
, ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½Π°Ρ $theme-colors
.
All these colors are available as a Sass map, $theme-colors.
$theme-colors: (
"primary": $primary,
"secondary": $secondary,
"success": $success,
"info": $info,
"warning": $warning,
"danger": $danger,
"light": $light,
"dark": $dark
);
ΠΠΎΠ΄Π³ΠΎΡΠ°Π²Π»ΠΈΠ²Π°Π΅ΠΌ Bootstrap
ΠΠ»ΠΎΠ½ΠΈΡΡΠ΅ΠΌ ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠΉ
git clone --depth 1 --branch v5.1.3 https://github.com/twbs/bootstrap.git bootstrap-color/
Π‘ΠΊΠ°ΡΠΈΠ²Π°Π΅ΠΌ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ Node.js, ΡΡΠΎ Π·Π°ΠΉΠΌΡΡ Π½Π΅ΠΊΠΎΡΠΎΡΠΎΠ΅ Π²ΡΠ΅ΠΌΡ:
npm update
ΠΡΠ°Π²ΠΊΠ° ΡΠ²Π΅ΡΠΎΠ²
ΠΠ·ΠΌΠ΅Π½ΡΠ΅ΠΌ "primary": $primary,
Π½Π° "primary": #2fb658,
.
ΠΠΎΠΌΠΏΠΈΠ»ΡΡΠΈΡ ΠΈ ΠΌΠΈΠ½ΠΈΡΠΈΠΊΠ°ΡΠΈΡ
ΠΡΠΏΠΎΠ»Π½ΡΠ΅ΠΌ ΠΊΠΎΠΌΠ°Π½Π΄Ρ npm run css
Π΄Π»Ρ ΡΠ±ΠΎΡΠΊΠΈ css ΠΈ ΠΌΠΈΠ½ΠΈΡΠΈΠΊΠ°ΡΠΈΠΈ.
npm run css
ΠΡΠ»ΠΈ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ ΠΏΡΠΎΡΡΠΎ ΡΠΊΠΎΠΌΠΏΠΈΠ»ΠΈΡΠΎΠ²Π°ΡΡ css, Π²ΡΠΏΠΎΠ»Π½ΡΠ΅ΠΌ npm run css
npm run css-compile
ΠΠΎΠΆΠΈΠ΄Π°Π΅ΠΌΡΡ ΠΎΠΊΠΎΠ½ΡΠ°Π½ΠΈΡ… ΠΠΎΡΠΎΠ²ΠΎ.
Π€Π°ΠΉΠ»Ρ Π»Π΅ΠΆΠ°Ρ Π² Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ dist/
.
ΠΡΠΎΠ²Π΅ΡΠΈΡΡ, ΡΡΠΎ CSS ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ»ΠΈΡΡ, ΠΌΠΎΠΆΠ½ΠΎ Π²ΡΠΏΠΎΠ»Π½ΠΈΠ² ΠΏΡΠΎΠ²Π΅ΡΠΊΡ ΡΠΎΡΡΠΎΡΠ½ΠΈΡ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ Git ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΡ.
git status
Π£Π²ΠΈΠ΄ΠΈΠΌ ΡΡΠΎ-ΡΠΎ Π²ΡΠΎΠ΄Π΅
$ git st
Not currently on any branch.
Changes not staged for commit:
(use "git add <file>..." to update what will be committed)
(use "git restore <file>..." to discard changes in working directory)
modified: dist/css/bootstrap-grid.css
modified: dist/css/bootstrap-grid.css.map
modified: dist/css/bootstrap-grid.min.css
...
modified: dist/css/bootstrap.css
modified: dist/css/bootstrap.css.map
modified: package-lock.json
modified: scss/_variables.scss