plug.css

/*
* Copyright 2018-2022 elementary, Inc. (https://elementary.io)
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public
* License as published by the Free Software Foundation; either
* version 2 of the License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
* General Public License for more details.
*
* You should have received a copy of the GNU General Public
* License along with this program; if not, write to the
* Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor,
* Boston, MA 02110-1301 USA.
*/

.hotcorner {
    background-image:
        radial-gradient(
            circle,
            alpha(@accent_color, 0.4) 70%,
            alpha(@accent_color, 0) 1px
        ),
        linear-gradient(
            to bottom,
            alpha(@accent_color_500, 0.1),
            alpha(@accent_color_500, 0.1)
        );
    background-repeat: no-repeat;
    background-size: 48px 48px, cover;
    color: @selected_fg_color;
    font-weight: 600;
    min-height: 3.5em;
    padding: 12px;
}

.hotcorner.topleft {
    background-position: -24px -24px, 0;
}

.hotcorner.topright {
    background-position: calc(100% + 24px) -24px, 0;
}

.hotcorner.bottomleft {
    background-position: -24px calc(100% + 24px), 0;
}

.hotcorner.bottomright {
    background-position: calc(100% + 24px) calc(100% + 24px), 0;
}

.wallpaper-container {
    background-color: transparent;
    margin: 1em;
}

.wallpaper-container .card {
    border-radius: 1px;
    border: none;
    margin: 0.666em; /* Needs to be separate to position checkbutton */
}

.wallpaper-container .card:checked {
    box-shadow:
        0 0 0 4px alpha(@text_color, 0.2),
        0 0 0 1px alpha(#000, 0.05),
        0 3px 3px alpha(#000, 0.22);
}

.wallpaper-container:focus .card {
    box-shadow:
        0 0 0 4px @accent_color,
        0 0 0 1px alpha(#000, 0.05),
        0 3px 3px alpha(#000, 0.22);
}

.wallpaper-container check {
    border-radius: 50%;
    min-height: 20px;
    min-width: 20px;
    -gtk-icon-transform: scale(0.6);
}

.wallpaper-container picture {
    min-width: 162px;
    min-height: 100px;
}

appearance-view checkbutton .card {
    background-position: center;
    background-repeat: no-repeat;
    background-size: 86px 64px, cover;
    min-width: 92px;
    min-height: 64px;
    margin: 6px 6px 12px 12px;
}

appearance-view checkbutton .card.prefer-default {
    background-color: white;
    background-image:
        url("resource:///io/elementary/settings/desktop/appearance-default.svg"),
        linear-gradient(
            to bottom,
            alpha(@accent_color_300, 0.1),
            alpha(@accent_color_500, 0.1)
        );
}

appearance-view checkbutton .card.prefer-dark {
    background-color: mix(@BLACK_300, @BLACK_500, 0.25);
    background-image:
        url("resource:///io/elementary/settings/desktop/appearance-dark.svg"),
        linear-gradient(
            to bottom,
            alpha(@accent_color_300, 0.1),
            alpha(@accent_color_500, 0.1)
        );
}