MagicMirror² v2.14.0 is available! For more information about this release, check out this topic.

compliments reduce font size and move down a little bit



  • Hello everyone and have a nice Christmas,
    where in which css file can I reduce the font of “compliments”? and how with which variables ?? and move a little bit down in the mirror?
    Thank you very much for a short feedback.



  • @kusselin u always put css changes in custom.css

    once u know the class to change

    according to the doc, compliments uses

    classes	Override the CSS classes of the div showing the compliments
    
    Default value: thin xlarge bright
    

    which u can change in config, or you can override in custom.css

    .modulename .class { … }

    u might be able to use large instead of xlarge (for the size part)



  • hello sam…, but where can i find the css class…in custom.css i don´t find anythin also in main.css… 😞

    EDIT:

    O.K. i found this in main.css and put this with smaller numbers…then it´s ok.

    Thank you sam



  • Hello @sdetweil
    I have a similar question: I want the compliments module to have the same appearance as the title of the newsfeed module.

    found in newsfeed-code:

    			if (!this.config.showFullArticle) {
    				const title = document.createElement("div");
    				title.className = "newsfeed-title bright medium light" + (!this.config.wrapTitle ? " no-wrap" : "");
    				title.innerHTML = this.newsItems[this.activeItem].title;
    				wrapper.appendChild(title);
    			}
    

    so i want the compliments style to be “bright medium light”

    the compliments code shows

    	getDom: function () {
    		var wrapper = document.createElement("div");
    		wrapper.className = this.config.classes ? this.config.classes : "thin xlarge bright pre-line";
    

    Im not sure how to modify the custom.css.
    Something like:

    .compliments .class {
    bright medium light;
    }
    

    Can you help me? 🙂


Log in to reply