DevTools: Front-end for platform font inspection

Source/devtools/front_end/elementsPanel.css

 /*
  * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
@@ skipping 523 matching lines @@
 
 .image-preview-container img {
     margin: 2px auto;
     max-width: 100px;
     max-height: 100px;
     background-image: url(Images/checker.png);
     -webkit-user-select: text;
     -webkit-user-drag: auto;
 }
 
-
 .sidebar-pane.composite {
     overflow: hidden;
     position: absolute;
 }
 
 .sidebar-pane.composite > .body {
     height: 100%;
 }
 
 .sidebar-pane.composite .metrics {
     border-bottom: 1px solid rgb(64%, 64%, 64%);
     height: 206px;
     display: -webkit-flex;
     -webkit-flex-direction: column;
     -webkit-align-items: center;
     -webkit-justify-content: center;
 }
 
+.sidebar-pane.composite .computed-style {
+    border-bottom: 1px solid rgb(64%, 64%, 64%);
+}
+
 .sidebar-pane.composite .metrics-and-computed .sidebar-pane-toolbar {
     margin-top: 4px;
     margin-bottom: -4px;
     position: relative;
 }
 
+.sidebar-pane.composite .platform-fonts {
+    padding: 1ex;
+    -webkit-user-select: text;
+}
+
+.sidebar-pane.composite .platform-fonts .stats-section {
+    margin-bottom: 5px;
+}
+
+.sidebar-pane.composite .platform-fonts .css-font-value {
+    margin-left: 1ex;
+}
+
+.sidebar-pane.composite .platform-fonts .font-stats-item {
+    padding-left: 1em;
+}
+
+.sidebar-pane.composite .platform-fonts .font-stats-item .delimeter {
+    margin: 0 1ex 0 1ex;
+}
+
 .sidebar-pane.composite .sidebar-pane-toolbar > .sidebar-pane-subtitle {
     left: 8px;
 }
 
 .sidebar-pane.composite .styles-section.read-only {
     background-color: inherit;
 }
 
 .panel.elements .sidebar-pane-toolbar > select {
     float: right;
@@ skipping 28 matching lines @@
 .panel.elements .sidebar-pane-toolbar > select > hr {
     color: black;
 }
 
 .styles-section:not(.read-only) .properties .webkit-css-property.styles-panel-hovered,
 .styles-section:not(.read-only) .properties .value .styles-panel-hovered,
 .styles-section:not(.read-only) .properties .value.styles-panel-hovered {
     text-decoration: underline;
     cursor: default;
 }