[Sync] Split up about:sync html files to be more manageable

chrome/browser/resources/sync_internals/about.css

Index: chrome/browser/resources/sync_internals/about.css
diff --git a/chrome/browser/resources/sync_internals/about.css b/chrome/browser/resources/sync_internals/about.css
new file mode 100644
index 0000000000000000000000000000000000000000..0cd868d536bd2b13022393062a8a84e86b9c9119
--- /dev/null
+++ b/chrome/browser/resources/sync_internals/about.css
@@ -0,0 +1,105 @@
+body {
+  padding: 0.75em;
+  margin: 0;
+  min-width: 45em;
+}
+h1 {
+  font-size: 110%;
+  font-weight: bold;
+  color: #4a8ee6;
+  letter-spacing: -1px;
+  padding: 0;
+  margin: 0;
+}
+h2 {
+  font-size: 110%;
+  letter-spacing: -1px;
+  font-weight: normal;
+  color: #4a8ee6;
+  margin: 0 0 0 -38px;
+  padding: 0.5em 1em 0.5em 38px;
+  color: #3a75bd;
+  border-top: 1px solid #3a75bd;
+}
+h2:first-child {
+  border-top: 0;
+  padding-top: 0;
+}
+div#header {
+  padding: 0.6em 1em 0.75em 0;
+  margin-bottom: 0.75em;
+  position: relative;
+  overflow: hidden;
+  background: #5296de;
+  background-size: 100%;
+  border: 1px solid #3a75bd;
+  border-radius: 6px;
+  color: white;
+  text-shadow: 0 0 2px black;
+}
+div#header h1 {
+  padding-left: 37px;
+  margin: 0;
+  display: inline;
+  background: url('../../resources/shared/images/gear.png') 12px 60% no-repeat;
+  color: white;
+}
+.err {
+  color: red;
+}
+div#header p {
+  font-style: italic;
+  padding: 0;
+  margin: 0;
+  color: white;
+  padding-left: 0.4em;
+  display: inline;
+}
+table.list {
+  line-height: 200%;
+  border-collapse: collapse;
+  table-layout: fixed;
+}
+table.list:not([class*='filtered']) tr:nth-child(odd) td {
+  background: #eff3ff;
+}
+table.list#details2 tr:nth-child(odd) td {
+  background: #ccffcc
+}
+table.list td {
+  padding: 0 0.5em;
+  vertical-align: top;
+  line-height: 1.4em;
+  padding-top: 0.35em;
+}
+table.list tr td:nth-last-child(1),
+table.list tr th:nth-last-child(1) {
+  padding-right: 1em;
+}
+
+table.list:not([class*='filtered']) .tab .name {
+  padding-left: 1.5em;
+}
+table.list .name {
+}
+table.list .name div {
+  height: 1.6em;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+table.list .number {
+  width: 7em;
+  text-align: right;
+}
+table.list tr:not([class*='firstRow']) > *:nth-child(1),
+table.list tr:not([class*='firstRow']) > *:nth-child(4),
+table.list tr.firstRow th:nth-child(1),
+table.list tr.firstRow th:nth-child(2) {
+  border-right: 1px solid #b5c6de;
+}
+table.list#details .name {
+  padding-left: 25px;
+  background-position: 5px center;
+  background-repeat: no-repeat;
+}