Glassmorphism in Power Platform Canvas Apps

Поділитися
Вставка
  • Опубліковано 19 гру 2024

КОМЕНТАРІ • 37

  • @UncleBubba
    @UncleBubba 8 днів тому

    Great video, thanks.
    By the way, a quick PSA: When you took the SVG code into VSCode to do a Find/Replace... I like to work in VSCode for a lot of stuff, but for simple things Find/Replace... you can do that directly in the formula bar in Power Apps itself.
    Just highlight the formula/text range you want to do the Find/Replace on, then press Ctrl+H. You'll get a little Find/Replace box right there in the formula bar.

    • @Novalogix-ltd
      @Novalogix-ltd  4 дні тому +1

      Hey UncleBubba! Good shout I did know it existed, it's a habit I prefer the highlighting and formatting in VSCode when I am reading through code but for sure you could just do it in the editor!

  •  4 місяці тому +3

    There is a 5px padding by default in HTML control. I usually get rid of that first, and than subtract 1 px from the height and no scrollbars. Well done Colin! 👍

    • @Novalogix-ltd
      @Novalogix-ltd  4 місяці тому

      Haha thanks, now I know for next time!

  • @joshcesana
    @joshcesana 2 місяці тому +1

    Great job - really cool idea.

  • @callfusion2012
    @callfusion2012 Місяць тому

    Thanks for sharing, this is cool!

    • @Novalogix-ltd
      @Novalogix-ltd  16 днів тому

      So glad you like it, thanks for the comment ;)

  • @imran002ali
    @imran002ali 4 місяці тому +2

    Hi, great video, thanks for sharing the knowledge. 👍

  • @DanZech
    @DanZech 2 місяці тому +1

    Hey, thanks a lot for sharing!

  • @fcnc3024
    @fcnc3024 4 місяці тому

    Took Power Apps to another level! That’s hot

    • @Novalogix-ltd
      @Novalogix-ltd  4 місяці тому +1

      Thank you, it does look pretty snazzy doesn't it!

  • @yogeshm8344
    @yogeshm8344 3 місяці тому

    Awesome work! ❤

    • @Novalogix-ltd
      @Novalogix-ltd  3 місяці тому

      Thank you! Sometimes it's the simple things that really shine!

    • @yogeshm8344
      @yogeshm8344 3 місяці тому

      @@Novalogix-ltd Yes... I was worked like this glassmorphism..but use images like glass..but use container it's really awesome 😁

  • @DaHooka
    @DaHooka 3 місяці тому

    Nice one, never thought of using html control to force webstyles

    • @Novalogix-ltd
      @Novalogix-ltd  3 місяці тому

      I try not to use them too much but it certainly gives you more flexible styling options for some cool effects!

  • @Muhmmmadibrahim_
    @Muhmmmadibrahim_ 4 місяці тому

    Appreciate 🎉, Great videos

  • @mosesmhango9197
    @mosesmhango9197 4 місяці тому

    This is great video

  • @rowanreynolds7853
    @rowanreynolds7853 14 днів тому

    Great video, the SVG does not seem to animate using the native ios app, any idea why?

    • @Novalogix-ltd
      @Novalogix-ltd  4 дні тому

      Hi, You aren't the first to mention that, the code is HTML so will likely need some browser compatibility changes, it works for me on my IPad I don't have an IPhone to test on unfortunately.

  • @petsworld000
    @petsworld000 3 місяці тому

    Great ❤🎉

  • @shehanpeiris2838
    @shehanpeiris2838 4 місяці тому +1

    This is great! But the only concern is that "backdrop-filter: blur" doesn't work in iPhones or iOS if you want this to be a mobile app and integrate it on MS Teams

    • @fcnc3024
      @fcnc3024 4 місяці тому +1

      Oh! Good call out. Would definitely want to know how to resolve that for sure

    • @Novalogix-ltd
      @Novalogix-ltd  4 місяці тому +1

      Hi, good call out, you will notice the html styles also use webkit-backdrop-filter to cover all devices, add as many other styles in as you like! Enjoy

    • @fcnc3024
      @fcnc3024 3 місяці тому

      @@Novalogix-ltd I recreated what you showed in your youtube video. It's perfection again. I did go into PowerApps app on my Iphone 13 Pro Max and the background is not moving. I am wondering what needs to be changed?

    • @Novalogix-ltd
      @Novalogix-ltd  3 місяці тому

      Hi, it works on my Android in the app player, I pulled the SVG directly from the website in my video but didn't check it for cross platform it may need some tweaks to the animation functions used?

    • @SantiagoJ-v4m
      @SantiagoJ-v4m Місяць тому

      @@fcnc3024 I guess the only work around for this in the meantime is to convert that svg into a gif file. That will works on mobiles.

  • @RyanKuy-t4c
    @RyanKuy-t4c 3 місяці тому

    more tutorials please

  • @JohnHall
    @JohnHall 24 дні тому

    Creating cross platform problems on a platform designed to eliminate cross platform problems.

    • @Novalogix-ltd
      @Novalogix-ltd  16 днів тому +1

      :D this was 100% a creative flex, not once have my enterprise clients want this much zazz, I generally avoid HTML components but you have to admit it does look pretty cool!