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.

    My custom mirror

    Scheduled Pinned Locked Moved Show your Mirror
    16 Posts 5 Posters 6.1k Views 8 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.
    • BerkSmash1984B Offline
      BerkSmash1984 @greedyvegan
      last edited by

      @greedyvegan very cool! Which module are you using for the word clock?

      8850dc5c-59ad-408e-9ff2-f782a5b0a856-image.png

      G 1 Reply Last reply Reply Quote 0
      • M Offline
        MMRIZE @greedyvegan
        last edited by

        @greedyvegan
        It will look better to arrange newsfeed module more harmonized.
        e8141981-add2-44af-a0f5-206b918e5e3d-image.png

        /* css/custom.css */
        /* This is just and example. Adjust to your color and dimensions */
        
        .MMM-anotherNewsFeed .newsfeed-image {
          min-width: 150px;
          min-height: 150px;
          max-width: 150px;
          max-height: 150px;
          margin: 10px 20px 10px 10px;
          border-radius: 15px;
          background-repeat: no-repeat;
          background-position: center center;
          background-size: cover;
        }
        
        .region .module.MMM-anotherNewsFeed {
          width: 600px;
          height: 300px;
          border-radius: 15px;
          margin-top: 0;
          background-color: #333; 
        }
        
        G 2 Replies Last reply Reply Quote 1
        • G Offline
          greedyvegan @MMRIZE
          last edited by

          @MMRIZE nice, I like that; thank you

          1 Reply Last reply Reply Quote 0
          • G Offline
            greedyvegan @BerkSmash1984
            last edited by

            @BerkSmash1984 https://github.com/ngnijland/MMM-text-clock

            BerkSmash1984B 1 Reply Last reply Reply Quote 0
            • G Offline
              greedyvegan @MMRIZE
              last edited by

              @MMRIZE
              how do I get the news article image to have a permanent position, whether it appears/loads or not?? just like in your image.

              is that float or margin?

              |(image) (text text text text) |

              M 1 Reply Last reply Reply Quote 0
              • M Offline
                MMRIZE @greedyvegan
                last edited by MMRIZE

                @greedyvegan
                newsfeed item could have a container with selector withImage or not.

                        <div class="container {% if config.showImage and image %} withImage {% endif %}">
                            {% if config.showImage and image %}
                                <div class="newsfeed-image" style="background-image: url({{image}})"></div>
                            {% endif %}
                

                So you can specify your style for each case, withImage or not.

                .MMM-anotherNewsFeed .module-content .container {
                  text-align: right;
                  ...
                }
                

                fc0671ae-8451-47b4-b647-4c515179fdb6-image.png

                .MMM-anotherNewsFeed .module-content .container.withImage {
                  text-align: left;
                  ...
                }
                

                7a295813-9cae-4c78-b023-736ab62634df-image.png

                Image and contents are arranged by container’s display:flex so you can reorder or justify with flex-related attributes.

                G 1 Reply Last reply Reply Quote 1
                • BerkSmash1984B Offline
                  BerkSmash1984 @greedyvegan
                  last edited by

                  @greedyvegan Thanks!

                  1 Reply Last reply Reply Quote 0
                  • G Offline
                    greedyvegan @MMRIZE
                    last edited by

                    @MMRIZE
                    thank you very much, what’s the hierarchy levels as far as region, container, module in css?

                    S 1 Reply Last reply Reply Quote 0
                    • S Offline
                      sdetweil @greedyvegan
                      last edited by

                      @greedyvegan use the developers window elements view to see it

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      G 1 Reply Last reply Reply Quote 0
                      • G Offline
                        greedyvegan @sdetweil
                        last edited by

                        @sdetweil I understood you here but I’m asking about priority overall, the developer window doesn’t display that.

                        S 1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 1 / 2
                        • 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