Default calender change Header position

[Scool]

Hey guys,

i’m completly new in this world, but the possibilities are great.
The modul default calendar is set with “top-right”, now the header is also at the right side of the modul.

I search the .css and the calendar.js, but i couldn’t find the possibility to set header “margin:left” oder “float:left” wthatever.

is would be very nice, if somebody could help me ;-)

/* Magic Mirror Config Sample
 *
 * By Michael Teeuw http://michaelteeuw.nl
 * MIT Licensed.
 *
 * For more information how you can configurate this file
 * See https://github.com/MichMich/MagicMirror#configuration
 *
 */

var config = {
	address: "localhost", // Address to listen on, can be:
	                      // - "localhost", "127.0.0.1", "::1" to listen on loopback interface
	                      // - another specific IPv4/6 to listen on a specific interface
	                      // - "", "0.0.0.0", "::" to listen on any interface
	                      // Default, when address config is left out, is "localhost"
	port: 8080,
	ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"], // Set [] to allow all IP addresses
	                                                       // or add a specific IPv4 of 192.168.1.5 :
	                                                       // ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.1.5"],
	                                                       // or IPv4 range of 192.168.3.0 --> 192.168.3.15 use CIDR format :
	                                                       // ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.3.0/28"],

	language: "en",
	timeFormat: 24,
	units: "metric",

	modules: [
		{
			module: "MMM-DigClock",
			position: "top_right",	// This can be any of the regions.
			config: {
				showDate: true,
				showWeek: false,
				showSeconds: false,
				dateFormat: "ddd, ll",
				timezone: "Europe/Berlin"
			}
		},
		{
			module: "weatherforecast",
			position: "top_right",
			header: "WIE WIRD DAS WETTER?",
			config: {
				location: "yyyyyyyyy",
				locationID: "yyyyyyy",  //ID from http://bulk.openweathermap.org/sample/; unzip the gz file and find your city
				appid: "xxxxxxxx"
			}
		},
		{
			module: "calendar",
			header: "Termine xxxxxxxx",
			position: "top_right",
			config: {
				timeFormat: "absolute",
				maximumEntries: "5",
				maximumNumberOfDays: "365",
				getRelative: 48,
				calendars: [
					{
						symbol: "calendar-check",
						url: "webcal://xxxxxxxxxxxxx"
					}
				]
			}
		},
		{
			module: "MMM-EasyPix",
				position: "top_left",
				config: {
					picName: "vp_2.png", // Enter the picture file name.
					maxWidth: "33%",        // Size picture precisely. Retains aspect ratio.
					sounds: ["1.mp3", "me2.mp3"],  // mp3 sound file names in quotes seperated by commas for Hello-Lucy
					updateInterval: 30 * 60 * 1000,     // updates display
					animationSpeed: 3000,
			}	
		},
		{
			module: "MMM-EasyPix",
				position: "top_center",
				config: {
					picName: "vp_2.png", // Enter the picture file name.
					maxWidth: "66%",        // Size picture precisely. Retains aspect ratio.
					sounds: ["1.mp3", "me2.mp3"],  // mp3 sound file names in quotes seperated by commas for Hello-Lucy
					updateInterval: 30 * 60 * 1000,     // updates display
					animationSpeed: 3000,
			}	
		},
		{
			module: "MMM-EARTH",
			position: "bottom_right",
			config: {
				mode: "Natural",
				rotateInterval: 15000,
				MaxWidth: "35%",
				MaxHeight: "35%",
			}
		},
		{
			module: "newsfeed",
			position: "bottom_bar",
			config: {
				feeds: [
					{
						title: "Tagesschau",
						url: "http://www.tagesschau.de/xml/rss2"
					},
					{
						title: "Der Spiegel",
						url: "http://www.spiegel.de/schlagzeilen/tops/index.rss"
					},
				],
				showSourceTitle: true,
				showPublishDate: true
			}
		},
	]

};

/*************** DO NOT EDIT THE LINE BELOW ***************/
if (typeof module !== "undefined") {module.exports = config;}

[dxfan227]

Try

div.module.calendar header {
    
}

if that doesnt work, give me a few hours to get home and actually look at my custom.css file

[Scool]

where should i write this code?
custom.css??

actually she look like this (with your Command):

 body {
 	
}

 div.module.calendar header {
    
}	

[dxfan227]

ill get you the full code in a few hours…yes in custome css but you will also need to alight the text properly too.

[dxfan227]

sorry here was s the css code

.calendar header {
 	text-align: center // Change this to whatever you want....right,center or left
}

[Scool]

Thank you!

i’ll try and give you feedback!