Resolves tdf#135270 - Make the tight extensions dialog shiny

Information rearranged, empty icons instead of hidden,
background and scaling of thumbnail

Change-Id: Iae095134a717cb50670bf5d1786774c6424d283e
Reviewed-on: https://gerrit.libreoffice.org/c/core/+/104079
Tested-by: Jenkins
Reviewed-by: Heiko Tietze <heiko.tietze@documentfoundation.org>

5 files changed, 294 insertions, 202 deletions

diff --git a/cui/inc/strings.hrc b/cui/inc/strings.hrc
index e96e76e85fd2..19b7730b60a4 100644
--- a/cui/inc/strings.hrc
+++ b/cui/inc/strings.hrc
@@ -394,8 +394,6 @@
 #define RID_SVXSTR_ADDITIONS_INSTALLBUTTON          NC_("RID_SVXSTR_ADDITIONS_INSTALLBUTTON", "Install")
 #define RID_SVXSTR_ADDITIONS_INSTALLEDBUTTON        NC_("RID_SVXSTR_ADDITIONS_INSTALLEDBUTTON", "Installed")
 #define RID_SVXSTR_ADDITIONS_INSTALLING             NC_("RID_SVXSTR_ADDITIONS_INSTALLING", "Installing")
-#define RID_SVXSTR_ADDITIONS_LICENCE                NC_("RID_SVXSTR_ADDITIONS_LICENCE", "License:")
-#define RID_SVXSTR_ADDITIONS_REQUIREDVERSION        NC_("RID_SVXSTR_ADDITIONS_REQUIREDVERSION","Required version: >=")
 #define RID_SVXSTR_ADDITIONS_SEARCHING              NC_("RID_SVXSTR_ADDITIONS_SEARCHING", "Searching...")
 #define RID_SVXSTR_ADDITIONS_LOADING                NC_("RID_SVXSTR_ADDITIONS_LOADING", "Loading...")
 #define RID_SVXSTR_ADDITIONS_DIALOG_TITLE_PREFIX    NC_("RID_SVXSTR_ADDITIONS_DIALOG_TITLE_PREFIX", "Extensions")
diff --git a/cui/source/dialogs/AdditionsDialog.cxx b/cui/source/dialogs/AdditionsDialog.cxx
index 7d5d953ad976..ad8f5de0928b 100644
--- a/cui/source/dialogs/AdditionsDialog.cxx
+++ b/cui/source/dialogs/AdditionsDialog.cxx
@@ -282,6 +282,8 @@ bool getPreviewFile(const AdditionInfo& aAdditionInfo, OUString& sPreviewFile)
 
 void LoadImage(const OUString& rPreviewFile, std::shared_ptr<AdditionsItem> pCurrentItem)
 {
+    const sal_Int8 Margin = 6;
+
     SolarMutexGuard aGuard;
 
     GraphicFilter aFilter;
@@ -292,11 +294,30 @@ void LoadImage(const OUString& rPreviewFile, std::shared_ptr<AdditionsItem> pCur
     // for VCL to be able to create bitmaps / do visual changes in the thread
     aFilter.ImportGraphic(aGraphic, aURLObj);
     BitmapEx aBmp = aGraphic.GetBitmapEx();
+    Size aBmpSize = aBmp.GetSizePixel();
+    Size aThumbSize(pCurrentItem->m_xImageScreenshot->get_size_request());
+    if (!aBmp.IsEmpty())
+    {
+        double aScale;
+        if (aBmpSize.Width() > aThumbSize.Width() - 2 * Margin)
+        {
+            aScale = static_cast<double>(aBmpSize.Width()) / (aThumbSize.Width() - 2 * Margin);
+            aBmp.Scale(Size(aBmpSize.Width() / aScale, aBmpSize.Height() / aScale));
+        }
+        else if (aBmpSize.Height() > aThumbSize.Height() - 2 * Margin)
+        {
+            aScale = static_cast<double>(aBmpSize.Height()) / (aThumbSize.Height() - 2 * Margin);
+            aBmp.Scale(Size(aBmpSize.Width() / aScale, aBmpSize.Height() / aScale));
+        };
+        aBmpSize = aBmp.GetSizePixel();
+    }
 
     ScopedVclPtr<VirtualDevice> xVirDev = pCurrentItem->m_xImageScreenshot->create_virtual_device();
-    xVirDev->SetOutputSizePixel(aBmp.GetSizePixel());
-    xVirDev->DrawBitmapEx(Point(0, 0), aBmp);
-
+    xVirDev->SetOutputSizePixel(aThumbSize);
+    //white background since images come with a white border
+    xVirDev->SetBackground(Wallpaper(COL_WHITE));
+    xVirDev->Erase();
+    xVirDev->DrawBitmapEx(Point(aThumbSize.Width() / 2 - aBmpSize.Width() / 2, Margin), aBmp);
     pCurrentItem->m_xImageScreenshot->set_image(xVirDev.get());
     xVirDev.disposeAndClear();
 }
@@ -606,12 +627,13 @@ AdditionsItem::AdditionsItem(weld::Widget* pParent, AdditionsDialog* pParentDial
     , m_xContainer(m_xBuilder->weld_widget("additionsEntry"))
     , m_xImageScreenshot(m_xBuilder->weld_image("imageScreenshot"))
     , m_xButtonInstall(m_xBuilder->weld_button("buttonInstall"))
-    , m_xLinkButtonName(m_xBuilder->weld_link_button("linkButtonName"))
+    , m_xLinkButtonWebsite(m_xBuilder->weld_link_button("btnWebsite"))
+    , m_xLabelName(m_xBuilder->weld_label("lbName"))
     , m_xLabelAuthor(m_xBuilder->weld_label("labelAuthor"))
     , m_xLabelDesc(m_xBuilder->weld_label("labelDesc")) // no change (print description)
     , m_xLabelDescription(m_xBuilder->weld_label("labelDescription"))
-    , m_xLabelLicense(m_xBuilder->weld_label("labelLicense"))
-    , m_xLabelVersion(m_xBuilder->weld_label("labelVersion"))
+    , m_xLabelLicense(m_xBuilder->weld_label("lbLicenseText"))
+    , m_xLabelVersion(m_xBuilder->weld_label("lbVersionText"))
     , m_xLabelComments(m_xBuilder->weld_label("labelComments")) // no change
     , m_xLinkButtonComments(m_xBuilder->weld_link_button("linkButtonComments"))
     , m_xImageVoting1(m_xBuilder->weld_image("imageVoting1"))
@@ -647,43 +669,37 @@ AdditionsItem::AdditionsItem(weld::Widget* pParent, AdditionsDialog* pParentDial
         sExtensionName = additionInfo.sName;
     }
 
-    m_xLinkButtonName->set_label(sExtensionName);
+    m_xLabelName->set_label(sExtensionName);
 
     double aExtensionRating = additionInfo.sRating.toDouble();
     switch (int(aExtensionRating))
     {
         case 5:
-            m_xImageVoting5->show();
+            m_xImageVoting5->set_from_icon_name("cmd/sc_stars-full.png");
             [[fallthrough]];
         case 4:
-            m_xImageVoting4->show();
+            m_xImageVoting4->set_from_icon_name("cmd/sc_stars-full.png");
             [[fallthrough]];
         case 3:
-            m_xImageVoting3->show();
+            m_xImageVoting3->set_from_icon_name("cmd/sc_stars-full.png");
             [[fallthrough]];
         case 2:
-            m_xImageVoting2->show();
+            m_xImageVoting2->set_from_icon_name("cmd/sc_stars-full.png");
             [[fallthrough]];
         case 1:
-            m_xImageVoting1->show();
-            break;
-        case 0:
-            m_xLabelNoVoting->show();
+            m_xImageVoting1->set_from_icon_name("cmd/sc_stars-full.png");
             break;
     }
 
-    m_xLinkButtonName->set_uri(additionInfo.sExtensionURL);
+    m_xLinkButtonWebsite->set_uri(additionInfo.sExtensionURL);
     m_xLabelDescription->set_label(additionInfo.sIntroduction);
 
     if (!additionInfo.sAuthorName.equalsIgnoreAsciiCase("null"))
         m_xLabelAuthor->set_label(additionInfo.sAuthorName);
 
     m_xButtonInstall->set_label(CuiResId(RID_SVXSTR_ADDITIONS_INSTALLBUTTON));
-    OUString sLicenseString = CuiResId(RID_SVXSTR_ADDITIONS_LICENCE) + additionInfo.sLicense;
-    m_xLabelLicense->set_label(sLicenseString);
-    OUString sVersionString
-        = CuiResId(RID_SVXSTR_ADDITIONS_REQUIREDVERSION) + additionInfo.sCompatibleVersion;
-    m_xLabelVersion->set_label(sVersionString);
+    m_xLabelLicense->set_label(additionInfo.sLicense);
+    m_xLabelVersion->set_label(">=" + additionInfo.sCompatibleVersion);
     m_xLinkButtonComments->set_label(additionInfo.sCommentNumber);
     m_xLinkButtonComments->set_uri(additionInfo.sCommentURL);
     m_xLabelDownloadNumber->set_label(additionInfo.sDownloadNumber);
diff --git a/cui/source/inc/AdditionsDialog.hxx b/cui/source/inc/AdditionsDialog.hxx
index 9596ed16955a..9b7ced9c75f4 100644
--- a/cui/source/inc/AdditionsDialog.hxx
+++ b/cui/source/inc/AdditionsDialog.hxx
@@ -124,7 +124,8 @@ public:
     std::unique_ptr<weld::Widget> m_xContainer;
     std::unique_ptr<weld::Image> m_xImageScreenshot;
     std::unique_ptr<weld::Button> m_xButtonInstall;
-    std::unique_ptr<weld::LinkButton> m_xLinkButtonName;
+    std::unique_ptr<weld::LinkButton> m_xLinkButtonWebsite;
+    std::unique_ptr<weld::Label> m_xLabelName;
     std::unique_ptr<weld::Label> m_xLabelAuthor;
     std::unique_ptr<weld::Label> m_xLabelDesc;
     std::unique_ptr<weld::Label> m_xLabelDescription;
diff --git a/cui/uiconfig/ui/additionsdialog.ui b/cui/uiconfig/ui/additionsdialog.ui
index 507410467960..d9a4a46632bc 100644
--- a/cui/uiconfig/ui/additionsdialog.ui
+++ b/cui/uiconfig/ui/additionsdialog.ui
@@ -1,12 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<!-- Generated with glade 3.22.1 -->
+<!-- Generated with glade 3.36.0 -->
 <interface domain="cui">
   <requires lib="gtk+" version="3.18"/>
-  <object class="GtkImage" id="imageGear">
-    <property name="visible">True</property>
-    <property name="can_focus">False</property>
-    <property name="icon_name">cmd/sc_menubar.png</property>
-  </object>
   <object class="GtkMenu" id="additionsmenu">
     <property name="visible">True</property>
     <property name="can_focus">False</property>
@@ -90,6 +85,11 @@
       </object>
     </child>
   </object>
+  <object class="GtkImage" id="imageGear">
+    <property name="visible">True</property>
+    <property name="can_focus">False</property>
+    <property name="icon_name">cmd/sc_menubar.png</property>
+  </object>
   <object class="GtkDialog" id="AdditionsDialog">
     <property name="width_request">550</property>
     <property name="height_request">600</property>
@@ -100,9 +100,6 @@
     <property name="default_width">300</property>
     <property name="default_height">400</property>
     <property name="type_hint">dialog</property>
-    <child>
-      <placeholder/>
-    </child>
     <child internal-child="vbox">
       <object class="GtkBox">
         <property name="can_focus">False</property>
@@ -111,8 +108,7 @@
         <child internal-child="action_area">
           <object class="GtkButtonBox">
             <property name="can_focus">False</property>
-            <property name="halign">end</property>
-            <property name="layout_style">start</property>
+            <property name="layout_style">end</property>
             <child>
               <object class="GtkBox">
                 <property name="width_request">200</property>
@@ -163,8 +159,8 @@
           </object>
           <packing>
             <property name="expand">False</property>
-            <property name="fill">True</property>
-            <property name="position">0</property>
+            <property name="fill">False</property>
+            <property name="position">1</property>
           </packing>
         </child>
         <child>
@@ -243,11 +239,15 @@
                         <property name="visible">True</property>
                         <property name="can_focus">False</property>
                         <property name="valign">start</property>
+                        <property name="hexpand">True</property>
                         <property name="row_spacing">6</property>
                         <property name="column_spacing">12</property>
                         <child>
                           <placeholder/>
                         </child>
+                        <child>
+                          <placeholder/>
+                        </child>
                       </object>
                     </child>
                   </object>
@@ -263,7 +263,7 @@
           <packing>
             <property name="expand">True</property>
             <property name="fill">True</property>
-            <property name="position">1</property>
+            <property name="position">0</property>
           </packing>
         </child>
       </object>
@@ -271,5 +271,8 @@
     <action-widgets>
       <action-widget response="-7">buttonClose</action-widget>
     </action-widgets>
+    <child type="titlebar">
+      <placeholder/>
+    </child>
   </object>
 </interface>
diff --git a/cui/uiconfig/ui/additionsfragment.ui b/cui/uiconfig/ui/additionsfragment.ui
index b0a5d480fb44..6282c2bfe344 100644
--- a/cui/uiconfig/ui/additionsfragment.ui
+++ b/cui/uiconfig/ui/additionsfragment.ui
@@ -1,18 +1,21 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<!-- Generated with glade 3.22.1 -->
+<!-- Generated with glade 3.38.1 -->
 <interface domain="cui">
   <requires lib="gtk+" version="3.18"/>
+  <!-- n-columns=2 n-rows=2 -->
   <object class="GtkGrid" id="additionsEntry">
     <property name="visible">True</property>
-    <property name="can_focus">False</property>
-    <property name="border_width">6</property>
-    <property name="row_spacing">24</property>
-    <property name="column_spacing">12</property>
+    <property name="can-focus">False</property>
+    <property name="valign">start</property>
+    <property name="hexpand">True</property>
+    <property name="border-width">6</property>
+    <property name="row-spacing">24</property>
+    <property name="column-spacing">12</property>
     <child>
       <object class="GtkButton" id="buttonShowMore">
         <property name="label" translatable="yes" context="additionsDialog|buttonShowMore">Show More Extensions</property>
-        <property name="can_focus">True</property>
-        <property name="receives_default">True</property>
+        <property name="can-focus">True</property>
+        <property name="receives-default">True</property>
         <child internal-child="accessible">
           <object class="AtkObject" id="buttonShowMore-atkobject">
             <property name="AtkObject::accessible-name" translatable="yes" context="additionsDialog|buttonShowMore">ButtonShowMore</property>
@@ -21,43 +24,183 @@
         </child>
       </object>
       <packing>
-        <property name="left_attach">0</property>
-        <property name="top_attach">1</property>
+        <property name="left-attach">0</property>
+        <property name="top-attach">1</property>
+        <property name="width">2</property>
       </packing>
     </child>
     <child>
+      <!-- n-columns=3 n-rows=8 -->
       <object class="GtkGrid">
         <property name="visible">True</property>
-        <property name="can_focus">False</property>
-        <property name="row_spacing">3</property>
-        <property name="column_spacing">12</property>
-        <property name="column_homogeneous">True</property>
+        <property name="can-focus">False</property>
+        <property name="valign">start</property>
+        <property name="hexpand">True</property>
+        <property name="column-spacing">12</property>
         <child>
-          <object class="GtkLinkButton" id="linkButtonName">
+          <object class="GtkLabel" id="labelDescription">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="valign">start</property>
+            <property name="margin-bottom">3</property>
+            <property name="label">description</property>
+            <property name="wrap">True</property>
+            <property name="wrap-mode">word-char</property>
+            <property name="width-chars">40</property>
+            <property name="max-width-chars">40</property>
+            <property name="xalign">0</property>
+            <accessibility>
+              <relation type="label-for" target="imageScreenshot"/>
+            </accessibility>
+          </object>
+          <packing>
+            <property name="left-attach">1</property>
+            <property name="top-attach">1</property>
+            <property name="width">2</property>
+          </packing>
+        </child>
+        <child>
+          <object class="GtkLabel" id="votingLabel">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="label" translatable="yes" context="additionsEntry|votingLabel">Voting:</property>
+            <property name="xalign">0</property>
+            <accessibility>
+              <relation type="label-for" target="imageVoting1"/>
+              <relation type="label-for" target="imageVoting2"/>
+              <relation type="label-for" target="imageVoting3"/>
+              <relation type="label-for" target="imageVoting4"/>
+              <relation type="label-for" target="imageVoting5"/>
+            </accessibility>
+          </object>
+          <packing>
+            <property name="left-attach">1</property>
+            <property name="top-attach">2</property>
+          </packing>
+        </child>
+        <child>
+          <object class="GtkLabel" id="labelLicense">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="label" translatable="yes" context="additionsEntry|labelLicense">License:</property>
+            <property name="xalign">0</property>
+          </object>
+          <packing>
+            <property name="left-attach">1</property>
+            <property name="top-attach">3</property>
+          </packing>
+        </child>
+        <child>
+          <object class="GtkLabel" id="labelVersion">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="label" translatable="yes" context="additionsEntry|labelVersion">Required version:</property>
+            <property name="xalign">0</property>
+          </object>
+          <packing>
+            <property name="left-attach">1</property>
+            <property name="top-attach">4</property>
+          </packing>
+        </child>
+        <child>
+          <object class="GtkLabel" id="labelComments">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="label" translatable="yes" context="additionsEntry|labelComments">Comments:</property>
+            <property name="xalign">0</property>
+          </object>
+          <packing>
+            <property name="left-attach">1</property>
+            <property name="top-attach">5</property>
+          </packing>
+        </child>
+        <child>
+          <object class="GtkLabel" id="labelComments1">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="label" translatable="yes" context="additionsEntry|labelComments">Downloads:</property>
+            <property name="xalign">0</property>
+          </object>
+          <packing>
+            <property name="left-attach">1</property>
+            <property name="top-attach">6</property>
+          </packing>
+        </child>
+        <child>
+          <object class="GtkLabel" id="labelDownloadNumber">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="label">label</property>
+            <property name="xalign">0</property>
+          </object>
+          <packing>
+            <property name="left-attach">2</property>
+            <property name="top-attach">6</property>
+          </packing>
+        </child>
+        <child>
+          <object class="GtkLinkButton" id="linkButtonComments">
             <property name="label">button</property>
             <property name="visible">True</property>
-            <property name="can_focus">True</property>
-            <property name="receives_default">True</property>
+            <property name="can-focus">True</property>
+            <property name="receives-default">True</property>
             <property name="halign">start</property>
             <property name="relief">none</property>
+            <property name="xalign">0</property>
             <property name="uri">http://glade.gnome.org</property>
           </object>
           <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">0</property>
+            <property name="left-attach">2</property>
+            <property name="top-attach">5</property>
+          </packing>
+        </child>
+        <child>
+          <object class="GtkLabel" id="lbVersionText">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="label">label</property>
+            <property name="xalign">0</property>
+          </object>
+          <packing>
+            <property name="left-attach">2</property>
+            <property name="top-attach">4</property>
+          </packing>
+        </child>
+        <child>
+          <object class="GtkLabel" id="lbLicenseText">
+            <property name="visible">True</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="label">label</property>
+            <property name="xalign">0</property>
+          </object>
+          <packing>
+            <property name="left-attach">2</property>
+            <property name="top-attach">3</property>
           </packing>
         </child>
         <child>
           <object class="GtkBox">
             <property name="visible">True</property>
-            <property name="can_focus">False</property>
-            <property name="halign">end</property>
+            <property name="can-focus">False</property>
+            <property name="halign">start</property>
+            <property name="valign">center</property>
             <property name="hexpand">True</property>
             <child>
               <object class="GtkImage" id="imageVoting1">
-                <property name="can_focus">False</property>
+                <property name="visible">True</property>
+                <property name="can-focus">False</property>
                 <property name="halign">start</property>
-                <property name="icon_name">cmd/sc_starshapes.png</property>
+                <property name="valign">center</property>
+                <property name="icon-name">cmd/sc_stars-empty.png</property>
                 <accessibility>
                   <relation type="labelled-by" target="votingLabel"/>
                 </accessibility>
@@ -70,9 +213,11 @@
             </child>
             <child>
               <object class="GtkImage" id="imageVoting2">
-                <property name="can_focus">False</property>
+                <property name="visible">True</property>
+                <property name="can-focus">False</property>
                 <property name="halign">start</property>
-                <property name="icon_name">cmd/sc_starshapes.png</property>
+                <property name="valign">center</property>
+                <property name="icon-name">cmd/sc_stars-empty.png</property>
                 <accessibility>
                   <relation type="labelled-by" target="votingLabel"/>
                 </accessibility>
@@ -84,10 +229,12 @@
               </packing>
             </child>
             <child>
-              <object class="GtkImage" id="imageVoting4">
-                <property name="can_focus">False</property>
+              <object class="GtkImage" id="imageVoting3">
+                <property name="visible">True</property>
+                <property name="can-focus">False</property>
                 <property name="halign">start</property>
-                <property name="icon_name">cmd/sc_starshapes.png</property>
+                <property name="valign">center</property>
+                <property name="icon-name">cmd/sc_stars-empty.png</property>
                 <accessibility>
                   <relation type="labelled-by" target="votingLabel"/>
                 </accessibility>
@@ -99,10 +246,12 @@
               </packing>
             </child>
             <child>
-              <object class="GtkImage" id="imageVoting3">
-                <property name="can_focus">False</property>
+              <object class="GtkImage" id="imageVoting4">
+                <property name="visible">True</property>
+                <property name="can-focus">False</property>
                 <property name="halign">start</property>
-                <property name="icon_name">cmd/sc_starshapes.png</property>
+                <property name="valign">center</property>
+                <property name="icon-name">cmd/sc_stars-empty.png</property>
                 <accessibility>
                   <relation type="labelled-by" target="votingLabel"/>
                 </accessibility>
@@ -115,9 +264,11 @@
             </child>
             <child>
               <object class="GtkImage" id="imageVoting5">
-                <property name="can_focus">False</property>
+                <property name="visible">True</property>
+                <property name="can-focus">False</property>
                 <property name="halign">start</property>
-                <property name="icon_name">cmd/sc_starshapes.png</property>
+                <property name="valign">center</property>
+                <property name="icon-name">cmd/sc_stars-empty.png</property>
                 <accessibility>
                   <relation type="labelled-by" target="votingLabel"/>
                 </accessibility>
@@ -128,116 +279,50 @@
                 <property name="position">4</property>
               </packing>
             </child>
-            <child>
-              <object class="GtkLabel" id="votingLabel">
-                <property name="can_focus">False</property>
-                <property name="label" translatable="yes" context="additionsEntry|votingLabel">Vote</property>
-                <accessibility>
-                  <relation type="label-for" target="imageVoting1"/>
-                  <relation type="label-for" target="imageVoting2"/>
-                  <relation type="label-for" target="imageVoting4"/>
-                  <relation type="label-for" target="imageVoting3"/>
-                  <relation type="label-for" target="imageVoting5"/>
-                </accessibility>
-              </object>
-              <packing>
-                <property name="expand">True</property>
-                <property name="fill">True</property>
-                <property name="position">5</property>
-              </packing>
-            </child>
           </object>
           <packing>
-            <property name="left_attach">1</property>
-            <property name="top_attach">0</property>
+            <property name="left-attach">2</property>
+            <property name="top-attach">2</property>
           </packing>
         </child>
         <child>
           <object class="GtkImage" id="imageScreenshot">
+            <property name="width-request">180</property>
+            <property name="height-request">120</property>
             <property name="visible">True</property>
-            <property name="can_focus">False</property>
+            <property name="can-focus">False</property>
             <property name="halign">center</property>
-            <property name="hexpand">True</property>
-                <accessibility>
-                  <relation type="labelled-by" target="labelDescription"/>
-                </accessibility>
-          </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">1</property>
-            <property name="width">2</property>
-          </packing>
-        </child>
-        <child>
-          <object class="GtkLabel" id="labelDescription">
-            <property name="visible">True</property>
-            <property name="can_focus">False</property>
-            <property name="halign">start</property>
             <property name="valign">start</property>
-            <property name="label">description</property>
-            <property name="wrap">True</property>
-            <property name="wrap_mode">word-char</property>
-            <property name="width_chars">1</property>
-            <property name="max_width_chars">50</property>
-                <accessibility>
-                  <relation type="label-for" target="imageScreenshot"/>
-                </accessibility>
-          </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">2</property>
-            <property name="width">2</property>
-          </packing>
-        </child>
-        <child>
-          <object class="GtkLabel" id="labelLicense">
-            <property name="visible">True</property>
-            <property name="can_focus">False</property>
-            <property name="halign">start</property>
-            <property name="label">label </property>
-          </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">3</property>
-          </packing>
-        </child>
-        <child>
-          <object class="GtkLabel" id="labelVersion">
-            <property name="visible">True</property>
-            <property name="can_focus">False</property>
-            <property name="halign">start</property>
-            <property name="label">label </property>
-          </object>
-          <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">4</property>
-          </packing>
-        </child>
-        <child>
-          <object class="GtkButton" id="buttonInstall">
-            <property name="label" translatable="yes" context="additionsEntry|buttonInstall">button</property>
-            <property name="visible">True</property>
-            <property name="can_focus">True</property>
-            <property name="receives_default">True</property>
-            <property name="valign">end</property>
+            <property name="margin-start">6</property>
+            <property name="margin-end">6</property>
+            <property name="margin-top">12</property>
+            <property name="margin-bottom">12</property>
+            <property name="hexpand">True</property>
+            <property name="vexpand">True</property>
+            <property name="xalign">0</property>
+            <accessibility>
+              <relation type="labelled-by" target="labelDescription"/>
+            </accessibility>
           </object>
           <packing>
-            <property name="left_attach">0</property>
-            <property name="top_attach">5</property>
-            <property name="width">2</property>
+            <property name="left-attach">0</property>
+            <property name="top-attach">1</property>
+            <property name="height">6</property>
           </packing>
         </child>
         <child>
           <object class="GtkBox">
             <property name="visible">True</property>
-            <property name="can_focus">False</property>
-            <property name="halign">start</property>
-            <property name="spacing">3</property>
+            <property name="can-focus">False</property>
+            <property name="margin-top">6</property>
+            <property name="homogeneous">True</property>
             <child>
-              <object class="GtkLabel" id="labelComments1">
+              <object class="GtkButton" id="buttonInstall">
+                <property name="label" translatable="yes" context="additionsEntry|buttonInstall">Install</property>
                 <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="label" translatable="yes" context="additionsEntry|labelComments">Downloads:</property>
+                <property name="can-focus">True</property>
+                <property name="receives-default">True</property>
+                <property name="valign">end</property>
               </object>
               <packing>
                 <property name="expand">False</property>
@@ -246,11 +331,13 @@
               </packing>
             </child>
             <child>
-              <object class="GtkLabel" id="labelDownloadNumber">
+              <object class="GtkLinkButton" id="btnWebsite">
+                <property name="label" translatable="yes" context="additionsEntry|buttonWebsite">Website</property>
                 <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="halign">start</property>
-                <property name="label">label</property>
+                <property name="can-focus">True</property>
+                <property name="receives-default">True</property>
+                <property name="relief">none</property>
+                <property name="uri">http://glade.gnome.org</property>
               </object>
               <packing>
                 <property name="expand">False</property>
@@ -260,52 +347,39 @@
             </child>
           </object>
           <packing>
-            <property name="left_attach">1</property>
-            <property name="top_attach">4</property>
+            <property name="left-attach">1</property>
+            <property name="top-attach">7</property>
+            <property name="width">2</property>
           </packing>
         </child>
         <child>
-          <object class="GtkBox">
+          <object class="GtkLabel" id="lbName">
             <property name="visible">True</property>
-            <property name="can_focus">False</property>
-            <property name="spacing">6</property>
-            <child>
-              <object class="GtkLabel" id="labelComments">
-                <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="label" translatable="yes" context="additionsEntry|labelComments">Comments:</property>
-              </object>
-              <packing>
-                <property name="expand">False</property>
-                <property name="fill">True</property>
-                <property name="position">0</property>
-              </packing>
-            </child>
-            <child>
-              <object class="GtkLinkButton" id="linkButtonComments">
-                <property name="label">button</property>
-                <property name="visible">True</property>
-                <property name="can_focus">True</property>
-                <property name="receives_default">True</property>
-                <property name="relief">none</property>
-                <property name="uri">http://glade.gnome.org</property>
-              </object>
-              <packing>
-                <property name="expand">False</property>
-                <property name="fill">True</property>
-                <property name="position">1</property>
-              </packing>
-            </child>
+            <property name="can-focus">False</property>
+            <property name="margin-bottom">6</property>
+            <property name="label">Name</property>
+            <property name="xalign">0</property>
+            <attributes>
+              <attribute name="weight" value="bold"/>
+            </attributes>
           </object>
           <packing>
-            <property name="left_attach">1</property>
-            <property name="top_attach">3</property>
+            <property name="left-attach">1</property>
+            <property name="top-attach">0</property>
+            <property name="width">2</property>
           </packing>
         </child>
+        <child>
+          <placeholder/>
+        </child>
+        <child>
+          <placeholder/>
+        </child>
       </object>
       <packing>
-        <property name="left_attach">0</property>
-        <property name="top_attach">0</property>
+        <property name="left-attach">0</property>
+        <property name="top-attach">0</property>
+        <property name="width">2</property>
       </packing>
     </child>
   </object>