popup searchbar new design

resources/css/_contentManager.css

@@ -13,6 +13,11 @@ html, body {
 *:focus {
     outline: none;
 }
+
+#searchBar {
+    padding: 10px;
+}
+
 #searchInput {
     background-image: url('qrc:///icons/search.svg');
     background-repeat: no-repeat;

resources/css/popup.css

@@ -0,0 +1,14 @@
+QWidget {
+    background-color: white;
+    border: none;
+}
+
+QScrollBar {
+    width: 5px;
+    border: none;
+    outline: none;
+}
+
+QScrollBar::handle {
+    background-color: grey;
+}

resources/css/style.css

@@ -11,9 +11,9 @@ TopWidget {
     min-height: 48px;
     max-height: 48px;
     margin: 0px;
-    padding: 0px;
+    padding: 5px;
     border: none;
-    border-bottom: 2px solid #ccc;
+    border-bottom: 1px solid #ccc;
 }
 
 TopWidget::separator {
@@ -32,12 +32,12 @@ QToolButton {
 SearchBar {
     background-color: white;
     padding: 2px 2px 2px 40px;
-    max-height: 40px;
-    margin: 5px;
+    max-height: 38px;
+    margin-bottom: 2px;
     color: #666;
     font-size: 16px;
-    border: 2px solid #ccc;
-    border-radius: 5px;
+    border: 1px solid #ccc;
+    border-radius: 3px;
 }
 
 SearchBar > QPushButton {

resources/style.qrc

@@ -1,5 +1,6 @@
 <RCC>
     <qresource prefix="/">
         <file>css/style.css</file>
+        <file>css/popup.css</file>
     </qresource>
 </RCC>

src/searchbar.cpp

@@ -64,6 +64,14 @@ SearchBar::SearchBar(QWidget *parent) :
     m_completer.setCompletionMode(QCompleter::UnfilteredPopupCompletion);
     m_completer.setCaseSensitivity(Qt::CaseInsensitive);
     setCompleter(&m_completer);
+
+    QFile styleFile(":/css/popup.css");
+    styleFile.open(QIODevice::ReadOnly);
+    auto byteContent = styleFile.readAll();
+    styleFile.close();
+    QString style(byteContent);
+    m_completer.popup()->setStyleSheet(style);
+
     connect(this, &QLineEdit::textEdited, this, &SearchBar::updateCompletion);
     connect(&m_completer, QOverload<const QModelIndex &>::of(&QCompleter::activated),
             this, &SearchBar::openCompletion);