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.

    Newsfeed size

    Scheduled Pinned Locked Moved Custom CSS
    29 Posts 4 Posters 9.8k Views 4 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.
    • K Offline
      Kenta @Kenta
      last edited by

      This post is deleted!
      1 Reply Last reply Reply Quote 0
      • K Offline
        Kenta
        last edited by

        this

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

          @Kenta posting pictures does not work… u have to link to them uploaded somewhere else

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          K 1 Reply Last reply Reply Quote 0
          • K Offline
            Kenta @sdetweil
            last edited by

            @sdetweil
            As previously stated, I’m a complete n00b. It’s sad because I want to be a nerd 😂
            Yeah I’ve tried unsuccessfully to post images, but this last one was a link to a Dropbox image. Did it not work.?

            S 3 Replies Last reply Reply Quote 0
            • S Offline
              sdetweil @Kenta
              last edited by

              @Kenta ok, didn’t see the last as a link.

              For Dropbox, if u change the url, dl=0, to dl=1, then it will show here…

              Sam

              How to add modules

              learning how to use browser developers window for css changes

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

                @Kenta said in Newsfeed size:

                As previously stated, I’m a complete n00b

                no problems, we all were…

                Sam

                How to add modules

                learning how to use browser developers window for css changes

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

                  @Kenta the code for the source title and date/time is

                  sourceAndTimestamp.className = “newsfeed-source light small dimmed”;

                  newsfeed-source doesn’t exist in main.css

                  light is

                  .light {
                    font-family: "Roboto Condensed", sans-serif;
                    font-weight: 300;
                  }
                  

                  small is

                  .small {
                    font-size: 20px;
                    line-height: 25px;
                  }
                  

                  and dimmed is

                  .dimmed { 
                    color: #666;
                  }
                  

                  so, to change the SIZE you need to change the value for class ‘small’

                  so, for example
                  in ~/MagicMirror/css/custom.css put

                  .newsfeed .small {
                    font-size: 40px;
                    line-height: 45px;
                  }
                  

                  for the title text the code is

                  title.className = “newsfeed-title bright medium light” +

                  newsfeed-title doesn't exist 
                  so 'medium' is the size 
                  

                  .medium {
                  font-size: 30px;
                  line-height: 35px;
                  }

                  so change that to, in custom.css
                  

                  .medium {
                  font-size: 50px;
                  line-height: 55px;
                  }

                  
                  so now, custom.css looks like this (sizes just for example)
                  

                  .newsfeed .small {
                  font-size: 40px;
                  line-height: 45px;
                  }
                  .newsfeed .medium {
                  font-size: 50px;
                  line-height: 55px;
                  }

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  K C 2 Replies Last reply Reply Quote 0
                  • K Offline
                    Kenta @sdetweil
                    last edited by

                    @sdetweil
                    Thank you! That worked perfectly!

                    1 Reply Last reply Reply Quote 0
                    • C Offline
                      cyberphox @sdetweil
                      last edited by

                      @sdetweil said in Newsfeed size:

                      .newsfeed .small {
                      font-size: 40px;
                      line-height: 45px;
                      }

                      Why the heck isn’t this working for me!
                      I’ve moved compliments module to lower_third region but i can’t seem to change the size of it

                      Full time Dad, DJ and entertainer and lover of technology.

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

                        @cyberphox show me the css class setup you did… note that each module gets to choose there own class usage… so ‘small’ might not work for compliments… read the readme,

                        or look at the
                        main.css or
                        compliments.css or
                        last resort the compliments.js. file for class usage (search for className in the js file)

                        sometimes the class usages is documented, and sometimes(most times) not

                        Sam

                        How to add modules

                        learning how to use browser developers window for css changes

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