GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-09-18 14:02:21 -04:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Improve hover feedback on various widgets (#2079)

Browse source 
* Use cursor: pointer on QCheckBoxes too and exclude disabled widgets

* Left-align all QCheckBoxes to make hover-area and clickable area the same

Altough the clickable area has always been restricted to the label, the widget itself stretched all the way. This became a problem with the new cursor-pointer for checkboxes.

* Remove Switch duplicate from deck-options

* Add cursor: pointer to Switch and RevertButton

* Add cursor: pointer to bottom toolbar buttons

* Add cursor: pointer to gears

* Add cursor: pointer to radio and checkbox inputs of graphs page

* Improve button appearance in stats screen

* Add cursor: pointer to QTabBar and QToolButton

* Add cursor: pointer to non-editable QComboBox

* Center settings-will-take-effect-after notice in preferences screen

* Use public without_qt5_compat_wrapper() function

* Run prettier
This commit is contained in:
Matthias Metelka 2022-09-20 08:34:15 +02:00 committed by GitHub
parent 09cb8b3cf6
commit e109c62aa9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
19 changed files with 87 additions and 100 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
qt/aqt/__init__.py
View file

@ -346,15 +346,33 @@ class AnkiApp(QApplication):
def eventFilter(self, src: Any, evt: QEvent) -> bool:
if evt.type() == QEvent.Type.HoverEnter:
if isinstance(src, QPushButton):
# TODO: apply drop-shadow with setGraphicsEffect(QGraphicsDropShadowEffect)
# issue: can't access attributes of QClassProxy (Qt5-compat)
if (
(
isinstance(
src,
(
QPushButton,
QCheckBox,
# classes with PyQt5 compatibility proxy
without_qt5_compat_wrapper(QToolButton),
without_qt5_compat_wrapper(QTabBar),
),
)
)
and src.isEnabled()
or (
isinstance(src, without_qt5_compat_wrapper(QComboBox))
and not src.isEditable()
)
):
self.setOverrideCursor(QCursor(Qt.CursorShape.PointingHandCursor))
else:
self.restoreOverrideCursor()
return False
elif evt.type() == QEvent.Type.HoverLeave or isinstance(evt, QCloseEvent):
elif evt.type() in [QEvent.Type.HoverLeave, QEvent.Type.Leave] or isinstance(
evt, QCloseEvent
):
self.restoreOverrideCursor()
return False

1
qt/aqt/data/web/css/deckbrowser.scss
View file

@ -71,6 +71,7 @@ body {
height: 1em;
opacity: 0.5;
padding-top: 0.2em;
cursor: pointer;
}
.nightMode {

10
qt/aqt/forms/dconf.ui
View file

@ -186,7 +186,7 @@
<item row="1" column="1" colspan="2">
<widget class="QComboBox" name="newOrder"/>
</item>
<item row="6" column="0" colspan="3">
<item row="6" column="0" colspan="3" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="bury">
<property name="text">
<string>scheduling_bury_related_new_cards_until_the</string>
@ -355,7 +355,7 @@
</property>
</widget>
</item>
<item row="5" column="0" colspan="3">
<item row="5" column="0" colspan="3" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="buryRev">
<property name="text">
<string>scheduling_bury_related_reviews_until_the_next</string>
@ -604,21 +604,21 @@
</item>
</layout>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="showTimer">
<property name="text">
<string>scheduling_show_answer_timer</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="autoplaySounds">
<property name="text">
<string>scheduling_automatically_play_audio</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="replayQuestion">
<property name="text">
<string>scheduling_always_include_question_side_when_replaying</string>

2
qt/aqt/forms/emptycards.ui
View file

@ -55,7 +55,7 @@
<property name="bottomMargin">
<number>12</number>
</property>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="keep_notes">
<property name="text">
<string notr="true">KEEP_NOTES</string>

20
qt/aqt/forms/exporting.ui
View file

@ -6,8 +6,8 @@
<rect>
<x>0</x>
<y>0</y>
<width>610</width>
<height>348</height>
<width>550</width>
<height>200</height>
</rect>
</property>
<property name="windowTitle">
@ -57,7 +57,7 @@
</item>
<item>
<layout class="QVBoxLayout">
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="includeSched">
<property name="text">
<string>exporting_include_scheduling_information</string>
@ -67,7 +67,7 @@
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="includeMedia">
<property name="text">
<string>exporting_include_media</string>
@ -77,14 +77,14 @@
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="includeHTML">
<property name="text">
<string>exporting_include_html_and_media_references</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="includeTags">
<property name="text">
<string>exporting_include_tags</string>
@ -94,7 +94,7 @@
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="includeDeck">
<property name="enabled">
<bool>true</bool>
@ -104,7 +104,7 @@
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="includeNotetype">
<property name="enabled">
<bool>true</bool>
@ -114,14 +114,14 @@
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="includeGuid">
<property name="text">
<string>exporting_include_guid</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="legacy_support">
<property name="text">
<string>exporting_support_older_anki_versions</string>

6
qt/aqt/forms/fields.ui
View file

@ -131,14 +131,14 @@
</property>
</widget>
</item>
<item row="3" column="1">
<item row="3" column="1" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="rtl">
<property name="text">
<string>fields_reverse_text_direction_rtl</string>
</property>
</widget>
</item>
<item row="4" column="1">
<item row="4" column="1" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="plainTextByDefault">
<property name="enabled">
<bool>true</bool>
@ -162,7 +162,7 @@
</property>
</widget>
</item>
<item row="5" column="1">
<item row="5" column="1" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="collapseByDefault">
<property name="enabled">
<bool>true</bool>

6
qt/aqt/forms/filtered_deck.ui
View file

@ -198,7 +198,7 @@
<string>actions_options</string>
</property>
<layout class="QGridLayout" name="gridLayout_2">
<item row="0" column="0" colspan="2">
<item row="0" column="0" colspan="2" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="resched">
<property name="text">
<string>decks_reschedule_cards_based_on_my_answers</string>
@ -208,7 +208,7 @@
</property>
</widget>
</item>
<item row="2" column="0">
<item row="2" column="0" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="secondFilter">
<property name="text">
<string>decks_enable_second_filter</string>
@ -248,7 +248,7 @@
</property>
</widget>
</item>
<item row="3" column="0">
<item row="3" column="0" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="stepsOn">
<property name="text">
<string>decks_custom_steps_in_minutes</string>

6
qt/aqt/forms/findreplace.ui
View file

@ -63,14 +63,14 @@
</property>
</widget>
</item>
<item row="5" column="1">
<item row="5" column="1" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="re">
<property name="text">
<string>browsing_treat_input_as_regular_expression</string>
</property>
</widget>
</item>
<item row="4" column="1">
<item row="4" column="1" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="ignoreCase">
<property name="text">
<string>browsing_ignore_case</string>
@ -99,7 +99,7 @@
</property>
</widget>
</item>
<item row="3" column="1">
<item row="3" column="1" alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="selected_notes">
<property name="text">
<string>browsing_selected_notes_only</string>

4
qt/aqt/forms/forget.ui
View file

@ -17,14 +17,14 @@
<bool>true</bool>
</property>
<layout class="QVBoxLayout" name="verticalLayout_2">
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="restore_position">
<property name="text">
<string>scheduling_restore_position</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="reset_counts">
<property name="text">
<string>scheduling_reset_counts</string>

2
qt/aqt/forms/importing.ui
View file

@ -70,7 +70,7 @@
</item>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="allowHTML">
<property name="text">
<string>importing_allow_html_in_fields</string>

2
qt/aqt/forms/modelopts.ui
View file

@ -27,7 +27,7 @@
<string>editing_latex</string>
</attribute>
<layout class="QVBoxLayout" name="verticalLayout">
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="latexsvg">
<property name="text">
<string>notetypes_create_scalable_images_with_dvisvgm</string>

34
qt/aqt/forms/preferences.ui
View file

@ -61,49 +61,49 @@
<item>
<widget class="QComboBox" name="video_driver"/>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="showPlayButtons">
<property name="text">
<string>preferences_show_play_buttons_on_cards_with</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="interrupt_audio">
<property name="text">
<string>preferences_interrupt_current_audio_when_answering</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="pastePNG">
<property name="text">
<string>preferences_paste_clipboard_images_as_png</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="paste_strips_formatting">
<property name="text">
<string>preferences_paste_without_shift_key_strips_formatting</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="ignore_accents_in_search">
<property name="text">
<string>preferences_ignore_accents_in_search</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="legacy_import_export">
<property name="text">
<string notr="true">Legacy import/export handling</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="reduce_motion">
<property name="toolTip">
<string>preferences_reduce_motion_tooltip</string>
@ -204,35 +204,35 @@
<string>preferences_scheduling</string>
</attribute>
<layout class="QVBoxLayout" name="verticalLayout_5">
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="showEstimates">
<property name="text">
<string>preferences_show_next_review_time_above_answer</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="showProgress">
<property name="text">
<string>preferences_show_remaining_card_count_during_review</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="dayLearnFirst">
<property name="text">
<string>preferences_show_learning_cards_with_larger_steps</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="legacy_timezone">
<property name="text">
<string>preferences_legacy_timezone_handling</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="sched2021">
<property name="toolTip">
<string notr="true"/>
@ -382,28 +382,28 @@
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="syncMedia">
<property name="text">
<string>preferences_synchronize_audio_and_images_too</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="syncOnProgramOpen">
<property name="text">
<string>preferences_automatically_sync_on_profile_openclose</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="autoSyncMedia">
<property name="text">
<string>preferences_periodically_sync_media</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="fullSync">
<property name="text">
<string>preferences_on_next_sync_force_changes_in</string>
@ -666,7 +666,7 @@
</widget>
</widget>
</item>
<item>
<item alignment="Qt::AlignCenter">
<widget class="QLabel" name="label_21">
<property name="text">
<string>preferences_some_settings_will_take_effect_after</string>

4
qt/aqt/forms/reposition.ui
View file

@ -62,14 +62,14 @@
</item>
</layout>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="randomize">
<property name="text">
<string>browsing_randomize_order</string>
</property>
</widget>
</item>
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="shift">
<property name="text">
<string>browsing_shift_position_of_existing_cards</string>

2
qt/aqt/forms/taglimit.ui
View file

@ -14,7 +14,7 @@
<string>custom_study_selective_study</string>
</property>
<layout class="QVBoxLayout" name="verticalLayout">
<item>
<item alignment="Qt::AlignLeft">
<widget class="QCheckBox" name="activeCheck">
<property name="text">
<string>custom_study_require_one_or_more_of_these</string>

1
sass/buttons.scss
View file

@ -23,6 +23,7 @@
button {
-webkit-appearance: none;
color: vars.color(fg);
cursor: pointer;
background: linear-gradient(
180deg,

1
ts/components/Switch.svelte
View file

@ -37,6 +37,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
.form-switch & {
width: 3em;
margin-left: 1.5em;
cursor: pointer;
}
}

4
ts/deck-options/RevertButton.svelte
View file

@ -89,6 +89,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
}
}
:global(.badge) {
cursor: pointer;
}
.hide :global(.badge) {
opacity: 0;
}

47
ts/deck-options/Switch.svelte
View file

@ -1,47 +0,0 @@
<!--
Copyright: Ankitects Pty Ltd and contributors
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
-->
<script lang="ts">
import { pageTheme } from "../sveltelib/theme";
export let id: string | undefined;
export let value: boolean;
export let disabled = false;
</script>
<div class="form-check form-switch">
<input
{id}
type="checkbox"
class="form-check-input"
class:nightMode={$pageTheme.isDark}
bind:checked={value}
{disabled}
/>
</div>
<style lang="scss">
.form-switch {
/* bootstrap adds a default 2.5em left pad, which causes */
/* text to wrap prematurely */
padding-left: 0.5em;
}
.form-check-input {
-webkit-appearance: none;
height: 1.6em;
/* otherwise the switch circle shows slightly off-centered */
margin-top: 0;
.form-switch & {
width: 3em;
margin-left: 1.5em;
}
}
.nightMode:not(:checked) {
background-color: var(--canvas-elevated);
border-color: var(--border);
}
</style>

9
ts/graphs/graphs-base.scss
View file

@ -1 +1,10 @@
@use "sass/base";
@use "sass/button-mixins" as button;
label,
input[type="radio"],
input[type="checkbox"] {
cursor: pointer;
}
@include button.base;