History: Use images instead of unicode characters.

chrome/browser/resources/history/history.css

 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
  * Use of this source code is governed by a BSD-style license that can be
  * found in the LICENSE file. */
 
 body:not(.uber-frame) {
   color: rgb(48, 57, 66);
   margin: 0 8px 0 8px;
 }
 
 html[dir=rtl] body.uber-frame > .page {
@@ skipping 38 matching lines @@
 #filter-controls select {
   -webkit-margin-end: 0;
 }
 
 html[dir=rtl] #range-today,
 html[dir=rtl] #range-previous,
 html[dir=rtl] #range-next {
   float: left;
 }
 
+#range-next:disabled img,
+#range-previous:disabled img {
+  opacity: 0.4;
+}
+
 #display-filter-controls {
   float: right;
 }
 
 #display-filter-controls label {
   -webkit-margin-start: 6px;
 }
 
 #display-filter-controls label:not(:last-child) {
   -webkit-border-end: 1px solid rgb(151, 156, 160);
@@ skipping 121 matching lines @@
    * 'embed' makes the engine set the text in the parentheses as LTR even
    * when the layout is set to RTL, which makes using -webkit-*-start
    * impossible. So use margins and dir='rtl'.
    */
   direction: rtl;
   unicode-bidi: embed;
 }
 
 .number-visits {
   color: rgb(151, 156, 160);
-  margin-left: 0.3em;
 }
 
 .drop-down {
   -webkit-margin-end: 5px;
   background: white -webkit-canvas(drop-down-arrow) no-repeat center 4px;
   border: 1px solid rgb(192, 195, 198);
   border-radius: 2px;
   height: 12px;
   padding: 0;
   position: relative;
@@ skipping 48 matching lines @@
 .entry-box:hover input[type=checkbox],
 .entry-box input[type=checkbox]:focus {
   opacity: 1;
 }
 
 .entry-box input[type=checkbox]:focus {
   -webkit-transition: opacity 150ms;
 }
 </if>
 
+#range-previous img {
+  -webkit-transform: rotate(180deg);

[Patrick Dubroy, 2013/02/18 10:19:36]

BTW you can also do scaleX(-1) to mirror it. That might be better since it
avoids problems with the centering of the image.

[Sergiu, 2013/02/19 08:58:25]

Done.

+}
+
 .entry-box {
   background-color: none;
 }
 
 .entry-box:hover,
 .entry-box.contains-focus {
   background-color: rgb(252, 252, 252);
   border-radius: 2px;
 }
 
 .entry .title {
   -webkit-box-flex: 1;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
 .day-results > .entry .title,
 .search-results > .entry .title,
 .site-domain {
   /* Make room for the favicon. */
   -webkit-padding-start: 20px;
 
   /* Control the favicon appearance. */
   background-position-y: 3px;
   background-repeat: no-repeat;
   background-size: 16px;
 }
 
+.site-domain button {
+  color: rgb(48, 57, 66);
+}
+
 .site-domain-arrow {
   -webkit-transition: -webkit-transform 300ms linear;
-  color: rgb(143, 143, 143);
+  background: url('../disclosure_triangle_small.png') no-repeat;
+  background-position: 5px 5px;
+  color: #8F8F8F;

[Patrick Dubroy, 2013/02/18 10:19:36]

This should be specified in RGB.

[Sergiu, 2013/02/19 08:58:25]

Done.

   height: 21px;
   margin-right: 2px;
+  opacity: 0.58;
   text-align: center;
   width: 21px;
 }
 
 .site-domain-arrow.collapse {
   -webkit-transform: rotate(0);
 }
 
 .site-domain-arrow.expand {
   -webkit-transform: rotate(90deg);
@@ skipping 35 matching lines @@
 
 .menu-button.drop-down {
   position: relative;
   top: 2px;
 }
 
 #action-menu > :not(hr) {
   line-height: 29px;
   outline: none;
 }