adi1090x / rofi

A huge collection of Rofi based custom Applets, Launchers & Powermenus.
GNU General Public License v3.0
6.51k stars 303 forks source link

Cannot change icon background and textbox color #60

Closed muhammad-arif closed 2 years ago

muhammad-arif commented 3 years ago

Hi, Thanks for creating these amazing configs. I am currently trying to use the launcher (row_center). Whatever I do, I cannot change the background colour of the icon and it's text box. This issue persists in other configs too. Screenshots: https://imgur.com/a/KKAeWdI

Background: OS: Ubuntu Rofi: Version: 1.6.1-139-g87c60e75-dirty (build from source)

Config:

/*
 *
 * Author  : Aditya Shakya
 * Mail    : adi1090x@gmail.com
 * Github  : @adi1090x
 * Twitter : @adi1090x
 * 
 */

configuration {
    font:                           "Noto Sans 10";
    show-icons:                     true;
    icon-theme:                     "Papirus";
    display-drun:                   "";
    drun-display-format:            "{name}";
    disable-history:                false;
    fullscreen:                     false;
    hide-scrollbar:                 true;
    sidebar-mode:                   true;
}

/* -- My Config --  0a0a0aff = Black, EDEDEDFF = white, ff562bFF = orange */

* {
    background:                     #0a0a0aff;
    background-alt:                 #00000000;
    background-bar:                 #0a0a0aFF;
    foreground:                     #EDEDEDFF;
    accent:                         #0a0a0a4d;
    border:                         #ff562bFF;
    selected:                       #151515ff;
}
window {
    transparency:                   "real";
    background-color:               @background;
    text-color:                     @foreground;
    border:                         0px;
    border-color:                   @border;
    border-radius:                  0px;
    width:                          100%;
    location:                       center;
    x-offset:                       0;
    y-offset:                       0;
}

prompt {
    enabled:                        true;
    padding:                        0.25% 0.75% 0% -0.25%;
    background-color:               @background-alt;
    text-color:                     @foreground;
    font:                           "FantasqueSansMono Nerd Font 12";
}

entry {
    background-color:               @background-alt;
    text-color:                     @foreground;
    placeholder-color:              @background;
    expand:                         true;
    horizontal-align:               0;
    placeholder:                    "Search Applications";
    padding:                        -0.10% 0% 0% 0%;
    blink:                          true;
}

inputbar {
    children:                       [ prompt, entry ];
    background-color:               @background-bar;
    text-color:                     @foreground;
    expand:                         false;
    border:                         0% 0% 0% 0.3%;
    border-radius:                  0% 100% 100% 0%;
    border-color:                   @border;
    margin:                         0% 73.75% 0% 0%;
    padding:                        1.25%;
}

listview {
    background-color:               @background;
    columns:                        12;
    lines:                          2;
    spacing:                        0%;
    cycle:                          false;
    dynamic:                        true;
    layout:                         vertical;
}

mainbox {
    background-color:               @background-alt;
    border:                         0% 0% 0% 0%;
    border-radius:                  0% 0% 0% 0%;
    border-color:                   @accent;
    children:                       [ inputbar, listview ];
    spacing:                        1.5%;
    padding:                        2% 1% 2% 1%;
}

element {
    background-color:               @background-alt;
    text-color:                     @foreground;
    orientation:                    horizontal;
    border-radius:                  0%;
    padding:                        2.5% 0% 2.5% 0%;
}

element-icon {
    size:                           80px;
    border:                         0px;
}

element-text {
    expand:                         true;
    horizontal-align:               0.5;
    vertical-align:                 0.5;
    margin:                         0.5% 0.5% -0.5% 0.5%;
}

element selected {
    background-color:               @selected;
    text-color:                     @foreground;
    border:                         0% 0% 0% 0.3%;
    border-radius:                  0px;
    border-color:                   @border;
}

If you(or anyone) find some time to have a look at this issue, I would be grateful. Regards, Arif

Veirt commented 3 years ago

I believe this issue is caused by conflicted theme. Go to $HOME/.config/rofi/config.rasi. Comment or simply delete the line that import theme like this. image

AquaBindi commented 3 years ago

Add transparent (or @background-alt) to background-color in element-icon and element-text

element-icon {
    background-color: transparent;
    ...
}
element-text {
    background-color: transparent;
   ...
}

or

element-icon {
    background-color: @background-alt;
    ...
}
element-text {
    background-color: @background-alt;
   ...
}
plus9a commented 2 years ago

I also faced another probelm icon and text is not centered (bug) https://github.com/davatorium/rofi/issues/1419 Hope it will help

DaveDavenport commented 2 years ago

(I missed it was 1.6.1, but the below thing could cause similar artifacts)

Older version had some hackish work-around to load theme over the default theme. It had some hack that if it detected more then X elements it would not load the default theme even when only doing imports.

This has been corrected and made more deterministic. If you want to load a theme 'clean' do:

configuration {
}
@theme "mytheme"

If you want to extend the default theme:

configuration {
}
@import  "mytheme"

I never had report on this, so I thought this was clear in the documentation.