If you are okay with the “same” output on both mirrors you can just start a webbrowser in fullscren on the other mirror and open the page from the itx one.

Since the magicmirror is basically a webserver hosting one webpage it can be open on an infinit amount of computers at the same time.

try this in your custom.css

.helloworld {
  height: 125px;
  width: 600px;
  overflow: hidden;
  position: relative;
}

.helloworld div {
  display: block;
  width: 100%;
  height: 130px;

  position: absolute;
  overflow: hidden;

  animation: marquee 10s linear infinite;
}


@keyframes marquee {
  0% { left: 50%; }
  100% { left: -100%; }
}

Do note, the Pi doesn’t handle css animations that good, it lacks hardware acceleration.

The css is mostly taken from : https://codepen.io/jamesbarnett/pen/kfmKa

@valid8r they expand, adapting to the content of the

@anhanyoung

basically it’s registers the location of an object (i.e your finger) when an infrared light beam is disrupted.
So the ir frame goes on the outside of the mirror.

@johnnyboy I just wanted to state the source, since I basically just copied the css code, (credit where credit is due :D )

The css I posted above will scroll any text you enter in the config for the helloworld module, no need to alter any code.

@l8kerjuan It’s up to the the person who made the module, the xsmall, small etc are all classes that can be assigned to different divs in the module,

checking the .js file for each module you can see what part of the module the classes are used on.
As for the calendar, the normal class is used on the events.

@ProtoBn Regarding what Pi you want is pretty much depending on what you intend to run on it.

If you intend to primarily run text based information then any of the newish pi will do (2-4), but if you want to run animations, video etc etc the faster the better.

And you don’t really need a pi either, any type of computer that can run Linux will do the trick. (I think Windows is also an option).

@zkab

 @font-face {
  font-family: shotgunk;
  font-style: normal;
  font-weight: 400;

  src:
    local("shotgunk"),
    url("../fonts/shotgunk/SHOTGUNK.TTF") format("truetype");

}

@Anthony_Haddad my first thought was if background-image could handle this, but no go. Unless you convert it to a humongous GIF.

But MM2 can handle the HTML video tag, and supports some videoformats, so here is the freshly baked basic htmlvideo player module!

[card:brobergp/MMM-htmlvideo]

@Chynovsky you are missing commas after

module: 'MMM-Remote-Control'
And
position: 'bottom_left'

It should be

module: 'MMM-Remote-Control',
And
position: 'bottom_left',

@mar4pack Do note, that the API used for the default weather modules are not foolproof, It usually takes time for the API-key to get valid and sometimes it will just stop sending data for your location. This will happen from time to time (as I have noticed) and this has nothing to do with the MagicMirror, the config or the modules, it’s just a lack of data from the service provider.

In my cases it usually works again in a 24H time period. (it has happen twice in 7 weeks)

@fox try

.MMM-SystemStats {
Font-size: 70%;
}

In your custom.css file

@istepgueu Ahh, almost the same but with less reflection, according to specs it is

6mm Single glazed Bronze
Light Transmission is 44%
Light Reflection is 33/28%

I’m impressed that you don’t really see any backlighting from the screen!

I don’t think you are supposed to be using sudo when doing npm install just the other parts,
Using sudo will probably give access issues for the module.

@zdenek I would start by searching for class or className in the module .js file
Trying to isolate what object is being rendered and see if it has a individual class name or general one (the latter being font sizes like small or large, or font color and weight, light and dimmed).

if you find a individual class name (like date for the default clock’s date) you can easily just change the css for that particular element like this

.clock .date {
--csscode--
}

There is also the general ones used for headers and text etc. for an example small which is used to set the font size in the calendar module (amongst many other).

If you want to change the font size of elements with the class name small in the calendar you do this like so

.calendar .small {
font-size: 10px;
}

If you want to change the font size of ALL elements that uses the class name small you do so by removing the module classname like this

.small {
font-size 10px
}

Good practice is to always add the module class name before the class you are changing (to avoid you messing up other/future modules that maybe uses the same class name).

The module class name is the exact name of the module in the config file and/or the name of the modules folder.

If the text/image or anything lacks a class name you can apply css to elements as well.
so for an example, if you have a module with only one image in it, and you want to change the size of that image . you could do that like this :

.modulename img {
width: 500px;
height: 500px;
}

Do note however, this code will change all < img >-elements, ie all images will get the same size.

But the same can be applied to td tr table p span etc etc.

and if you want to apply css to the entire module (for an example if you want to limit the width of the module) you can do so by

.modulename {
Width: 300px;
}

There are more tricks to make your custom layout, but these are the basics as I see them.
So I hope this helps!

If you are placing 2way mirrors on all 3 sections (I would suggest this since normal mirrors and most 2way mirrors have a different amount of reflection and different colors, it will cost more but look better)

Blacking out the back of the 2way mirrors on the side is easily done with vinyl (the kind used to make vehicle decals and wrapping cars with).

And I do believe @Goldjunge_Chriz had some good “tape” to make the mirror stay in place. Something similar to the sticky stuff they apply car windshields with I suppose?

@reddevel75 did you do the npm install in the magicmirror folder after you cloned the magicmirror?

It’s been covered many times on this forum, Here is one thread for an example :
https://forum.magicmirror.builders/topic/2447/css-basics/2

But here is the solution for the time and date :

blue time :

.clock .time {
color: blue;
}

red date:

.clock .date {
color: red;
}

@maxbachmann

Touchfoil doesn’t work beneath the mirrorglass due to the metallic coating.

Even the mirror supplier that was linked earlier says it has to be an overlay (i.e if you use a foil it should be on another layered glass over the mirror itself)

Touchfoils are basically a sheet of transparent plastic with many really really thin wires running across the surface. Gives you around 98-99% transparency.

You are using the wrong quotations,

you are using ’ when you should use '
and “ when you should use "

so first of change

ipWhitelist: [“127.0.0.1”, “::ffff:127.0.0.1”, “::1”], // Set [] to allow all IP addresses.

to

ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"], // Set [] to allow all IP addresses.

and

{
module: ‘twitControl’,
position: ‘top_left’,
config: {
maxNumTweets: 5,
streamType: ‘followings’,
api_keys: {
consumer_key: ‘ ’,
consumer_secret: ‘ ’,
access_token_key: ‘ ’,
access_token_secret: ‘ ’
}
}
},

to

{
module: "twitControl",
position: "top_left",
config: {
maxNumTweets: 5,
streamType: 'followings',
api_keys: {
consumer_key: ' ' ,
consumer_secret: ' ',
access_token_key: ' ' ,
access_token_secret: ' '
}
}
},

And do edit your post above to remove your personal keys!