{{template "base/head" .}}

Button

Style:
State:
  • General purpose:

  • Recommended colors:

  • Supported but not recommended:

    Do not use if there is no strong requirement. Do not use grey/black buttons, they don't work well with dark theme.

  • Inline / Plain:

Buttons

Tooltip

text with tooltip
text with interactive tooltip

Loading

loading ...

loading ...

loading ...

loading ...

loading ...

GiteaOriginUrl

LocaleNumber

{{ctx.Locale.PrettyNumber 1}}
{{ctx.Locale.PrettyNumber 12}}
{{ctx.Locale.PrettyNumber 123}}
{{ctx.Locale.PrettyNumber 1234}}
{{ctx.Locale.PrettyNumber 12345}}
{{ctx.Locale.PrettyNumber 123456}}
{{ctx.Locale.PrettyNumber 1234567}}

TimeSince

Now: {{TimeSince .TimeNow ctx.Locale}}
5s past: {{TimeSince .TimePast5s ctx.Locale}}
5s future: {{TimeSince .TimeFuture5s ctx.Locale}}
2m past: {{TimeSince .TimePast2m ctx.Locale}}
2m future: {{TimeSince .TimeFuture2m ctx.Locale}}
1y past: {{TimeSince .TimePast1y ctx.Locale}}
1y future: {{TimeSince .TimeFuture1y ctx.Locale}}

SVG alignment

Text with SVG

{{svg "octicon-alert"}} {{svg "octicon-x"}} text (block)
{{svg "octicon-alert"}} {{svg "octicon-x"}} text
(inline)
{{svg "octicon-alert"}} flex item with very very very very very very very very long content
{{svg "octicon-alert"}} flex every line
{{svg "octicon-alert"}} flex every item
{{svg "octicon-alert"}} flex item with very very very very very very very very long content

Button with SVG

123

Input with SVG

Dropdown with SVG

Toast

ComboMarkdownEditor

ps: no JS code attached, so just a layout
{{template "shared/combomarkdowneditor" .}}
{{template "base/footer" .}}