Topic: Custom Pagination color
How i can change pagination color in skin? I used _custom-skin.scss
Hi,
so you need to install any preprocessor: https://sass-lang.com/install or use Gulp together with MDB Gulp package: https://mdbootstrap.com/education/bootstrap/gulp-installation/.
Best, Marta
Hi,
have you recompiled your mdb.css file after changing _custom-skin.scss file? Do you see a changed pagination color in mdb.css file?
Best, Marta
Hello! It is doesn`t work. I changed the skin_scss, but pagination color did not change
// Your custom skin
// Skins
$skins: () !default;
$skins: map-merge((
"test": (
"skin-primary-color":#d32f2f,
"skin-navbar": #fff,
"skin-footer-color": #fff,
"skin-flat": #fff,
"skin-accent": #fff,
"skin-sidenav-item": #fff,
"skin-sidenav-item-hover": #fff,
"skin-gradient-start": #fff,
"skin-gradient-end": #fff,
"skin-mask-slight": #fff,
"skin-mask-light": #fff,
"skin-mask-strong": #fff,
"skin-sn-child": #fff,
"skin-btn-primary": #fff,
"skin-btn-secondary": #fff,
"skin-btn-default": #fff,
"skin-text": #fff,
)
), $skins);
Hi,
in your object, you need to change the value of this key skin-primary-color to change the color of pagination.
Best, Marta
p_manageroksoft-ru pro commented 5 years ago
Hi Marta, thanks! I`l try it
Marta Wierzbicka staff commented 5 years ago
You're, welcome.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Pro
- Premium support: No
- Technology: General Bootstrap questions
- MDB Version: -
- Device: lenovo
- Browser: chrome
- OS: windows
- Provided sample code: No
- Provided link: No
Bartłomiej Malanowski staff commented 5 years ago
Could you please share the code that you've tried and didn't work?
p_manageroksoft-ru pro commented 5 years ago
http://fucoidan-world.oksoft.ru/news/rubrics/1
// Your custom skin // Skins $skins: () !default; $skins: map-merge(( "test": ( "skin-primary-color": #fff, "skin-navbar": #fff, "skin-footer-color": #fff, "skin-flat": #fff, "skin-accent": #fff,
"skin-sidenav-item": #fff,
"skin-sidenav-item-hover": #fff, "skin-gradient-start": #fff, "skin-gradient-end": #fff, "skin-mask-slight": #fff, "skin-mask-light": #fff, "skin-mask-strong": #fff, "skin-sn-child": #fff, "skin-btn-primary": #fff, "skin-btn-secondary": #fff, "skin-btn-default": #fff, "skin-text": #fff, ) ), $skins);