SMB: Add share dialog new styles

Change SMB add share dialog to comply with the new styles for Files app.

Remove close button/icon from the dialog.

Adjust the padding and spacing in the dialog, which changed the total
height for the dialog from 564px to 515px.

See crbug.com/992827#c38 for screenshots of before and after.

Bug: 992827
Change-Id: Ia19c97c784b67bcca68ae2e042f02cdd689c1525
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2235146
Commit-Queue: Luciano Pacheco <lucmult@chromium.org>
Auto-Submit: Luciano Pacheco <lucmult@chromium.org>
Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Cr-Commit-Position: refs/heads/master@{#776816}

chrome/browser/ui/webui/chromeos/smb_shares/smb_share_dialog.cc

@@ -21,7 +21,7 @@ namespace chromeos {
 namespace smb_dialog {
 namespace {
 
-constexpr int kSmbShareDialogHeight = 564;
+constexpr int kSmbShareDialogHeight = 515;
 
 void AddSmbSharesStrings(content::WebUIDataSource* html_source) {
   // Add strings specific to smb_dialog.
@@ -96,5 +96,9 @@ SmbShareDialogUI::SmbShareDialogUI(content::WebUI* web_ui)
 
 SmbShareDialogUI::~SmbShareDialogUI() = default;
 
+bool SmbShareDialog::ShouldShowCloseButton() const {
+  return false;
+}
+
 }  // namespace smb_dialog
 }  // namespace chromeos

chrome/browser/ui/webui/chromeos/smb_shares/smb_share_dialog.h

@@ -23,6 +23,7 @@ class SmbShareDialog : public SystemWebDialogDelegate {
 
   // ui::WebDialogDelegate
   void GetDialogSize(gfx::Size* size) const override;
+  bool ShouldShowCloseButton() const override;
 
   DISALLOW_COPY_AND_ASSIGN(SmbShareDialog);
 };

ui/webui/resources/cr_components/chromeos/smb_shares/add_smb_share_dialog.html

@@ -18,8 +18,22 @@
 <dom-module id="add-smb-share-dialog">
   <template>
     <style include="cr-shared-style md-select">
+      cr-dialog::part(wrapper) {
+        /* Subtract the internal padding in <cr-dialog>. */
+        padding: calc(24px - 20px);
+      }
+
+      [slot='title']  {
+        padding-top: 4px;
+      }
+
+      [slot='button-container']  {
+        padding-bottom: 20px;
+        padding-top: 32px;
+      }
+
       #dialog [slot=body] {
-        height: 440px;
+        height: 390px;
       }
 
       .md-select {