diff options
| -rw-r--r-- | extra/README | 7 | ||||
| -rw-r--r-- | extra/readme-theme_format | 367 |
2 files changed, 374 insertions, 0 deletions
diff --git a/extra/README b/extra/README index 6d065bf..6fe76d8 100644 --- a/extra/README +++ b/extra/README @@ -14,4 +14,11 @@ ugly-theme.tar.gz -- the purpose of this theme is to help you understand the way deKorator paints the decorations. +update_filenames.sh -- updating themes to the new naming scheme. + Also can directly create theme archive if + desired. + +readme-theme_format -- A quick overview over the theme format and + part names. + The contents of this directory are not installed. diff --git a/extra/readme-theme_format b/extra/readme-theme_format new file mode 100644 index 0000000..df80854 --- /dev/null +++ b/extra/readme-theme_format @@ -0,0 +1,367 @@ +deKorator Theming +================= + + ┌─────┬───────────────────────┬─────┐ + │ 1 │ 2 │ 3 │ + ├──┬──┴┬───┬─────────────┬───┬┴──┬──┤ + │ 4│ 5 │ 6 │ 7 │ 8 │ 9 │10│ + ├──┼───┴───┴─────────────┴───┴───┼──┤ + │11│ │14│ + ├──┤ ├──┤ + │ │ │ │ + │12│ Window Content │15│ + │ │ │ │ + ├──┤ ├──┤ + │13│ │16│ + ├──┴──┬───────────────────────┬──┴──┤ + │ 17 │ 18 │ 19 │ + └─────┴───────────────────────┴─────┘ + + +Border Parts +============ + + 1: topLeftFrameBg - Top border, left corner / resize handle + 2: topMidFrameBg - Top border, middle part (tiled to fill) + 3: topRightFrameBg - Top border, right corner / resize handle + + 4: leftUpperCornerFrameBg - Left upper corner / resize handle + 5: buttonsLeftBg - Titlebar part, behind left-side buttons + 6: titleLeftBg - Titlebar part, separating buttons from middle + 7: titleMidBg - Titlebar, middle part (tiled to fill) + 8: titleBarRightBg - Titlebar part, separating buttons from middle + 9: buttonsRightBg - Titlebar part, behind right-side buttons +10: rightUpperCornerFrameBg - Right upper corner / resize handle + +11: leftUpperFrameBg - Left border, upper part +12: leftMidFrameBg - Left border, middle part (tiled to fill) +13: leftLowerCornerFrameBg - Left border, lower corner / resize handle + +14: rightUpperFrameBg - Right border, upper part +15: rightMidFrameBg - Right border, middle part (tiled to fill) +16: rightLowerCornerFrameBg - Right border, lower corner / resize handle + +17: bottomLeftFrameBg - Bottom border, left corner / resize handle +18: bottomMidFrameBg - Bottom border, middle part (tiled to fill) +19: bottomRightFrameBg - Bottom border, right corner / resize handle + +Optional (shaded windows): +17: bottomShadedLeftFrameBg - Bottom border, left corner / resize handle +18: bottomShadedMidFrameBg - Bottom border, middle part (tiled to fill) +19: bottomShadedRightFrameBg - Bottom border, right corner / resize handle + + +Element Names +------------- + +- All border parts are expected in the `/deco` subfolder. +- Image names can be found in the list above, or the listing below. + + +Inactive Window Frames +---------------------- + +- Filenames of all border images end with `Bg`. +- If additional files ending in `InactiveBg` are found: + - They are used for inactive windows. + - Fully optional and looked up in a granular fashion + - Only providing inactive images for selective parts of the frame, or none at all is valid. + + +Window Frame Structure +---------------------- + +deKorator frames are composed of: + +- Frame parts of top, left, right and bottom borders +- Titlebar parts + + +Border Parts Details +-------------------- + +Horizontal +~~~~~~~~~~ + + ┌──────────────────┬───────────────────────────────┬───────────────────┐ + │ topLeft │ topMid │ topRight │ + └──────────────────┴───────────────────────────────┴───────────────────┘ + ┌──────────────────┬───────────────────────────────┬───────────────────┐ + │ bottomLeft │ bottomMid │ bottomRight │ + └──────────────────┴───────────────────────────────┴───────────────────┘ + ┌──────────────────┬───────────────────────────────┬───────────────────┐ + │ bottomShadedLeft │ bottomShadedMid │ bottomShadedRight │ + └──────────────────┴───────────────────────────────┴───────────────────┘ + +Notes: +- Top/bottom borders are at the respective window edges. +- *Left and *Right parts form corners, allow diagonal resizing. +- *Mid parts are tiled to fill the remaining width, for vertical resizing. +- Optional: Top border can be omitted. + - In this case, the theme uses: + - Top 5 pixels of titlebar for resizing. + - Bottom border width for diagonal resizing. +- Optional: BottomShaded border (for shaded windows). + - Is only shown when drawing borders on shaded windows is enabled in settings. + - If not found, normal bottom border is used. + + +Vertical +~~~~~~~~ + + ┌──────┐ ┌──────┐ + │ left-│ │right-│ + │Upper-│ │Upper-│ + │Corner│ │Corner│ + ├──────┤ ├──────┤ + │ left-│ │right-│ + │ Upper│ │ Upper│ + ├──────┤ ├──────┤ + │ │ │ │ + │ left-│ │right-│ + │ Mid │ │ Mid │ + │ │ │ │ + ├──────┤ ├──────┤ + │left- │ │right-│ + │Lower-│ │Lower-│ + │Corner│ │Corner│ + └──────┘ └──────┘ + +Notes: +- Side borders are stacked vertically between titlebar and bottom border. +- [left|light]Upper parts are just below the titlebar. +- [left|light]Mid parts are tiled to fill remaining space. +- [left|light]LowerCorner parts form bottom corners. + + +Titlebar +~~~~~~~~ + + ┌───────────────┬───────────┬────────────┬─────────────┬─────────────┬────────────┬────────────────┐ + │leftUpperCorner│buttonsLeft│titleBarLeft│ titleBarMid │titleBarRight│buttonsRight│rightUpperCorner│ + └───────────────┴───────────┴────────────┴─────────────┴─────────────┴────────────┴────────────────┘ + +Notes: +- Titlebar is a strip of seven elements. +- [left|light]UpperCorner parts: + - Form sides of the titlebar. + - Side parts top corners, allow diagonal resizing. +- buttons[left|light] parts: + - Tile behind titlebar buttons (if present). +- titleBarMid: + - Tiled to fill the titlebar center. + - titleBar[left|light] at the left and right. + + +Masks +~~~~~ + + ┌──────────────────────────────┬─────────────────────────┬───────────────────────────────┐ + │ topLeftCornerBitmap │ topMidBitMap │ topRightCornerBitmap │ + └──────────────────────────────┴─────────────────────────┴───────────────────────────────┘ + ┌──────────────────────────────┬─────────────────────────┬───────────────────────────────┐ + │ buttomLeftCornerBitmap │ buttomMidBitmap │ buttomRightCornerBitmap │ + └──────────────────────────────┴─────────────────────────┴───────────────────────────────┘ + ┌──────────────────────────────┬─────────────────────────┬───────────────────────────────┐ + │ buttomLeftShadedCornerBitmap │ buttomShadedMidBitmap │ buttomShadedRightCornerBitmap │ + └──────────────────────────────┴─────────────────────────┴───────────────────────────────┘ + +Notes: +- Masks are optional images in black and white, used to determine transparent parts of the frame, if enabled in settings. + - Black pixels are transparent parts of the frame. + + + +Buttons +======= + +Functions: +---------- + +- buttonAbove: Enable "Keep on top" +- buttonAboveDown: Disable "Keep on top" +- buttonBelow: Enable "Keep below" +- buttonBelowDown: Disable "Keep below" +- buttonClose: Close window +- buttonHelp: Open help (if available) +- buttonMax: Maximize window +- buttonMenu: Show window menu (or icon if menu disabled) +- buttonMin: Iconify window +- buttonRestore: Unmaximize window +- buttonShade: Shade (roll into titlebar) +- buttonShadeDown: Unshade (roll out of titlebar) +- buttonSticky: Show on all virtual desktops +- buttonStickyDown: Disable "Show on all desktops" + + +Image files: +------------ + +Normal buttons: + /buttons/normal/[buttonName].png + +Hover (mouse over): + /buttons/hover/[buttonName]Hover.png + +Pressed: + /buttons/press/[buttonName]Press.png + +Please note the addition of 'Hover' and 'Press' on the respective buttons, as well as the different paths. + +Optional Inactive Images: +- If additional files ending in "Inactive" are found, e.g., `buttonClosePressInactive.png`: + - The inactive images are looked up per button image, allowing fine grained control. + - If no inactive part is found, the same image is used on inactive and acrtive window borders. + + +Theme directory: +---------------- + +The theme needs to be in a directory called "<name>-theme", wheras <name> can not contain whitespaces, i.e. "default-theme", "templaTor-theme". + +Listing of all files, including optional parts: + +<name>-theme +├── buttons +│ ├── hover +│ │ ├── buttonAboveDownHoverInactive.png +│ │ ├── buttonAboveDownHover.png +│ │ ├── buttonAboveHoverInactive.png +│ │ ├── buttonAboveHover.png +│ │ ├── buttonBelowDownHoverInactive.png +│ │ ├── buttonBelowDownHover.png +│ │ ├── buttonBelowHoverInactive.png +│ │ ├── buttonBelowHover.png +│ │ ├── buttonCloseHoverInactive.png +│ │ ├── buttonCloseHover.png +│ │ ├── buttonHelpHoverInactive.png +│ │ ├── buttonHelpHover.png +│ │ ├── buttonMaxHoverInactive.png +│ │ ├── buttonMaxHover.png +│ │ ├── buttonMenuHoverInactive.png +│ │ ├── buttonMenuHover.png +│ │ ├── buttonMinHoverInactive.png +│ │ ├── buttonMinHover.png +│ │ ├── buttonRestoreHoverInactive.png +│ │ ├── buttonRestoreHover.png +│ │ ├── buttonShadeDownHoverInactive.png +│ │ ├── buttonShadeDownHover.png +│ │ ├── buttonShadeHoverInactive.png +│ │ ├── buttonShadeHover.png +│ │ ├── buttonStickyDownHoverInactive.png +│ │ ├── buttonStickyDownHover.png +│ │ ├── buttonStickyHoverInactive.png +│ │ └── buttonStickyHover.png +│ ├── normal +│ │ ├── buttonAboveDownInactive.png +│ │ ├── buttonAboveDown.png +│ │ ├── buttonAboveInactive.png +│ │ ├── buttonAbove.png +│ │ ├── buttonBelowDownInactive.png +│ │ ├── buttonBelowDown.png +│ │ ├── buttonBelowInactive.png +│ │ ├── buttonBelow.png +│ │ ├── buttonCloseInactive.png +│ │ ├── buttonClose.png +│ │ ├── buttonHelpInactive.png +│ │ ├── buttonHelp.png +│ │ ├── buttonMaxInactive.png +│ │ ├── buttonMax.png +│ │ ├── buttonMenuInactive.png +│ │ ├── buttonMenu.png +│ │ ├── buttonMinInactive.png +│ │ ├── buttonMin.png +│ │ ├── buttonRestoreInactive.png +│ │ ├── buttonRestore.png +│ │ ├── buttonShadeDownInactive.png +│ │ ├── buttonShadeDown.png +│ │ ├── buttonShadeInactive.png +│ │ ├── buttonShade.png +│ │ ├── buttonStickyDownInactive.png +│ │ ├── buttonStickyDown.png +│ │ ├── buttonStickyInactive.png +│ │ └── buttonSticky.png +│ └── press +│ ├── buttonAboveDownPressInactive.png +│ ├── buttonAboveDownPress.png +│ ├── buttonAbovePressInactive.png +│ ├── buttonAbovePress.png +│ ├── buttonBelowDownPressInactive.png +│ ├── buttonBelowDownPress.png +│ ├── buttonBelowPressInactive.png +│ ├── buttonBelowPress.png +│ ├── buttonClosePressInactive.png +│ ├── buttonClosePress.png +│ ├── buttonHelpPressInactive.png +│ ├── buttonHelpPress.png +│ ├── buttonMaxPressInactive.png +│ ├── buttonMaxPress.png +│ ├── buttonMenuPressInactive.png +│ ├── buttonMenuPress.png +│ ├── buttonMinPressInactive.png +│ ├── buttonMinPress.png +│ ├── buttonRestorePressInactive.png +│ ├── buttonRestorePress.png +│ ├── buttonShadeDownPressInactive.png +│ ├── buttonShadeDownPress.png +│ ├── buttonShadePressInactive.png +│ ├── buttonShadePress.png +│ ├── buttonStickyDownPressInactive.png +│ ├── buttonStickyDownPress.png +│ ├── buttonStickyPressInactive.png +│ └── buttonStickyPress.png +├── deco +│ ├── bottomLeftFrameBg.png +│ ├── bottomLeftFrameInactiveBg.png +│ ├── bottomMidFrameBg.png +│ ├── bottomMidFrameInactiveBg.png +│ ├── bottomRightFrameBg.png +│ ├── bottomRightFrameInactiveBg.png +│ ├── bottomShadedLeftFrameBg.png +│ ├── bottomShadedLeftFrameInactiveBg.png +│ ├── bottomShadedMidFrameBg.png +│ ├── bottomShadedMidFrameInactiveBg.png +│ ├── bottomShadedRightFrameBg.png +│ ├── bottomShadedRightFrameInactiveBg.png +│ ├── buttonsLeftBg.png +│ ├── buttonsLeftInactiveBg.png +│ ├── buttonsRightBg.png +│ ├── buttonsRightInactiveBg.png +│ ├── leftLowerCornerFrameBg.png +│ ├── leftLowerCornerFrameInactiveBg.png +│ ├── leftMidFrameBg.png +│ ├── leftMidFrameInactiveBg.png +│ ├── leftUpperCornerFrameBg.png +│ ├── leftUpperCornerFrameInactiveBg.png +│ ├── leftUpperFrameBg.png +│ ├── leftUpperFrameInactiveBg.png +│ ├── rightLowerCornerFrameBg.png +│ ├── rightLowerCornerFrameInactiveBg.png +│ ├── rightMidFrameBg.png +│ ├── rightMidFrameInactiveBg.png +│ ├── rightUpperCornerFrameBg.png +│ ├── rightUpperCornerFrameInactiveBg.png +│ ├── rightUpperFrameBg.png +│ ├── rightUpperFrameInactiveBg.png +│ ├── titleLeftBg.png +│ ├── titleLeftInactiveBg.png +│ ├── titleMidBg.png +│ ├── titleMidInactiveBg.png +│ ├── titleRightBg.png +│ ├── titleRightInactiveBg.png +│ ├── topLeftFrameBg.png +│ ├── topLeftFrameInactiveBg.png +│ ├── topMidFrameBg.png +│ ├── topMidFrameInactiveBg.png +│ ├── topRightFrameBg.png +│ └── topRightFrameInactiveBg.png +└── masks + ├── buttomLeftCornerBitmap.png + ├── buttomMidBitmap.png + ├── buttomRightCornerBitmap.png + ├── buttomShadedLeftCornerBitmap.png + ├── buttomShadedMidBitmap.png + ├── buttomShadedRightCornerBitmap.png + ├── topLeftCornerBitmap.png + ├── topMidBitMap.png + └── topRightCornerBitmap.png |