src/chrome/browser/resources/options/cookies_view.css

   1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
   2  * Use of this source code is governed by a BSD-style license that can be
   3  * found in the LICENSE file. */
   4
   5 /* Styles for the cookies list page. */
   6 .cookies-view-page {
   7   height: 90%;
   8   margin-left: -15px;
   9   width: 720px;
  10 }
  11
  12 /* Styles for the cookies list elements in cookies_view.html. */
  13 .cookies-list {
  14   -webkit-box-flex: 1;
  15   /* This property overrides the |min-height: 192px;| property above due to
  16    * special behavior of the cookies list. */
  17   border: 1px solid #D9D9D9;
  18   margin: 0;
  19   margin-top: 5px;
  20   min-height: 0;
  21 }
  22
  23 .cookies-list-content-area {
  24   -webkit-box-orient: vertical;
  25   display: -webkit-box;
  26   overflow-y: hidden;
  27 }
  28
  29 .cookies-column-headers {
  30   -webkit-box-align: baseline;
  31   -webkit-box-orient: horizontal;
  32   display: -webkit-box;
  33   position: relative;
  34   width: 100%;
  35 }
  36
  37 .cookies-column-headers > * {
  38   display: block;
  39 }
  40
  41 .cookies-column-headers h3 {
  42   font-size: 105%;
  43   font-weight: bold;
  44   margin: 10px 0;
  45 }
  46
  47 /* Notice the width and padding for these columns match up with those below. */
  48 .cookies-site-column {
  49   -webkit-padding-start: 7px;
  50   width: 14em;
  51 }
  52
  53 .cookies-data-column {
  54   -webkit-box-flex: 1;
  55   -webkit-padding-start: 7px;
  56 }
  57
  58 /* Enable animating the height of items. */
  59 list.cookie-list .deletable-item {
  60   -webkit-transition: height 150ms ease-in-out;
  61 }
  62
  63 /* Disable webkit-box display. */
  64 list.cookie-list .deletable-item > :first-child {
  65   display: block;
  66 }
  67
  68 /* Force the X for deleting an origin to stay at the top. */
  69 list.cookie-list > .deletable-item > .close-button {
  70   position: absolute;
  71   right: 2px;
  72   top: 8px;
  73 }
  74
  75 html[dir=rtl] list.cookie-list > .deletable-item > .close-button {
  76   left: 2px;
  77   right: auto;
  78 }
  79
  80 /* Styles for the site (aka origin) and its summary. */
  81 .cookie-site {
  82   /* Notice that the width, margin, and padding match up with those above. */
  83   -webkit-margin-end: 2px;
  84   -webkit-padding-start: 5px;
  85   display: inline-block;
  86   overflow: hidden;
  87   text-overflow: ellipsis;
  88   width: 14em;
  89 }
  90
  91 list.cookie-list > .deletable-item[selected] .cookie-site {
  92   -webkit-user-select: text;
  93 }
  94
  95 .cookie-data {
  96   display: inline-block;
  97   max-width: 410px;
  98   overflow: hidden;
  99   text-overflow: ellipsis;
 100 }
 101
 102 .cookie-size {
 103   display: inline-block;
 104   float: right;
 105   margin-right: 0;
 106 }
 107
 108 list.cookie-list > .deletable-item[selected] .cookie-data {
 109   -webkit-user-select: text;
 110 }
 111
 112
 113 /* Styles for the individual items (cookies, etc.). */
 114 .cookie-items {
 115   /* Notice that the margin and padding match up with those above. */
 116   -webkit-margin-start: 14em;
 117   -webkit-padding-start: 7px;
 118   -webkit-transition: 150ms ease-in-out;
 119   height: 0;
 120   opacity: 0;
 121   /* Make the cookie items wrap correctly. */
 122   white-space: normal;
 123 }
 124
 125 .measure-items .cookie-items {
 126   -webkit-transition: none;
 127   height: auto;
 128   visibility: hidden;
 129 }
 130
 131 .show-items .cookie-items {
 132   opacity: 1;
 133 }
 134
 135 .cookie-items .cookie-item {
 136   background: rgb(224, 233, 245);
 137   border: 1px solid rgb(131, 146, 174);
 138   border-radius: 5px;
 139   display: inline-block;
 140   font-size: 85%;
 141   height: auto;
 142   margin: 2px 4px 2px 0;
 143   max-width: 120px;
 144   min-width: 40px;
 145   overflow: hidden;
 146   padding: 0 3px;
 147   text-align: center;
 148   text-overflow: ellipsis;
 149 }
 150
 151 .cookie-items .cookie-item:hover {
 152   background: rgb(238, 243, 249);
 153   border-color: rgb(100, 113, 135);
 154 }
 155
 156 .cookie-items .cookie-item[selected] {
 157   background: rgb(245, 248, 248);
 158   border-color: #B2B2B2;
 159 }
 160
 161 .cookie-items .cookie-item[selected]:hover {
 162   background: rgb(245, 248, 248);
 163   border-color: rgb(100, 113, 135);
 164 }
 165
 166 .cookie-items .cookie-item .protecting-app,
 167 .cookie-data .protecting-app {
 168   margin-bottom: -3px;
 169   margin-left: 4px;
 170 }
 171
 172 /* Styles for the cookie details box. */
 173 .cookie-details {
 174   background: rgb(245, 248, 248);
 175   border: 1px solid #B2B2B2;
 176   border-radius: 5px;
 177   margin-top: 2px;
 178   padding: 5px;
 179 }
 180
 181 list.cookie-list > .deletable-item[selected] .cookie-details {
 182   -webkit-user-select: text;
 183 }
 184
 185 .cookie-details-table {
 186   table-layout: fixed;
 187   width: 100%;
 188 }
 189
 190 .cookie-details-label {
 191   vertical-align: top;
 192   white-space: pre;
 193   width: 10em;
 194 }
 195
 196 .cookie-details-value {
 197   word-wrap: break-word;
 198 }