LCARStrek/browser/newtab/newTab.css

   1 :root {
   2   -moz-appearance: none;
   3   background-color: transparent;
   4   padding: 0;
   5 }
   6
   7 /* SCROLLBOX */
   8 #newtab-scrollbox:not([page-disabled]) {
   9   background-color: #000000;
  10 }
  11
  12 /* TOGGLE */
  13 #newtab-toggle {
  14   width: 16px;
  15   height: 16px;
  16   padding: 0;
  17   border: none;
  18   background: -216px 0 transparent url("chrome://browser/skin/newtab/controls.png");
  19 }
  20
  21 #newtab-toggle[page-disabled] {
  22   background-position: -232px 0;
  23 }
  24
  25 /* ROWS */
  26 .newtab-row {
  27   margin-bottom: 20px;
  28 }
  29
  30 .newtab-row:last-child {
  31   margin-bottom: 0;
  32 }
  33
  34 /* CELLS */
  35 .newtab-cell {
  36   -moz-margin-end: 20px;
  37   background-color: rgba(255,159,0,.2);
  38   border: 1px solid;
  39   border-color: #9C9CFF;
  40   border-radius: 1px;
  41   transition: border-color 100ms ease-out;
  42 }
  43
  44 .newtab-cell:empty {
  45   border: 1px dashed;
  46 }
  47
  48 .newtab-cell:last-child {
  49   -moz-margin-end: 0;
  50 }
  51
  52 .newtab-cell:hover:not(:empty):not([dragged]) {
  53   border-color: #FFCF00;
  54 }
  55
  56 /* SITES */
  57 .newtab-site {
  58   text-decoration: none;
  59   transition-property: top, left, opacity, box-shadow, background-color;
  60 }
  61
  62 .newtab-site:hover,
  63 .newtab-site[dragged] {
  64   box-shadow: 0 0 10px rgba(0,132,132,.3);
  65 }
  66
  67 .newtab-site[dragged] {
  68   transition-property: box-shadow, background-color;
  69   background-color: #002121;
  70 }
  71
  72 /* THUMBNAILS */
  73 .newtab-thumbnail {
  74   background-origin: padding-box;
  75   background-clip: padding-box;
  76   background-repeat: no-repeat;
  77   background-size: cover;
  78 }
  79
  80 /* TITLES */
  81 .newtab-title {
  82   padding: 0 8px;
  83   background-color: rgba(255,159,0,.8);
  84   color: #000000;
  85   font-size: 12px;
  86   line-height: 24px;
  87 }
  88
  89 /* CONTROLS */
  90 .newtab-control {
  91   width: 24px;
  92   height: 24px;
  93   padding: 1px 2px 3px;
  94   border: none;
  95   background: transparent url("chrome://browser/skin/newtab/controls.png");
  96 }
  97
  98 .newtab-control-pin:hover {
  99   background-position: -24px 0;
 100 }
 101
 102 .newtab-control-pin:active {
 103   background-position: -48px 0;
 104 }
 105
 106 .newtab-control-pin[pinned] {
 107   background-position: -72px 0;
 108 }
 109
 110 .newtab-control-pin[pinned]:hover {
 111   background-position: -96px 0;
 112 }
 113
 114 .newtab-control-pin[pinned]:active {
 115   background-position: -120px 0;
 116 }
 117
 118 .newtab-control-block {
 119   background-position: -144px 0;
 120 }
 121
 122 .newtab-control-block:hover {
 123   background-position: -168px 0;
 124 }
 125
 126 .newtab-control-block:active {
 127   background-position: -192px 0;
 128 }