Bootstrap Theme error: Problem with setting the color scheme

Question

I'm designing a webpage for my non-profit association, and to make things easier I buyed a bootstrap theme template (Leap Bootstrap Theme).

In the main folder of my project, I have the following folders:

/dist
/forms
/js
/node_modules
/pages
/scss

Inside the '/scss' folder, in order to modify the color scheme of the theme, to set the colors I want, I have to modify the file '/scss/user-variables.css' in that way:

// 
// 
// user-variables.scss
//
// Place your own variable overrides here, these will override any Bootstrap and theme variables.


// Color Scheme
// Uncomment the variables below and change the hex values.

$primary: #3D3B3C;
$primary-2: #FDFDB7;
$primary-3: #3D3B3C;

// Do not change or remove the $theme-color-scheme or $theme-colors maps below

$theme-color-scheme: (
    "primary":    $primary,
    "primary-2":  $primary-2,
    "primary-3":  $primary-3
);

$theme-colors: (
    "primary":    $primary,
    "primary-2":  $primary-2,
    "primary-3":  $primary-3,
);

The 'index.html' file is inside the '/pages' folder, with other folders (css, js, img, fonts, ...).

When I'm making these changes with gulp and browsersync, it is showed the rightful color scheme that I want (as I coded into the user-variables.css file).

The problem is when I upload the files into the web hosting server. When I access to the website, I still see the original color scheme of the bootstrap theme instead of the colours I set. What is corious, is some external users view the rightful colours.

Inside the 'public' folder I only upload the 'index.html' file and the '/assets' folder. Do I have to upload that 'user-variables.css' file, and where?

Could you help me with that problem? Sorry, but I'm new in this world.

Thanks!

Not sure if this fixed the error, but you have an extra comma here `"primary-3": $primary-3,`, try removing it and see if it works — Marc Hjorth, Apr 09 '19 at 08:10
No, that comma didn't fix the error. But thank you, anyways! :) — Maties Alzina Soler, Apr 09 '19 at 08:18
If other users see the right colors, try bumping your css. It might be cached in your browser. — Marc Hjorth, Apr 09 '19 at 08:25
The URL of the website: [link](http://www.granotsisopes.cat/) What color do you see? Blue or black-lighted? What do you mean with bumping my css? — Maties Alzina Soler, Apr 09 '19 at 08:26
@MatiesAlzinaSoler can you tell me the colors you want to change with these colors ? — HUSSAIN, Apr 09 '19 at 10:00
The colors that I want are: $primary: #3D3B3C; $primary-2: #FDFDB7; $primary-3: #3D3B3C; — Maties Alzina Soler, Apr 09 '19 at 10:41
The color you said were right. So you are viewing my website as it should. Does the error come from the navigator? — Maties Alzina Soler, Apr 09 '19 at 10:43

score 0 · Accepted Answer · answered Apr 09 '19 at 09:14

0

For my part, your site is illuminated black. Maties Alzina Soler wants to tell you to clear your cache, I suppose. To do this, press SHIFT + F5 or Ctrl + F5 on your site.

answered Apr 09 '19 at 09:14

Alexandre

76
1
7

1

I cleaned all navigator data from the PC, and now I see the right colours. But I'm still seeing the wrong colours from my mobile and Ipad, despite of having cleaned the navigator data. – Maties Alzina Soler Apr 09 '19 at 10:45
Your problem always comes from the css cache, but this time from your phone. https://doctolib.zendesk.com/hc/fr/articles/208440616-Vider-le-cache-du-navigateur-sur-mobile If it really doesn't change anything, try tools like CCleaner. – Alexandre Apr 09 '19 at 12:15

Bootstrap Theme error: Problem with setting the color scheme

1 Answers1