Fix markdown toolbar button style

This commit is contained in:
yflory 2025-07-01 11:51:30 +02:00
parent 7f76b929c3
commit beff27b19e
2 changed files with 12 additions and 4 deletions

View File

@ -291,20 +291,28 @@
//reusable styling for the markdown toggle button across all apps
.markdown-toolbar-button-style() {
padding: 3px 5px;
padding: 0px 5px;
height: fit-content;
margin: 0;
line-height: 1;
line-height: unset;
border-radius: @variables_radius;
display: inline-flex;
gap: 5px;
text-transform: uppercase;
background-color: @cp_toolbar-bottom-bg;
border: 1px solid @cp_toolbar-bottom-bg;
color: @cp_toolbar-bottom-fg;
align-items: center;
&:hover {
background-color: fade(@cryptpad_text_col, 20%);
border-color: @cryptpad_text_col;
color: @cryptpad_text_col;
}
&:focus-visible {
outline: @variables_focus_style;
box-shadow: unset;
}
&.cp-toolbar-button-active {
background-color: @cp_toolbar-bg;

View File

@ -1312,14 +1312,14 @@ define([
var toolbarVisibleOnSmallScreen = false;
const $toolbarToggleButton = $(h('button.btn.cp-markdown-toggle-button', {
const $toolbarToggleButton = $(h('button.cp-markdown-toggle-button', {
'aria-label': Messages.toolbar_show_text_tools,
'aria-pressed': 'false',
'data-notippy': 1,
'type': 'button',
'title': Messages.toolbar_show_text_tools
})).append([
h('i.fa.fa-wrench', { 'aria-hidden': 'true' }),
h('i.fa.fa-pencil', { 'aria-hidden': 'true' }),
h('span.cp-toolbar-label', {}, Messages.toolbar_text_tools)
]).click(function () {
var isExpanded = $toolbar.is(':visible');