Commits on Apr 21, 2017

1. Create sectionTitle.js …

   Closes #7750
   Closes #8165
   Closes #8234
   Addresses #8235
   
   TODO: Refactor modalOverlay.js to remove .sectionTitle
   
   Created TitleWrapper, SectionTitle, and SubTitle
    - SectionTitleWrapper and BetaSectionTitleWrapper
    - DefaultSectionTitle, PrefSectionTitle, and AboutPagesSectionTitle
    - AboutPagesSectionSubTitle and SectionSubTitle
   
   Refactored with those components:
    - extensionsTab.js, pluginsTab.js, preferences.js, syncTab.js, and paymentsTab.js
    - about.js, brave.js, bookmarks.js and history.js
    - torrentViewer.js, torrentStatus.js and torrentFileList.js
   
   Added siteDetailsPageContent to commonStyles.js and applied:
    - about.js, brave.js, and history.js
   
   Removed styles of sectionTitle from:
    - brave.less
    - siteDetails.less
   
   Auditors:
   
   Test Plan 1:
   1. Open about:preferences#search
   2. Make sure there is margin under the top header
   
   Test Plan 2:
   1. Open about:preferences#sync
   2. Make sure "beta" is aligned top
   3. Open about:preferences#payments
   4. Make sure the labels appear the same row
   5. Make sure the switches and the labels are aligned exactly like #7751
   
   Test Plan 3:
   1. Open about:about
   2. Make sure there is margin under the header
   3. Open about:brave, about:bookmarks, and about:history
   4. Make sure the header font size is same
   
   Test Plan 4:
   1. Open https://webtorrent.io/free-torrents/
   2. Click .torrent link
   3. Make sure the header font size is same as about:brave
   4. Start download
   5. Make sure the header font size is same
   
   Test Plan 5:
   1. Clear your profile folder
   2. Open about:preferences#sync
   3. Enable Sync
   4. Make sure there is margin under "Devices"

   Suguru Hirahara committed Apr 21, 2017
   Configuration menu

   • View commit details
   • Copy full SHA for cbf4427
   • Browse repository at this point

   Copy the full SHA

   cbf4427 View commit details

   Browse the repository at this point in the history

2. Add commonForm and sectionTitle to about:styles …

   Closes #8349
   Closes #8350
   
   Also:
   - Moved sectionTitle.js into the common folder
   - Added TOC to about:styles with internal links
   - Removed CommonFormSubSection from importBrowserDataPanel.js
   - Removed PrefSectionTitle
   - Renamed SectionSubTitle into SectionLabelTitle
   - Renamed BetaSectionTitleWrapper into SectionTitleLabelWrapper
   - Renamed SectionSubTitle into SectionLabelTitle
   - Renamed AboutPagesSectionTitle to AboutPageSectionTitle
   - Renamed AboutPagesSectionSubTitle to AboutPageSectionSubTitle
   - Copied some properties from common.less to sectionTitle.js
   
   Auditors:
   
   Test Plan 1:
   1. Open "Import Browser data" from the menu
   2. Make sure the switch is indented
   
   Test Plan 2:
   1. Open about:styles
   2. Click "commonForm" on TOC
   3. Make sure the template of the commonForm is displayed
   4. Click "Go back to top"
   5. Click "sectionTitle" on TOC
   6. Make sure section title components are displayed

   Suguru Hirahara committed Apr 21, 2017
   Configuration menu

   • View commit details
   • Copy full SHA for 9a753c0
   • Browse repository at this point

   Copy the full SHA

   9a753c0 View commit details

   Browse the repository at this point in the history

3. Fix CommonFormSubSection …

   It turns out that margin-bottom was missing from CommonFormSubSection, so I added it.
   
   Auditors:
   
   Test Plan:
   1. Open about:styles
   2. Click commonForm on TOC
   3. Make sure that there is margin between CommonFormSubSection and CommonFormDropdown

   Suguru Hirahara committed Apr 21, 2017
   Configuration menu

   • View commit details
   • Copy full SHA for 304f937
   • Browse repository at this point

   Copy the full SHA

   304f937 View commit details

   Browse the repository at this point in the history