Best practices to deliver theme in Drupalgap application

I want the mobile responsive version of my site available on mobile via my Drupalgap app.

Is that possible? Have you done that before?

Yes, it's possible. You'd have to do some type of client side detection that would forward along a mobile user to your headless DrupalGap web application. For example, stuff DrupalGap into a "/app" folder, then on your Drupal front end, check to see if it's a mobile device, then forward them along to "/app".

I have done this before, but I no longer recommend it, simply because with a headless web application you sacrifice SEO and sometimes even more importantly, you don't have the ability to share things via Facebook (because Facebook can't crawl a web app, it can only crawl a web site).

Then I would like to create a native theme based on my Drupal site.

Is this possible? Or am i thinking about this incorrectly

Yes, this is possible. I've been working hard on something similar for a project using DG8 and Bootstrap 4. Essentially I am making many micro services and micro widgets that can be shared between the Drupal front end and the DG8 front end. The cool thing about D8+DG8 is you can inject DG8 into your Drupal front by attaching it as a javascript library, then you can abstract and share these widgets between the 2 different front ends.

Not impossible, but definitely challenging, and worth it in the end.