MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    Image Galery

    Scheduled Pinned Locked Moved Requests
    34 Posts 13 Posters 33.5k Views 14 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • J Offline
      Jeff @Mephiston2K
      last edited by

      I trying to get shadows around the picture to get a smooth overlay from the picture to the mirrors backround.
      I’m not sure how to do this. The only way I know, i to change the original picture e.g. on instagram and put a black shadow overlay around. But I’m not really happy with this solution.
      Maybe someone knows better…

      @Mephiston2K said in Image Galery:

      @Ultimatum22
      would love to see an option to configure when the picture will change. Not based on the uptime of the mirror + x seconds.
      More like based on the clock[daily, full hour, every x minute, every x seconds],

      for this you could use the module where the modules on the mirror are changed by time.
      Just copy this image module, so you have image module one and two… then set the time.

      I know, not a clean way to do it, but at least it should work.

      yawnsY 1 Reply Last reply Reply Quote 0
      • yawnsY Offline
        yawns Moderator @Jeff
        last edited by yawns

        @Jeff said in Image Galery:

        I trying to get shadows around the picture to get a smooth overlay from the picture to the mirrors backround.
        I’m not sure how to do this. The only way I know, i to change the original picture e.g. on instagram and put a black shadow overlay around. But I’m not really happy with this solution.
        Maybe someone knows better…

        Some options I could think of, by just modifying your css file.

        1. adds a small drop shadow to the image on the right side and at the bottom
        #MMM-Instagram-image {
            box-shadow: 5px 5px 5px #aaa;
        }
        
        1. adds a “glowing” shadow all around the image
        #MMM-Instagram-image {
            box-shadow: 2px 2px 15px #aaa, -2px 2px 15px #aaa, 2px -2px 15px #aaa, -2px -2px 15px #aaa;
        }
        
        1. make it look like a polaroid thrown on the mirror
        #MMM-Instagram-image {
            box-shadow: 10px 10px 15px #aaa;
        	padding: 10px 10px 30px 10px;
        	border: 1px solid #bfbfbf;
        	background-color: #fff;
        	transform: rotate(-6deg);
        	-ms-transform: rotate(-6deg);
        	-webkit-transform: rotate(-6deg);
        }
        

        Not sure if this is what you are looking for. If you go for the polaroid look (which I really like) you could add several “versions” with different rotation values and change the class when loading the next image to have some randomness.

        1 Reply Last reply Reply Quote 1
        • J Offline
          Jeff
          last edited by

          I think that’s what I was looking for!
          CCS was the way I was thinking about, but just couldn’t find the right code.

          Will try it later. Thanks alot

          1 Reply Last reply Reply Quote 0
          • F Offline
            fragator
            last edited by

            0_1480979655148_thumbnail_IMG_0109.jpg
            @yawns

            Works perfectly, thanks for the info.
            I also just want to enlarge the image, what and the code for that.

            yawnsY 1 Reply Last reply Reply Quote 1
            • M Offline
              Mephiston2K
              last edited by

              Wow, thats quite cool!
              You are a good guy for creating this for your mom and I guess she will love it.

              1 Reply Last reply Reply Quote 0
              • F Offline
                fragator
                last edited by

                @Mephiston2K
                The advantage of this module is that I created an instagram count, and give all the info to my sisters. Which will allow my mother to have the pictures of the whole family regularly.
                On the other hand, the picture does not unfortunately just a day. The way i found it for that, and to have the magic mirror restart automatically at night, to allow the photos to bring it up to date.

                1 Reply Last reply Reply Quote 0
                • yawnsY Offline
                  yawns Moderator @fragator
                  last edited by

                  @fragator said in Image Galery:

                  0_1480979655148_thumbnail_IMG_0109.jpg
                  @yawns

                  Works perfectly, thanks for the info.
                  I also just want to enlarge the image, what and the code for that.

                  Looks really cool. I did not anticipate that.

                  1 Reply Last reply Reply Quote 1
                  • 1
                  • 2
                  • 3
                  • 4
                  • 1 / 4
                  • First post
                    Last post
                  Enjoying MagicMirror? Please consider a donation!
                  MagicMirror created by Michael Teeuw.
                  Forum managed by Sam, technical setup by Karsten.
                  This forum is using NodeBB as its core | Contributors
                  Contact | Privacy Policy