64898b2c79
Some checks failed
Code scanning / CodeQL (push) Failing after 15s
Zulip production suite / Ubuntu 22.04 production build (push) Failing after 26s
Zulip production suite / Debian 12 production install with custom db name and user (push) Has been skipped
Zulip production suite / Ubuntu 22.04 production install and PostgreSQL upgrade with pgroonga (push) Has been skipped
Zulip production suite / Ubuntu 24.04 production install (push) Has been skipped
Zulip production suite / Ubuntu 26.04 production install (push) Has been skipped
Zulip production suite / Debian 13 production install (push) Has been skipped
Zulip production suite / 7.0 Version Upgrade (push) Has been skipped
Zulip production suite / 8.0 Version Upgrade (push) Has been skipped
Zulip production suite / 6.0 Version Upgrade (push) Has been skipped
Zulip production suite / 10.0 Version Upgrade (push) Has been skipped
Zulip production suite / 9.0 Version Upgrade (push) Has been skipped
Zulip production suite / 12.0 Version Upgrade (push) Has been skipped
Zulip production suite / 11.0 Version Upgrade (push) Has been skipped
GitHub Actions Security Analysis with zizmor / zizmor (push) Failing after 3s
Zulip CI / Debian 12 (Python 3.11, backend + documentation) (push) Failing after 26s
Zulip CI / Ubuntu 22.04 (Python 3.10, backend + frontend) (push) Failing after 3s
Zulip CI / Ubuntu 24.04 (Python 3.12, backend) (push) Failing after 25s
Zulip CI / Ubuntu 26.04 (Python 3.14, backend) (push) Failing after 25s
Zulip CI / Debian 13 (Python 3.13, backend) (push) Failing after 28s
Zulip production suite / Required jobs (push) Has been cancelled
Zulip CI / Required jobs (push) Has been cancelled
API Documentation Update Check / check-feature-level-updated (push) Has been cancelled
API Documentation Update Check / notify-if-api-docs-changed (push) Has been cancelled
212 lines
15 KiB
HTML
212 lines
15 KiB
HTML
{% extends "zerver/base.html" %}
|
|
{% set entrypoint = "showroom" %}
|
|
|
|
{% block title %}
|
|
<title>{{ doc_root_title }} | Zulip Dev</title>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="portico-container" data-platform="{{ platform }}">
|
|
<div class="portico-wrap">
|
|
{% include 'zerver/portico-header.html' %}
|
|
<div class="app portico-page">
|
|
<div class="banner-wrapper" id="showroom_component_banner_navbar_alerts_wrapper"></div>
|
|
<div class="app-main portico-page-container">
|
|
<div class="showroom-wrapper">
|
|
<div class="banner-wrapper" id="showroom_component_banner_default_wrapper"></div>
|
|
<section class="showroom-controls-section">
|
|
<div class="showroom-controls-label">Theme Settings</div>
|
|
<div class="showroom-controls">
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Dark Theme</span>
|
|
<div role="group" class="tab-picker showroom-control-setting">
|
|
<input type="radio" data-theme="dark" id="showroom_enable_dark_theme_banners" class="tab-option" name="showroom-dark-theme-select"/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="showroom_enable_dark_theme_banners" tabindex="0">
|
|
<span>Enable</span>
|
|
</label>
|
|
<input type="radio" data-theme="light" id="showroom_disable_dark_theme_banners" class="tab-option" name="showroom-dark-theme-select" checked/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="showroom_disable_dark_theme_banners" tabindex="0">
|
|
<span>Disable</span>
|
|
</label>
|
|
<span class="slider"></span>
|
|
</div>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Select Background</span>
|
|
<select class="showroom-control-element showroom-control-setting select_background">
|
|
{% for background in background_colors %}
|
|
<option value="{{ background.css_var }}" {% if background.css_var == "--color-background" %}selected{% endif %}>{{ background.name }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="showroom-controls-label">Banner Settings</div>
|
|
<div class="showroom-controls">
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Alert Banner Type</span>
|
|
<select class="showroom-control-element showroom-control-setting" id="banner_select_type"></select>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Banner Intent</span>
|
|
<select class="showroom-control-element showroom-control-setting" id="showroom_component_banner_select_intent"></select>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Banner Label</span>
|
|
<input class="showroom-control-element showroom-control-setting" type="text" id="banner_label" />
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Banner Close Button</span>
|
|
<div role="group" class="tab-picker showroom-control-setting">
|
|
<input type="radio" id="enable_banner_close_button" class="tab-option" name="banner-close-button-select"/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="enable_banner_close_button" tabindex="0">
|
|
<span>Enable</span>
|
|
</label>
|
|
<input type="radio" id="disable_banner_close_button" class="tab-option" name="banner-close-button-select" checked/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="disable_banner_close_button" tabindex="0">
|
|
<span>Disable</span>
|
|
</label>
|
|
<span class="slider"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="showroom-controls-label">Solid Button Settings</div>
|
|
<div class="showroom-controls">
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Button</span>
|
|
<div role="group" class="tab-picker showroom-control-setting">
|
|
<input type="radio" id="enable_solid_button" class="tab-option" name="solid-button-select"/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="enable_solid_button" tabindex="0">
|
|
<span>Enable</span>
|
|
</label>
|
|
<input type="radio" id="disable_solid_button" class="tab-option" name="solid-button-select" checked/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="disable_solid_button" tabindex="0">
|
|
<span>Disable</span>
|
|
</label>
|
|
<span class="slider"></span>
|
|
</div>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Button Icon</span>
|
|
<div role="group" class="tab-picker showroom-control-setting">
|
|
<input type="radio" id="enable_solid_button_icon" class="tab-option" name="solid-button-icon-select"/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="enable_solid_button_icon" tabindex="0">
|
|
<span>Enable</span>
|
|
</label>
|
|
<input type="radio" id="disable_solid_button_icon" class="tab-option" name="solid-button-icon-select" checked/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="disable_solid_button_icon" tabindex="0">
|
|
<span>Disable</span>
|
|
</label>
|
|
<span class="slider"></span>
|
|
</div>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Select Icon</span>
|
|
<select class="showroom-control-element showroom-control-setting" id="solid_button_select_icon">
|
|
{% for icon in icons %}
|
|
<option value="{{ icon }}" {% if icon == "move-alt" %}selected{% endif %}>{{ icon }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Button Text</span>
|
|
<input class="showroom-control-element showroom-control-setting" type="text" id="solid_button_text" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="showroom-controls-label">Subtle Button Settings</div>
|
|
<div class="showroom-controls">
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Button</span>
|
|
<div role="group" class="tab-picker showroom-control-setting">
|
|
<input type="radio" id="enable_subtle_button" class="tab-option" name="subtle-button-select"/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="enable_subtle_button" tabindex="0">
|
|
<span>Enable</span>
|
|
</label>
|
|
<input type="radio" id="disable_subtle_button" class="tab-option" name="subtle-button-select" checked/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="disable_subtle_button" tabindex="0">
|
|
<span>Disable</span>
|
|
</label>
|
|
<span class="slider"></span>
|
|
</div>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Button Icon</span>
|
|
<div role="group" class="tab-picker showroom-control-setting">
|
|
<input type="radio" id="enable_subtle_button_icon" class="tab-option" name="subtle-button-icon-select"/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="enable_subtle_button_icon" tabindex="0">
|
|
<span>Enable</span>
|
|
</label>
|
|
<input type="radio" id="disable_subtle_button_icon" class="tab-option" name="subtle-button-icon-select" checked/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="disable_subtle_button_icon" tabindex="0">
|
|
<span>Disable</span>
|
|
</label>
|
|
<span class="slider"></span>
|
|
</div>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Select Icon</span>
|
|
<select class="showroom-control-element showroom-control-setting" id="subtle_button_select_icon">
|
|
{% for icon in icons %}
|
|
<option value="{{ icon }}" {% if icon == "move-alt" %}selected{% endif %}>{{ icon }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Button Text</span>
|
|
<input class="showroom-control-element showroom-control-setting" type="text" id="subtle_button_text" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="showroom-controls-label">Text Button Settings</div>
|
|
<div class="showroom-controls">
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Button</span>
|
|
<div role="group" class="tab-picker showroom-control-setting">
|
|
<input type="radio" id="enable_text_button" class="tab-option" name="text-button-select"/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="enable_text_button" tabindex="0">
|
|
<span>Enable</span>
|
|
</label>
|
|
<input type="radio" id="disable_text_button" class="tab-option" name="text-button-select" checked/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="disable_text_button" tabindex="0">
|
|
<span>Disable</span>
|
|
</label>
|
|
<span class="slider"></span>
|
|
</div>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Button Icon</span>
|
|
<div role="group" class="tab-picker showroom-control-setting">
|
|
<input type="radio" id="enable_text_button_icon" class="tab-option" name="text-button-icon-select"/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="enable_text_button_icon" tabindex="0">
|
|
<span>Enable</span>
|
|
</label>
|
|
<input type="radio" id="disable_text_button_icon" class="tab-option" name="text-button-icon-select" checked/>
|
|
<label role="menuitemradio" class="tab-option-content showroom-control-element" for="disable_text_button_icon" tabindex="0">
|
|
<span>Disable</span>
|
|
</label>
|
|
<span class="slider"></span>
|
|
</div>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Select Icon</span>
|
|
<select class="showroom-control-element showroom-control-setting" id="text_button_select_icon">
|
|
{% for icon in icons %}
|
|
<option value="{{ icon }}" {% if icon == "move-alt" %}selected{% endif %}>{{ icon }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div class="showroom-control">
|
|
<span class="showroom-control-label">Button Text</span>
|
|
<input class="showroom-control-element showroom-control-setting" type="text" id="text_button_text" />
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|