creativetimofficial / black-dashboard

MIT License
344 stars 313 forks source link

Trying to use this with angular 7 #13

Closed drashti2277 closed 5 years ago

drashti2277 commented 5 years ago

Hello, I got "Black Dashboard Pro" with me. I am trying to use this template in Angular 7 project and I'm facing problems like : 1) making it responsive in nature. 2) Even if I am hard coding the dropdown, isnt working on my angular 7 component's HTML page. 3) Having problem in rendering chart.js charts which i evaluated in my component's ts file. Is there any way it will work with my angular project properly? Thanks in advance.

rarestoma commented 5 years ago

Hello,

Thank you for the interest in our products.

Our team is working at the angular version and it will be released in a few weeks but we don't know exactly when it will be ready. All the problems that you have will be solved in our angular version.

All the best, Rares

drashti2277 commented 5 years ago

Alright.Thanks for your quick response.

Can you please tell me how do I change styling to make its in iphoneX mode. All I am trying is to change styling and position of html page components. I figured out you have included media query " @media (max-width: 575.98px) ". But it will be great help if you can provide some info regarding how I can achieve that.

Thanks a lot. Regards. Drashti Solanki

On Thu, Jan 10, 2019 at 4:06 AM rarestoma notifications@github.com wrote:

Hello,

Thank you for the interest in our products.

Our team is working at the angular version and it will be released in a few weeks but we don't know exactly when it will be ready. All the problems that you have will be solved in our angular version.

All the best, Rares

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/creativetimofficial/black-dashboard/issues/13#issuecomment-453021366, or mute the thread https://github.com/notifications/unsubscribe-auth/AkqeZPW1Wgd6zCwZbb02pNlibkYxC1W2ks5vBwKFgaJpZM4Z4dJZ .

rarestoma commented 5 years ago

Hi,

Can you show me exactly how do you want your page to look on screen resolution smaller that 575.98? Or give me your code to see what is not looking that good on phone resolutions?

All the best, Rares

drashti2277 commented 5 years ago

Hello,

I was able to solve that problem by writing few new media queries. And we almost made "Black Dashboard Pro" java script template work with angular 7 project. Last thing I'm trying to achieve is to make this responsive. Its JavaScript version is working fine with responsive nature but as I have embedded it with Angular 7 it is not showing responsive nature for devices with width less than 1024px. I tried changing media query with max/min-device-width but it dint work.

I want to show below shown nav bar for all devices but it only works for "width:1024px".

Can you please help me or provide some insight on this? [image: image.png] Thanks & Regards.

On Fri, Jan 11, 2019 at 7:25 AM rarestoma notifications@github.com wrote:

Hi,

Can you show me exactly how do you want your page to look on screen resolution smaller that 575.98? Or give me your code to see what is not looking that good on phone resolutions?

All the best, Rares

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/creativetimofficial/black-dashboard/issues/13#issuecomment-453501353, or mute the thread https://github.com/notifications/unsubscribe-auth/AkqeZHYblqg2pam430wPxie67CgzRZPXks5vCIKtgaJpZM4Z4dJZ .

rarestoma commented 5 years ago

Hi,

Did you try with @media (max-width: 1024px) {} ?

All the best, Rares

drashti2277 commented 5 years ago

Yes, I did but it dint work.

But I was able to solve that problem. I observe that navbar has absolute class and main panel have relative class so thought of adjusting things around it. So, I removed .navbar class of (max-width:991.98px) and it started working fine with all responsiveness working! It was present but was not showing up because of style {top:-70px} Main problem was

@media (max-width: 991.98px) { .navbar { top: -70px; }}

Thanks for your time. Have a great day!

On Tue, Jan 22, 2019 at 3:23 AM rarestoma notifications@github.com wrote:

Hi,

Did you try with @media https://github.com/media (max-width: 1024px) {} ?

All the best, Rares

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/creativetimofficial/black-dashboard/issues/13#issuecomment-456310398, or mute the thread https://github.com/notifications/unsubscribe-auth/AkqeZIem0dzrFpcp1ml21gsaBK_J5Yy5ks5vFsp9gaJpZM4Z4dJZ .