/*
 * udt powermenu layout: a fullscreen overlay with a single row of big icons.
 * Copyright (C) 2026 Danilo M. <danix@danix.xyz>
 * Licensed under the GNU General Public License v2 only.
 *
 * The power menu is not a small menu. It is a deliberate, hard-to-mistake
 * fullscreen prompt, and the script feeds it a greeting, a uptime message and
 * a user avatar. All three are rendered here.
 */

@import "common.rasi"

window {
    fullscreen:       true;
    background-color: @base;
    border:           0;
    border-radius:    0;
    padding:          0;
}

/* The content column is held to a fixed width and centred, rather than letting
 * it span the whole screen. On a 2560px monitor a full-width mainbox spreads
 * four options across ~640px cells, so the row reads as four scattered glyphs
 * and the selection highlight becomes a huge slab. */
mainbox {
    children: [ dummy, userimage, inputbar, listview, message, dummy ];
    spacing:  24px;
    padding:  60px calc(50% - 340px);
}

/* Flexible spacers above and below push the content block to the middle. */
dummy {
    expand: true;
}

/* The avatar, sized by margin rather than by width.
 *
 * This widget only honours the margin. `width` with `expand: false` collapses
 * it to a line, and a percentage margin resolves against the whole window
 * rather than the padded column, which tiled the image across the screen. So
 * the margin is plain pixels, derived from the content column set by mainbox:
 * (680 - 220) / 2 = 230.
 *
 * The height is what the row gives it, 220px, not what is asked for here; the
 * declaration is kept so the intent is on the record. Width is what actually
 * has to match it for the 100% radius to draw a circle rather than an ellipse.
 * Measured from a screenshot, not guessed. Both numbers move together if the
 * mainbox column width changes. */
userimage {
    height:           220px;
    margin:           0px 230px;
    background-image: url("~/.user-icon.jpg", both);
    background-color: transparent;
    border:           2px;
    border-color:     @accent;
    border-radius:    100%;
}

/* This layout is the one place a prompt earns its keep: it carries the
 * script's greeting, which is the human cue for a destructive menu. */
inputbar {
    expand:           false;
    background-color: transparent;
    padding:          0;
    children:         [ prompt ];
}

prompt {
    expand:           true;
    font:             "Noto Sans Bold 28";
    text-color:       @text;
    horizontal-align: 0.5;
}

/* Four options in one row: shutdown, reboot, sleep, logout. */
listview {
    expand:        false;
    columns:       4;
    lines:         1;
    fixed-height:  true;
    fixed-columns: true;
    spacing:       24px;
}

element {
    padding:       24px 0px;
    border-radius: 12px;
    horizontal-align: 0.5;
}

/* The entries are single glyphs from a Nerd Font, so they are sized large and
 * centered rather than laid out as text. */
element-text {
    font:             "Inconsolata Nerd Font Mono 42";
    horizontal-align: 0.5;
    vertical-align:   0.5;
    text-color:       inherit;
}

/* The uptime line the script passes with -mesg. */
message {
    expand:           false;
    background-color: transparent;
    padding:          0;
}

textbox {
    font:             "Noto Sans 12";
    text-color:       @subtext0;
    horizontal-align: 0.5;
}