.clock .time {
font-size: 18rem; /* try 12rem, you can adjust up/down */
}
.clock .date {
font-size: 4rem; /* optionally adjust the date size */
}
.region.bottom.right .container {
flex-direction:row;
}
.currentWeatherModule {
margin-right: 50px;
font-size: 5rem;
}
The padding works but the font-size has no impact.
i tried going straight for
.weather
but that did not help.
.region.bottom.right .container {
flex-direction:row;
}
works but it crams it right. Making no space between current and forecast.
they are not on top of each other rather its run on sentance.
do i need to add more css to try and add some pad to the right of current weather ?
How do i use more of the bottom bar ?
Currently i have
moon LARGE SPACE calendar LARGE SPACE current weather (Stacked on) weather forecast
I want to use that space to the right of calendar so i can arrange the screen better. I do not want to stack.
let config = {
address: "0.0.0.0",
port: 8080,
basePath: "/",
ipWhitelist: [],
useHttps: false,
httpsPrivateKey: "",
httpsCertificate: "",
language: "en",
locale: "en-US",
timeFormat: 12,
units: "imperial",
modules: [
// Clock
{
module: "clock",
position: "top_right",
config: {
timeFormat: 12,
timezone: "America/New_York",
displayType: "digital",
displaySeconds: false,
showWeek: false,
showSunTimes: true,
showMoonTimes: true,
lat: ,
lon:
}
},
// Ecobee indoor conditions
{
module: "MMM-Ecobee",
position: "top_left",
header: "Indoor Conditions",
config: {
updateInterval: 300000,
showIndoorHumidity: true,
showOutdoorWeather: false
}
},
// Dynamic Weather (OpenWeather visual background)
{
module: "MMM-DynamicWeather",
position: "fullscreen_above",
config: {
api_key: "", // required
lat: ,
lon: ,
units: "imperial",
weatherInterval: 600000,
updateInterval: 600000,
animationSpeed: 2000,
effectDuration: 60000,
effectDelay: 30000,
fadeDuration: 3000,
realisticClouds: true,
sequential: "weather"
// sunImage: "sun_center"
}
},
// Calendar
{
module: "calendar",
position: "bottom_center",
header: "Holidays",
config: {
maximumNumberOfDays: 90,
wrapEvents: false,
fade: false,
maximumEntries: 5,
calendars: [
{
symbol: "calendar",
url: "https://calendar.google.com/calendar/ical/en.usa%23holiday%40group.v.calendar.google.com/public/basic.ics"
}
]
}
},
// Moon Phase
{
module: "MMM-MoonPhase",
position: "bottom_left",
config: {
hemisphere: "N",
resolution: "detailed",
updateInterval: 12 * 60 * 60 * 1000
}
},
// Current outdoor conditions (WeatherFlow)
{
module: "weather",
position: "bottom_right",
header: "Outdoor Conditions -",
config: {
weatherProvider: "weatherflow",
apiBase: "",
token: "",
stationid: "",
type: "current",
units: "imperial",
tempUnits: "imperial",
windUnits: "mph",
degreeLabel: true,
showPrecipitationProbability: true,
showUVIndex: true,
showWindDirection: true,
showWindDirectionAsArrow: true,
showHumidity: true,
showSun: false,
showLightning: true,
showFeelsLike: true,
showCloudCover: true,
showPrecipitationAmount: true,
updateInterval: 10 * 60 * 1000
}
},
// Forecast (WeatherFlow)
{
module: "weather",
position: "bottom_right",
config: {
weatherProvider: "weatherflow",
apiBase: "",
token: "",
stationid: "",
type: "forecast",
units: "imperial",
tableClass: "medium",
colored: true,
fade: false
}
}
]
};
if (typeof module !== "undefined") {
module.exports = config;
}
@sdetweil
then why is height doing nothing ?
.MMM-OpenWeatherForecast .module-content {
width: 400px;
height: 400px;
}
@sdetweil To take the entire right side then do it with css?
position right or left do make the entire MMM-OpenWeatherForecast module disappear.
How do i make it fill the entire right side ?
I tried to use custom css and added height but no change.
what Wireless sensor do you folks use for outdoor weather to the mirror ?
@sdetweil the main weather module, default out of the box does not have precipitation % on today either!
I bet that is the issue.
@raspberrypi9 I consider myself new and have designed on a pi. I am using a standard small monitor but I have seen others with photos as you describe.
@sdetweil I tired on and off as well as table and titled. Participation % doesn’t appear in today.
Disregard the tightness and moon hitting weather. This is my remote view.
i installed MMM-OpenWeatherMapForecast. The today precipitation % is not available. It is in the other dates and in the hourly.
{
module: "MMM-OpenWeatherMapForecast",
position: "bottom_right",
header: "weather",
classes: "default everyone",
disabled: false,
config: {
apikey: "Key",
latitude: 40.***,
longitude: -74.***,
units: "imperial",
concise: true,
iconset: "4c",
colored: true,
showHourlyForecast: false }
},@KristjanESPERANTO said in MMM-OpenWeatherForecast Error 401:
@dcazman There is a working fork: https://github.com/Tom-Hirschberger/MMM-OpenWeatherForecast
I think this is the fork I used.
Re: MMM-OpenWeatherForecast Error 401
I get this problem.
git remote -v
origin https://github.com/jclarke0000/MMM-OpenWeatherForecast.git (fetch)
origin https://github.com/jclarke0000/MMM-OpenWeatherForecast.git (push)
{
module: "MMM-OpenWeatherForecast",
position: "bottom_right",
header: "Forecast",
config: {
api_key: "KEY",
lat: 40.***,
lon: -74.***,
units: "imperial",
concise: true,
showFeelsLikeTemp: true,
iconset: "5c",
colored: true,
extraCurrentConditions: {
highLowTemp: true,
precipitation: true,
wind: true,
barometricPressure: false,
humidity: true,
dewPoint: false,
uvIndex: false,
visibility: false
},
}
},
I have been looking at updating the icons and I think it will go like below.
Is there a way to add words for example next to the icon the word Sunny is displayed ?
.wi-day-sunny {
background-image: url("path/icons/sunny.svg");
background-size: contain;
width: 10px;
height: 10px;
display: inline-block;
vertical-align: middle;
}
bought
Portable Monitor - Ultra-Slim 15.6 Inch Full HD IPS Laptop Screen
by Ingnok Store for $60
@BKeyport I feel like I read here a lot. Lots of questions and old conversations but I haven’t really seen monitor topics.
I am starting to get into the hundreds with my build and all I was trying to do was build a better wall clock for my house :)
I am looking at
Portable Monitor 15.6'' 1080P FHD IPS Display Screen w/Tempered Glass and Metal Frame, Travel Monitor with Kickstand, Speaker, USB C, HDMI Plug
by Topmonitor but its 159 new
I am looking for something 14 inches to replace my wall clock.
What display do you folks use?
@sdetweil That hid the moon.
Any tips on color and animation of weather icons ?
do i have to do a lot of
.wi-day-sunny {
color: #ffff00;
}
and then look at the animation doc ?
There isn’t one done here that I can grab already ?