Bootstrap sass variable for bg-light

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}

I am building a page where elements take bootstrap's default values, i.e.

#some-element {

    background-colour: $code-colour;

    font-size: $font-size-base;

    ...

    colour: $bg-light ??

}

I am looking for the variable that controls the colour of .bg-light class, but can't seem to locate it in _variables.scss.

Any help would be appreciated. Thanks.

edited Jan 3 at 11:37

Zim

199k51421400

asked Jan 3 at 10:13

antikbd

3092719

add a comment |

I am building a page where elements take bootstrap's default values, i.e.

#some-element {

    background-colour: $code-colour;

    font-size: $font-size-base;

    ...

    colour: $bg-light ??

}

I am looking for the variable that controls the colour of .bg-light class, but can't seem to locate it in _variables.scss.

Any help would be appreciated. Thanks.

edited Jan 3 at 11:37

Zim

199k51421400

asked Jan 3 at 10:13

antikbd

3092719

add a comment |

I am building a page where elements take bootstrap's default values, i.e.

#some-element {

    background-colour: $code-colour;

    font-size: $font-size-base;

    ...

    colour: $bg-light ??

}

I am looking for the variable that controls the colour of .bg-light class, but can't seem to locate it in _variables.scss.

Any help would be appreciated. Thanks.

edited Jan 3 at 11:37

Zim

199k51421400

asked Jan 3 at 10:13

antikbd

3092719

I am building a page where elements take bootstrap's default values, i.e.

#some-element {

    background-colour: $code-colour;

    font-size: $font-size-base;

    ...

    colour: $bg-light ??

}

I am looking for the variable that controls the colour of .bg-light class, but can't seem to locate it in _variables.scss.

Any help would be appreciated. Thanks.

colors sass bootstrap-4

edited Jan 3 at 11:37

Zim

199k51421400

asked Jan 3 at 10:13

antikbd

3092719

edited Jan 3 at 11:37

Zim

199k51421400

asked Jan 3 at 10:13

antikbd

3092719

edited Jan 3 at 11:37

Zim

199k51421400

edited Jan 3 at 11:37

Zim

199k51421400

edited Jan 3 at 11:37

Zim

199k51421400

asked Jan 3 at 10:13

antikbd

3092719

asked Jan 3 at 10:13

antikbd

3092719

asked Jan 3 at 10:13

antikbd

3092719

add a comment |

1 Answer
1

active

oldest

votes

The SASS variable is simply called: $light as explained here:
https://getbootstrap.com/docs/4.2/getting-started/theming/#theme-colors

Also, there are no CSS properties named colour or background-colour. Use color...

#some-element {

    background-color: $code-colour;

    font-size: $font-size-base;

    color: $light;

}

Demo: https://www.codeply.com/go/7oDktA3xCt

answered Jan 3 at 10:26

Zim

199k51421400

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54020178%2fbootstrap-sass-variable-for-bg-light%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

The SASS variable is simply called: $light as explained here:
https://getbootstrap.com/docs/4.2/getting-started/theming/#theme-colors

Also, there are no CSS properties named colour or background-colour. Use color...

#some-element {

    background-color: $code-colour;

    font-size: $font-size-base;

    color: $light;

}

Demo: https://www.codeply.com/go/7oDktA3xCt

answered Jan 3 at 10:26

Zim

199k51421400

add a comment |

The SASS variable is simply called: $light as explained here:
https://getbootstrap.com/docs/4.2/getting-started/theming/#theme-colors

Also, there are no CSS properties named colour or background-colour. Use color...

#some-element {

    background-color: $code-colour;

    font-size: $font-size-base;

    color: $light;

}

Demo: https://www.codeply.com/go/7oDktA3xCt

answered Jan 3 at 10:26

Zim

199k51421400

add a comment |

The SASS variable is simply called: $light as explained here:
https://getbootstrap.com/docs/4.2/getting-started/theming/#theme-colors

Also, there are no CSS properties named colour or background-colour. Use color...

#some-element {

    background-color: $code-colour;

    font-size: $font-size-base;

    color: $light;

}

Demo: https://www.codeply.com/go/7oDktA3xCt

answered Jan 3 at 10:26

Zim

199k51421400

The SASS variable is simply called: $light as explained here:
https://getbootstrap.com/docs/4.2/getting-started/theming/#theme-colors

Also, there are no CSS properties named colour or background-colour. Use color...

#some-element {

    background-color: $code-colour;

    font-size: $font-size-base;

    color: $light;

}

Demo: https://www.codeply.com/go/7oDktA3xCt

answered Jan 3 at 10:26

Zim

199k51421400

answered Jan 3 at 10:26

Zim

199k51421400

answered Jan 3 at 10:26

Zim

199k51421400

answered Jan 3 at 10:26

Zim

199k51421400

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

Search This Blog

Ufyukyu