add an option to automatically purge history

[chrome-ext/clearhistory-advance-fork.git] / css / options.css

/* Copyright 2011 Google Inc. All Rights Reserved. */

/**
 * @fileoverview The styles for elements of the options page
 * @author arunjit@google.com (Arunjit Singh)
 */

@CHARSET "UTF-8";
body {
  background-color: #eef;
  color: #222;
  direction: __MSG_@@bidi_dir__;  /* Predefined message from Chrome Extension */
  font: 13px/18px "Arial";
}
header {
  color: #333;
  margin: 0 auto;
  text-align: left;
  width: 400px;
}
h1 {
  color: #dd4b39;
  font: 20px/24px "Arial" normal;
  margin: 5px 0 0;
  padding: 0 5px 3px;
}
h1 > img,
h1 > span {
  vertical-align: middle;
}
hr {
  background-color: #ebebeb;
  border: none;
  clear: both;
  height: 1px;
  margin: 5px auto;
  width: 400px;
}
#content {
  background-color: #fff;
  border: 4px solid rgba(0, 0, 0, 0.2);
  border-radius: 12px;
  margin: 40px auto 0;
  padding: 10px 10px 0;
  width: 500px;
}
#opt-form {
  margin: 10px auto;
  overflow: hidden;
  width: 400px;
}
#opt-time,
#opt-prompt,
#opt-cookies,
#opt-autoclear {
  background-color: white;
  clear: left;
  margin: 5px auto;
  overflow: hidden;
  padding: 5px 5px;
}
.opt-name {
  float: left;
  width: 175px;
}
.opt-value {
  float: left;
  width: 215px;
}
.opt-value .opt-option {
  clear: left;
  margin-bottom: 5px;
  overflow: hidden;
}
.opt-value .opt-option .opt-chk {
  float: left;
}
.opt-value .opt-option .opt-label {
  float: left;
  margin-top: -3px;
  padding-left: 6px;
}
#optionsSaved {
  clear: left;
  margin: 10px auto 5px;
  padding: 5px;
  text-align: center;
}
#optionsSaved b {
  background-color: #f9edbe;
  border: 1px solid #f0c36d;
  border-radius: 2px;
  color: #333;
  font-weight: normal;
  opacity: 0;
  padding: 6px 16px;
  -webkit-transition: opacity 130ms ease-in-out;
}
#optionsSaved.show b {
  opacity: 1;
  -webkit-transition: opacity 50ms ease-in-out;
}
input[type="checkbox"],
input[type="radio"] {
  -webkit-appearance: none;
  background-color: white;
  border: 1px solid #dcdcdc;
  height: 13px;
  margin: 0;
  width: 13px;
}
input[type="radio"] {
  border-radius: 50%;
  height: 15px;
  width: 15px;
}
input[type="checkbox"]:hover,
input[type="radio"]:hover {
  border-color: #c6c6c6;
  -webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.1)
}
input[type="checkbox"]:active,
input[type="radio"]:active {
  background-color: #ebebeb;
  border-color: #c6c6c6;
}
input[type="radio"]:checked::after {
  background: #666;
  border-radius: 50%;
  content: '';
  display: block;
  height: 7px;
  margin: 3px auto;
  width: 7px;
}
input[type="checkbox"]:checked::after {
  content: url('../images/check.png');
  display: block;
  left: -5px;
  position: relative;
  top: -6px;
}
input[type="checkbox"]:focus,
input[type="radio"]:focus {
  outline: none;
  border-color: #4d90fe;
}