D4mations.com

Custom Bootstrap Theme With Sass

[ad_1]
https://i.ytimg.com/vi/pB7EwxwSfVk/hqdefault.jpg



In this video we will build a completely custom Twitter Bootstrap theme with the Sass Pre-compiler. We will use other technologies such as…

Bootstrap-sass
Koala
NPM
Bower
Live-Server
Font-Awesome

Theme Files – https://github.com/bradtraversy/bizlight_theme

Original source

d4mer

,
, , , , , , , ,

43 responses to “Custom Bootstrap Theme With Sass”

  1. Great tutorial! When I ran index.html, I get this error:
    Error: File to import not found or unreadable: ../bower_components/bootsrap-sass/assets/stylesheets/bootstrap
    Load path: C:/Projects/Youtube/Bootstrap theme with SASS/sass
    on line 1 of C:ProjectsYoutubeBootstrap theme with SASSsassapp.scss
    What causes this??

  5. Has anybody notced that the icons on the right are not visible due to some color problems? See this picture:

    https://i.imgur.com/ivSNEHk.png

    I have downloaded toe full project and it also doesn't have icons on the right.

    Apart from this, the tutorial is pretty good but I have only done about 26 or 27 minutes as installing all the programs takes time and I am on Windows 10 so something didn't work. To start with the path problem. I had to use cmd prompt given by NodeJS as the bat files create the necessary paths on the system. Then you needed to install GIT as well.

  9. Hi, will the variables.scss be loaded twice? There is a variables.scss in the bootstrap and your customVariables. Why does bootstrap not override your variables, because first you include your file and then come the bootstrap files

  13. Brad, when I execute command > "bower install bootstrap-sass –save"

    I got this error:
    "bower ENOGIT git is not installed or not in the PATH"

    I installed Git in C://Program Files/Git but nothing changes.

    EDIT: I've managed to execute this command but from the git-cmd

  14. @17:35 when I change the _customVariables.scss file it won't reflect in the index.html page. However, it works when I change the _variables.scss file in the bootstrap-sass/assets/stylesheets/bootstrap folder it will. Anyone has any idea how I can resolve this issue?

  20. npm WARN deprecated bower@1.8.0: ..psst! While Bower is maintained, we recommend Yarn and Webpack for new front-end projects! Yarn's advantage is security and reliability, and Webpack's is support for both CommonJS and AMD projects. Currently there's no migration path, but please help to create it: https://github.com/bower/bower/issues/2467
    npm ERR! Darwin 16.6.0
    npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "install" "-g" "bower"
    npm ERR! node v6.11.0
    npm ERR! npm v3.10.10
    npm ERR! path ../lib/node_modules/bower/bin/bower
    npm ERR! code EACCES
    npm ERR! errno -13
    npm ERR! syscall symlink

    npm ERR! Error: EACCES: permission denied, symlink '../lib/node_modules/bower/bin/bower' -> '/usr/local/bin/bower'
    npm ERR! at Error (native)
    npm ERR! { Error: EACCES: permission denied, symlink '../lib/node_modules/bower/bin/bower' -> '/usr/local/bin/bower'
    npm ERR! at Error (native)
    npm ERR! errno: -13,
    npm ERR! code: 'EACCES',
    npm ERR! syscall: 'symlink',
    npm ERR! path: '../lib/node_modules/bower/bin/bower',
    npm ERR! dest: '/usr/local/bin/bower' }
    npm ERR!
    npm ERR! Please try running this command again as root/Administrator.

    npm ERR! Please include the following file with any support request:
    npm ERR! /Users/Florencia/9thcms/test-theme/npm-debug.log

  26. I need a little help please, for some reason my sass did not import to index.html, i added the stylesheet, <link rel="stylesheet" href="css/app.css"> when I copied the example template, i got no style. Can someone help? any suggestions?

  35. Thanks for the great videos! Easy to follow along. Just getting into Sass and brushing up on my frontend, everything changes so fast.

    I have a question about the CSS. Why don't you use id = "a" instead of renaming class = "container" and then add the custom id in the custom file? Since you used the same styling on all sections, you could have just set the id. I'm asking because I don't know if there is a rule I don't know of that would make the id usage not an option?

    Your help is appreciated!

  36. I'm getting an error right off the bat in app.scss. Koala says "the system cannot find the path specifid" to @import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap". I've tried other combinations of slashes and dots on the filepath, to no avai.

  42. Hello Brad, i m following the video but app.css and app.css.map is not coming in the css folder both are coming automatically in saas folder and trying to change the height css of navbar but i am unable to do that ? Please help ?

Leave a Reply