diff --git a/resources/css/popup.css b/resources/css/popup.css index 8de165b16..2438efabd 100644 --- a/resources/css/popup.css +++ b/resources/css/popup.css @@ -1,17 +1,19 @@ QTreeView { - border: none; + border: 1px solid #ccc; background-color: white; outline: 0px; } QTreeView::item { - border: 1px solid transparent; - padding-left: 5px; - padding-right: 5px; + border: 2px solid transparent; + padding-left: 10px; + padding-right: 10px; + font-size: 20px; + line-height: 28px; } QTreeView::item:selected { - border: 1px solid #3366CC; + border: 2px solid #3366CC; background-color: #D9E9FF; color: black; } @@ -19,9 +21,12 @@ QTreeView::item:selected { QHeaderView::section { border: none; color: grey; - padding: 10px; + padding: 15px; padding-bottom: 0px; background-color: white; + font-size: 18px; + line-height: 26px; + font-weight: 500; } QScrollBar { diff --git a/resources/css/style.css b/resources/css/style.css index 16a56f35b..d774a29ea 100644 --- a/resources/css/style.css +++ b/resources/css/style.css @@ -87,16 +87,21 @@ MultiZimButton QListWidget { outline: 0px; } +MultiZimButton #zimItemWidget { + background-color: white; +} + MultiZimButton QListWidget::item:selected { border: 1px solid #3366CC; background-color: #D9E9FF; } MultiZimButton QRadioButton { - background-color: white; + background-color: transparent; + outline: none; } -MultiZimButton QRadioButton:hover { +MultiZimButton #zimItemWidget:hover { border: 1px solid #3366CC; background-color: #D9E9FF; } @@ -123,6 +128,13 @@ MultiZimButton QScrollBar::handle { background-color: grey; } +MultiZimButton QLabel { + background-color: transparent; + padding: 0px; + margin: 0px; + +} + SearchBar > QToolButton:pressed, SearchBar > QToolButton:hover { border: 1px solid #3366CC; @@ -134,23 +146,29 @@ SearchBar > QToolButton:hover { border: 1px solid transparent; background-color: white; font-size: 20px; - font-weight: bold; - padding: 3px; + font-weight: 500; + padding: 5px; } #selectAllButton::indicator { - width: 20px; - height: 20px; - border: 2px solid black; - border-radius: 3px; + width: 32px; + height: 32px; image: none; } +#selectAllButton::indicator:unchecked { + image: url(:/icons/checkbox.svg); +} + #selectAllButton::indicator:checked { - image: url(:/icons/check-solid.svg); + image: url(:/icons/checkbox-active.svg); } #selectAllButton:disabled { + background-color: white; +} + +#selectAllButton::indicator:disabled { background-color: #ccc; } diff --git a/src/searchbar.cpp b/src/searchbar.cpp index b38b4a44e..fe2b59163 100644 --- a/src/searchbar.cpp +++ b/src/searchbar.cpp @@ -5,6 +5,7 @@ #include #include #include +#include #include "kiwixapp.h" #include "suggestionlistworker.h" @@ -62,7 +63,7 @@ SearchBarLineEdit::SearchBarLineEdit(QWidget *parent) : m_completer.setCaseSensitivity(Qt::CaseInsensitive); /* +2 for fulltext and load more */ - m_completer.setMaxVisibleItems(SuggestionListWorker::getFetchSize() + 2); + m_completer.setMaxVisibleItems(8); m_completer.setWidget(this); /* QCompleter's uses default list views, which do not have headers. */ @@ -210,9 +211,10 @@ void SearchBarLineEdit::updateCompletion() x is flipped so it became -x in the sense of LTR, hence the adjustment of moving width + 2 * size. */ - int left = KiwixApp::isRightToLeft() ? -searchGeo.width() - (38 * 2) - : -39; - + // int left = KiwixApp::isRightToLeft() ? -searchGeo.width() - (38 * 2) + // : -39; + int left = KiwixApp::isRightToLeft() ? - (38 * 2) - 12 + : -39; /* Can't set height to 0. Will cause rectangle to be ignored. */ m_completer.complete(QRect(QPoint(left, top), QSize(width, 1))); @@ -293,14 +295,14 @@ SearchBar::SearchBar(QWidget *parent) : } MultiZimButton::MultiZimButton(QWidget *parent) - : QToolButton(parent), mp_buttonList(nullptr), mp_selectAllButton(nullptr) + : QToolButton(parent), mp_buttonList(nullptr), mp_selectAllButton(nullptr), mp_radioButtonGroup(nullptr) { setMenu(new QMenu(this)); setPopupMode(QToolButton::InstantPopup); setIcon(QIcon(":/icons/filter.svg")); setToolTip(gt("multi-zim-search")); - mp_buttonList = new QListWidget(this); + mp_buttonList = new MultiZimListWidget; mp_selectAllButton = new QCheckBox(gt("select-all"),this); auto popupAction = new QWidgetAction(menu()); @@ -314,12 +316,16 @@ MultiZimButton::MultiZimButton(QWidget *parent) menu()->addAction(popupAction); mp_buttonList->setSelectionMode(QAbstractItemView::SingleSelection); mp_buttonList->setFixedWidth(menu()->sizeHint().width()); - mp_buttonList->setMinimumHeight(42 * 7); + mp_buttonList->setMaximumHeight(42 * 7); + mp_buttonList->setSizeAdjustPolicy(QListWidget::AdjustToContents); mp_selectAllButton->setObjectName("selectAllButton"); mp_selectAllButton->setFixedHeight(42); + mp_selectAllButton->setLayoutDirection(KiwixApp::isRightToLeft() ? Qt::LayoutDirection::LeftToRight : Qt::LayoutDirection::RightToLeft); /* TODO: connect with list widget after multi-zim */ - mp_selectAllButton->setDisabled(true); + // mp_selectAllButton->setDisabled(true); + + mp_radioButtonGroup = new QButtonGroup(this); } QString MultiZimButton::getZimId() const @@ -327,7 +333,7 @@ QString MultiZimButton::getZimId() const for (int row = 0; row < mp_buttonList->model()->rowCount(); row++) { auto listItem = mp_buttonList->item(row); - auto radioBt = qobject_cast(mp_buttonList->itemWidget(listItem)); + auto radioBt = mp_buttonList->itemWidget(listItem)->findChild(); if (radioBt && radioBt->isChecked()) return listItem->data(Qt::UserRole).toString(); } @@ -364,6 +370,10 @@ QString elideDisplayText(const QString& text, const QFont& font, int width) void MultiZimButton::update_display() { mp_buttonList->clear(); + for (auto button : mp_radioButtonGroup->buttons()) + { + mp_radioButtonGroup->removeButton(button); + } auto library = KiwixApp::instance()->getLibrary(); WebView* current = KiwixApp::instance()->getTabWidget()->currentWebView(); for (const auto& bookId : library->getBookIds()) @@ -378,12 +388,24 @@ void MultiZimButton::update_display() zimIcon = library->getZimIcon(bookId, QIcon(":/icons/placeholder-icon.png")); QRadioButton* radioBt = new QRadioButton; + mp_radioButtonGroup->addButton(radioBt); QListWidgetItem* item = new QListWidgetItem(); item->setData(Qt::UserRole, bookId); item->setSizeHint(QSize(0, 42)); - radioBt->setIcon(zimIcon); - radioBt->setIconSize(QSize(32, 32)); - radioBt->setFont(QFont("Selawik", 16)); + QWidget* zimItemWidget = new QWidget; + zimItemWidget->setObjectName("zimItemWidget"); + zimItemWidget->setLayout(new QHBoxLayout); + zimItemWidget->layout()->setSpacing(0); + QLabel* iconLabel = new QLabel; + iconLabel->setFixedSize(QSize(32, 32)); + iconLabel->setText(""); + iconLabel->setPixmap(zimIcon.pixmap(QSize(32, 32))); + radioBt->setFixedSize(QSize(32, 32)); + + zimItemWidget->layout()->addWidget(iconLabel); + // radioBt->setIcon(zimIcon); + // radioBt->setIconSize(QSize(32, 32)); + // radioBt->setFont(QFont("Selawik", 16)); /* See MultiZimButton::QRadioButton::indicator and MultiZimButton::QScrollBar size values in resources/css/style.css @@ -397,8 +419,16 @@ void MultiZimButton::update_display() else mp_buttonList->addItem(item); bookTitle = elideDisplayText(bookTitle, radioBt->font(), length); - radioBt->setText(bookTitle); - mp_buttonList->setItemWidget(item, radioBt); + QLabel* textLabel = new QLabel(bookTitle); + textLabel->setFixedHeight(32); + textLabel->setContentsMargins(0,0,0,0); + textLabel->setSizePolicy(QSizePolicy::MinimumExpanding, QSizePolicy::MinimumExpanding); + textLabel->setAlignment({Qt::AlignVCenter | Qt::AlignLeft}); + zimItemWidget->layout()->addWidget(textLabel); + zimItemWidget->layout()->addWidget(radioBt); + zimItemWidget->layout()->setAlignment(Qt::AlignVCenter); + zimItemWidget->layout()->setContentsMargins(0,0,0,0); + mp_buttonList->setItemWidget(item, zimItemWidget); } catch(...) { @@ -411,8 +441,12 @@ void MultiZimButton::update_display() else { auto firstWidget = mp_buttonList->itemWidget(mp_buttonList->item(0)); - qobject_cast(firstWidget)->setChecked(true); + firstWidget->findChild()->setChecked(true); mp_buttonList->scrollToTop(); setDisabled(false); } } + +QSize MultiZimListWidget::sizeHint() const { + return QSize(0, count() * 42); +} diff --git a/src/searchbar.h b/src/searchbar.h index 952721c4e..ef9ef1e21 100644 --- a/src/searchbar.h +++ b/src/searchbar.h @@ -11,8 +11,8 @@ #include #include #include "suggestionlistmodel.h" +#include -class QListWidget; class QCheckBox; class BookmarkButton : public QToolButton { @@ -67,9 +67,15 @@ public slots: private: QListWidget* mp_buttonList; QCheckBox* mp_selectAllButton; + QButtonGroup* mp_radioButtonGroup; QString m_zimId; }; +class MultiZimListWidget : public QListWidget { +protected: + QSize sizeHint() const; +}; + class SearchBar : public QToolBar { Q_OBJECT public: diff --git a/src/suggestionlistmodel.cpp b/src/suggestionlistmodel.cpp index 797add96f..d03464299 100644 --- a/src/suggestionlistmodel.cpp +++ b/src/suggestionlistmodel.cpp @@ -43,7 +43,9 @@ QVariant SuggestionListModel::loadMoreButtonData(const QModelIndex &index, int r if (!isLoadMoreIndex(index)) return QVariant(); - QFont font = QFont("Selawik", 16, QFont::Bold); + QFont font = QFont("Selawik"); + font.setWeight(QFont::Weight::DemiBold); + font.setPixelSize(20); switch (role) { case Qt::DisplayRole: @@ -70,7 +72,8 @@ QVariant SuggestionListModel::data(const QModelIndex &index, int role) const return loadMoreButtonData(index, role); auto app = KiwixApp::instance(); - QFont font = QFont("Selawik", 16); + QFont font = QFont("Selawik"); + font.setPixelSize(20); switch (role) { case Qt::DisplayRole: