Change primary color

[mitch2k]

Hi,

I'm trying to change the primary color for Laravel Material dasbhoard pro according to https://demos.creative-tim.com/material-dashboard-pro/docs/2.1/getting-started/build-tools.html#change-brand-colors I have changed the colors in public/material/scss/material-dashboard/variables

Now I'm trying to run gulp compile-scss, but I get

C:\wamp64\www\ciportal>gulp compile-scss[11:06:00] No gulpfile found

There is indeed no gulp file. Also in the downloaded file, I can't see the gulp file. How should I proceed to change the primay color?

Thanks

[teamupdivision]

Hello, thank you for using our products!

For building the Laravel page we have not used scss. In order to change the primary color, you need to replace it directly everywhere in the css/material-dashboard.css.

Thank you

[aefika]

I've managed to generate the css from the included material-dashboard.scss using Laravel Mix & Webpack. Here are my steps:

1. Moved \public\material\scss\ to \resources\scss\
2. Edited webpack.mix.js with a single instruction: mix.sass('resources/scss/material-dashboard.scss', 'public/css')
3. npm install (only once)
4. set OPENSSL_CONF= // Fixes open SSL problem
5. npm run dev At this point the included css file seems to be exactly to the generated css (there are more lines on the generated css though) You can always change the destination folder in the mix instruction @teamupdivision, it might be a good option to update the documentation to build the css. Laravel uses Laravel Mix

@teamupdivision, I'm finding some contradictions, how to address them, example: in one place .page-header .footer { position: static }, in other place header .footer { position: absolute }

[teamupdivision]

Hello @aefika, thanks for the answer and for using our products!

Can you please help us out with where you found the different position values, can you send us the exact css file and css line where the property is?

Thanks

[aefika]

A diff shows what are the differences to the file attached.

When looking into those differences, the vast majority are spaces or quotes, but some of them look more than that. I was under the impression that the scss files where the ones used to generate the css.

I’m using the Laravel Mix compiled css because I’m changing colors globally.

Some of the differences that I see could affect behaviour are:

.register-page .bootstrap-select:not([class="col-"]):not([class="form-control"]):not(.input-group-btn) {

• width:calc(100% - 56px) !important;

-}

-

-.page-header > .container {

• flex-grow: 1;

-}

-

-.page-header {

• flex-direction: column;

• padding-bottom: 0 !important;

-}

-

-.page-header .footer {

• flex-grow: 0;

• position: static

-}

-

-.page-header.login-page {

• max-height: inherit;

• height:auto;

-}

-

-.off-canvas-sidebar .navbar-collapse:after {

• background-color: #282828;

-}

-

-.off-canvas-sidebar .wrapper-full-page .page-header {

• padding-bottom: 0px !important;

-}

-

-/# sourceMappingURL=dashboard-pro.css.map /

Luis Nicho, Ing., MGP, PMP

Directeur des opérations

AEfika Services-conseil

T +1 (514) 258 6215

C mailto:luis.nicho@aefika.com luis.nicho@aefika.com

OUTILS PRATIQUES SUR MESURE POUR

RÉVOLUTIONNER VOTRE TRAVAIL

http://www.aefika.com/ www.aefika.com

(SVP noter que je suis basé à Montréal et que mon fuseau horaire est UTC -05 :00)

From: Updivision Team [mailto:notifications@github.com] Sent: January 29, 2020 4:19 AM To: creativetimofficial/ct-material-dashboard-pro-laravel ct-material-dashboard-pro-laravel@noreply.github.com Cc: Luis Nicho luis.nicho@aefika.com; Mention mention@noreply.github.com Subject: Re: [creativetimofficial/ct-material-dashboard-pro-laravel] Change primary color (#12)

Hello @aefika https://github.com/aefika , thanks for the answer and for using our products!

Can you please help us out with where you found the different position values, can you send us the exact css file and css line where the property is?

Thanks

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/creativetimofficial/ct-material-dashboard-pro-laravel/issues/12?email_source=notifications&email_token=AJXEH5HBHJQ3GOHPSBMR4ATRAFCWXA5CNFSM4KLW2IV2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEKGP5YA#issuecomment-579665632 , or unsubscribe https://github.com/notifications/unsubscribe-auth/AJXEH5DYSQJB3S6UINTAGZ3RAFCWXANCNFSM4KLW2IVQ . https://github.com/notifications/beacon/AJXEH5GSRBPJLWLFXP2WWRLRAFCWXA5CNFSM4KLW2IV2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEKGP5YA.gif

[teamupdivision]

Hello @aefika The different static values for the footer are based on the page it's shown. In a page with a fixed height (full-sized) like this one: https://www.creative-tim.com/live/material-dashboard-pro-laravel has a position: static; to always stay on the bottom of the page.