Introducing ReUI:Open-source UI components and apps built with React, Next.js and Tailwind CSS
Browse ReUI

Assistance Needed for Invoice Integration and Styling in Metronic Angular


Dear Metronic Support,

I am integrating the invoice creation feature from the Metronic HTML template into the Metronic Angular template. Specifically, I aim to replicate the functionality for line item amount and total amount calculations, as demonstrated in the HTML template. Could you guide me on how to achieve this?

Additionally, I encountered an issue with the datepicker. I tried both the native HTML datepicker and the ngbDatepicker, but neither is styled like the datepicker in your HTML online demo. Could you provide recommendations for styling it consistently?

Lastly, I noticed that the main app dev wrapper in the Angular template appears larger than in the HTML demo. How can I adjust its size to match the HTML version?

Thank you for your support.

Best regards,
Abdelmuniem


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)


The request for assistance with invoice integration and styling in Metronic Angular seems like a great opportunity to improve the look and functionality of invoices in the project. It important to make sure that both the integration and styling are seamless for a smooth user experience.
I am in the process of writing my thesis and I could really use some help. I have been thinking about getting assistance and came across some options for best thesis writing services but I’m unsure which one is the right fit. Has anyone here used a service before? If yes, how was your experience? Did they help you with the structure, research, and writing? I really want to ensure my thesis meets the academic standards, so any advice would be appreciated! Let me know your thoughts.Best Thesis Writing Services



I'd be happy to help you with integrating the invoice creation feature and addressing the styling issues in your Metronic Angular template!
Invoice Creation Feature word games
To replicate the line item amount and total amount calculations from the Metronic HTML template in your Angular template, you can follow these steps:
Copy HTML Components: Copy the relevant HTML components from the Metronic HTML template to your Angular template.
Convert to Angular Components: Convert the copied HTML components into Angular components. Ensure you use Angular's data binding and component structure.
Implement Calculations: Implement the calculations for line item amounts and total amounts using Angular's services and TypeScript.



Hi Abdelmuniem,

Could you please share a screenshot of the component you’re referring to?

For the datepicker, have you imported the original styles from the plugin into the angular.json styles section? This might resolve the styling.

To update the app dev wrapper size, open the file:

/src/app/_metronic/layout/core/configs/dark-sidebar.config.ts

Find and replace all occurrences of "fluid" with "fixed".

Let us know if you need further assistance!

Thanks


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(