<html>
<head>
<title id="optionsTitle"></title>
- <link rel="stylesheet" type="text/css" href="../css/options.css">
+ <link rel="stylesheet" type="text/css" href="../chrome-bootstrap/chrome-bootstrap.css" />
+ <link rel="stylesheet" type="text/css" href="../css/options.css" />
</head>
- <body>
- <div id="content">
- <header>
- <h1>
- <img alt="Clear History logo" src="../images/icon32.png">
- <span id="optionsHeader"></span>
- </h1>
- </header>
- <hr>
- <div id="opt-form">
- <div id="opt-time">
- <div class="opt-name">
- <b id="optionsTimeFor"></b>
- <br><br>
- <div class="opt-timeStart">
- <input name="timeStart" class="opt-chk" type="checkbox" checked>
- <div class="opt-label" id="optionsTimeStart"></div>
- </div>
- </div>
- <div class="opt-value">
- <div class="opt-option"> <!-- 1 hour -->
- <input name="time" class="opt-chk" type="radio" value="1"
- tabindex="1" checked>
- <div class="opt-label" id="opt-1"></div>
- </div>
- <!-- <br> -->
- <div class="opt-option"> <!-- 2 hours -->
- <input name="time" class="opt-chk" type="radio" value="2">
- <div class="opt-label" id="opt-2"></div>
- </div>
- <!-- <br> -->
- <div class="opt-option"> <!-- 1 day -->
- <input name="time" class="opt-chk" type="radio" value="24">
- <div class="opt-label" id="opt-24"></div>
- </div>
- <!-- <br> -->
- <div class="opt-option"> <!-- 7 days -->
- <input name="time" class="opt-chk" type="radio" value="168">
- <div class="opt-label" id="opt-168"></div>
- </div>
- <!-- <br> -->
- <div class="opt-option"> <!-- 14 days -->
- <input name="time" class="opt-chk" type="radio" value="336">
- <div class="opt-label" id="opt-336"></div>
- </div>
- <!-- <br> -->
- <div class="opt-option"> <!-- 30 days -->
- <input name="time" class="opt-chk" type="radio" value="720">
- <div class="opt-label" id="opt-720"></div>
- </div>
- <!-- <br> -->
- <div class="opt-option">
- <input name="time" class="opt-chk" type="radio" value="-1">
- <div class="opt-label" id="opt--1"></div>
- </div>
- </div>
- </div>
- <hr>
- <div id="opt-prompt">
- <div class="opt-name">
- <b> </b>
- </div>
- <div class="opt-value">
- <div class="opt-option">
- <input name="prompt" class="opt-chk" type="checkbox" checked>
- <div class="opt-label" id="optionsPrompt"></div>
- </div>
- </div>
- </div>
- <hr>
- <div id="opt-cookies">
- <div class="opt-name">
- <b> </b>
- </div>
- <div class="opt-value">
- <div class="opt-option">
- <input name="cookies" class="opt-chk" type="checkbox">
- <div class="opt-label" id="optionsCookies"></div>
- </div>
- </div>
- </div>
- <hr>
- <div id="optionsSaved">
- <b></b>
+
+<body class="chrome-bootstrap">
+ <div class="frame">
+
+ <div class="navigation">
+ <h1><a href="#" i18n-content="optionsHeader"></a></h1>
+ <ul class="menu">
+ <li class="selected">
+ <a href="#options" i18n-content="frameOptions"></a>
+ </li>
+ </ul>
+ <ul>
+ <li> <img src='../images/icon128.png'/></li>
+ </ul>
+ </div>
+
+ <div class="mainview view">
+ <div id="options" class="selected">
+ <header>
+ <h1 i18n-content="frameOptions"></h1>
+ </header>
+ <div class="content">
+
+<section>
+ <h3 i18n-content="headerTimeRange"></h3>
+
+ <div class="radio">
+ <label>
+ <input name="timeStart" type="radio" value="yes" selected/>
+ <span i18n-content="optionsTimeStartNewer"></span>
+ </label>
+ </div>
+ <div class="checkbox">
+ <label>
+ <input name="timeStart" type="radio" value="no"/>
+ <span i18n-content="optionsTimeStartOlder"></span>
+ </label>
+ </div>
+
+ <br/>
+
+ <div class="radio">
+ <label> <!-- 1 hour -->
+ <input name="time" type="radio" value="1" tabindex="1"/>
+ <span class="opt-label" id="opt-1"></span>
+ </label>
+ </div>
+ <div class="radio">
+ <label> <!-- 2 hours -->
+ <input name="time" type="radio" value="2"/>
+ <span class="opt-label" id="opt-2"></span>
+ </label>
+ </div>
+ <div class="radio">
+ <label> <!-- 1 day -->
+ <input name="time" type="radio" value="24"/>
+ <span class="opt-label" id="opt-24"></span>
+ </label>
+ </div>
+ <div class="radio">
+ <label> <!-- 7 days -->
+ <input name="time" type="radio" value="168"/>
+ <span class="opt-label" id="opt-168"></span>
+ </label>
+ </div>
+ <div class="radio">
+ <label> <!-- 14 days -->
+ <input name="time" type="radio" value="336"/>
+ <span class="opt-label" id="opt-336"></span>
+ </label>
+ </div>
+ <div class="radio">
+ <label> <!-- 30 days -->
+ <input name="time" type="radio" value="720"/>
+ <span class="opt-label" id="opt-720"></span>
+ </label>
+ </div>
+ <div class="radio">
+ <label>
+ <input name="time" type="radio" value="-1"/>
+ <span class="opt-label" id="opt--1"></span>
+ </label>
+ </div>
+</section>
+
+<section>
+ <h3 i18n-content='headerUserInterface'></h3>
+
+ <div class="checkbox">
+ <label>
+ <input name="prompt" type="checkbox" checked/>
+ <span i18n-content="optionsPrompt"></span>
+ </label>
+ </div>
+
+ <div class="checkbox">
+ <label>
+ <input name="autoclear" type="checkbox"/>
+ <span i18n-content="optionsAutoclear"></span>
+ </label>
+ </div>
+</section>
+
+<section>
+ <h3 i18n-content='headerDataSelection'></h3>
+
+ <div class="checkbox">
+ <label>
+ <input name="cookies" type="checkbox"/>
+ <span i18n-content="optionsCookies"></span>
+ </label>
+ </div>
+
+ <div class="checkbox">
+ <label>
+ <input name="downloads" type="checkbox"/>
+ <span i18n-content="optionsDownloads"></span>
+ </label>
+ </div>
+</section>
+
+<div id="optionsSaved"><b i18n-content="optionsSaved"></b></div>
+
</div>
</div>
</div>
+
+ </div>
+
<script src="../javascript/background.js"></script>
<script src="../javascript/util.js"></script>
<script src="../javascript/options.js"></script>