diff options
Diffstat (limited to 'chrome')
| -rw-r--r-- | chrome/css/redirector.css | 124 | ||||
| -rw-r--r-- | chrome/redirector.html | 26 |
2 files changed, 73 insertions, 77 deletions
diff --git a/chrome/css/redirector.css b/chrome/css/redirector.css index 47b2028..2c7fb9d 100644 --- a/chrome/css/redirector.css +++ b/chrome/css/redirector.css @@ -1,74 +1,68 @@ -body { - font-family: Tahoma, Arial, sans-serif; - font-size:10pt; - min-height:100%; - background:-moz-linear-gradient(top, #AFCFFE,#fff); - margin:0; padding:0; -} -html { - height:100%; - margin:0; - padding:0; -} -h1 { text-align:center; color:#555; text-shadow:0px 0px 15px white; font-size:34pt; padding:0px; margin:20px 0px 0px 0px; letter-spacing:2px; } -label { display:table-cell; } -input { display:table-cell; } -li { margin:0; padding:5px; border-top: dotted 1px grey;} -li:first-child { border-top:none;} -#actions { width:600px; margin:10px auto; text-align:center; } -#redirect-list { - -moz-user-select: -moz-none; +/* Redirector CSS */ - border:solid 1px grey; - margin:auto; - padding:0px; - width: 700px; - list-style-type:none; - list-style-position:outside; - border-radius:3px; - box-shadow: 0px 0px 2px grey; - text-shadow: 1px 1px 1px white; -} -#config { - display:none; - position:fixed; - margin:auto; - width:300px; -} +/* entire page */ +html { font-family: "Segoe UI"; } -h2 { text-align:center; margin-top:0px; } -button { border:solid 1px grey; border-radius:4px; background:-moz-linear-gradient(top, #ccc, #fff); cursor:pointer;} -h5 { text-align:center; margin:0px; padding-left:130px; } -.pattern, .redirectTo { color:blue; font-style:italic;} -.exampleUrl, .redirectResult { color:blue; } -#redirect-list li:nth-child(odd) { background:#e5e5e5; } -#redirect-list li:nth-child(even) { background-color:#fff; } +/* main header */ +h1 { margin: 0px; text-align: center; font-size: 280%; line-height: 90%; font-style: italic; } -#redirect-form div { margin-top:5px; display:table-row; } -#redirect-form div label{ text-align:right; padding:6px;} -#redirect-form div input[type='text']{ margin-top:7px; width:300px; display:inline-block; } +/* sub-header */ +h5 { margin: 0px; padding-left: 14em; text-align: center; } +/* action buttons below header */ +#actions { margin-top: 12px; margin-bottom: 10px; text-align: center; } -#config label{ display:inline; } -#config input { margin-top:10px; } -.button-row { text-align:center; display:block !important;} +/* table (list) of redirect rules */ +#redirect-list { + width: 96%; + box-shadow: 0px 0px 2px gray; + border: solid 2px gray; + margin: auto; + padding: 0px; + list-style-type: none; + list-style-position: outside; + -moz-user-select: -moz-none; +} + +/* individual cells within table of rules */ +#redirect-list > li { margin: 0px; border-top: dotted 1px gray; padding: 8px 2px 12px 10px; font-size: 80%; } +#redirect-list > li:first-child { border-top: none; } +#redirect-list > li:nth-child(odd) { background-color: #f0f0f0; } + +/* rule within each cell */ +.disabled { font-weight: bold; color: red; } +.description { font-weight: bold; } +.patternLabel { display: inline-block; width: 4em; margin-left: 5px; margin-right: 4px; text-align: right; } +.pattern, .redirectTo { color: blue; } +.editdeleteRow { margin-top: 8px; } +/* turn Edit and Delete functions into buttons, remove underlines and text shadows, apply useful colors */ +.edit, .delete { -moz-appearance: button; padding-left: 4px !important; padding-right: 4px !important; + text-decoration: none !important; } +.edit { color: green !important; } +.delete { margin-left: 6px; color: rgb(180,80,25) !important; } +/* all dialog boxes */ .dialog { - background:-moz-linear-gradient(top,#fff, #AFCFFE); - border-radius:8px; - display:none; - position:fixed; - margin:0 auto; - padding:10px; - box-shadow: 0px 0px 4px black; + display: none; + position: fixed; + box-shadow: 0px 0px 4px black; + background: linear-gradient(to bottom, #fff, #afcffe); + border-radius: 8px; + margin: 0px auto; + padding: 10px; } +label, input { display: table-cell; } +.button-row { text-align: center; display: block !important; } +button { cursor: pointer; } -#redirect-form { - background:-moz-linear-gradient(top,#fff, #AFCFFE); - border-radius:8px; - display:none; - position:fixed; - margin:0 auto; - padding:10px; - box-shadow: 0px 0px 4px black; -} +/* New (and Edit) Redirect dialog box */ +#redirect-form > div { margin-top: 3px; display: table-row; } +#redirect-form > div > label { text-align: right; padding: 6px; } +#redirect-form > div > input[type='text'] { display: inline-block; width: 46em; margin-top: 7px; } + +/* Configuration dialog box */ +#config { padding-right: 18px; } +h2 { text-align: center; margin-top: 0px; margin-bottom: 9px; } +#config > .button-row { margin-top: 18px; } +#config > label { display: inline; } +#config > input { margin-top: 10px; } diff --git a/chrome/redirector.html b/chrome/redirector.html index eb0baa7..632b5d2 100644 --- a/chrome/redirector.html +++ b/chrome/redirector.html @@ -2,7 +2,7 @@ <html> <head> <title>Redirector Extension Settings</title> - <link rel="stylesheet" href="css/redirector.css?sfsdf" /> + <link rel="stylesheet" href="css/redirector.css?love" /> <script type="text/javascript" src="js/jquery-1.6.2.min.js"></script> <script type="text/javascript" src="js/redirector-ui.js"></script> </head> @@ -10,28 +10,30 @@ <h1>Redirector</h1> <h5>Go where <em>YOU</em> want!</h5> <div id="actions"> - <button id="new-redirect">New Redirect...</button> - <button id="configure">Configure</button> + <button id="new-redirect">New Redirect</button> + <button id="configure">Settings</button> <button id="import">Import</button> <button id="export">Export</button> <button id="help">Help</button> </div> <ul id="redirect-list"> <li> - <div>Redirect: <span class="pattern">pattern</span> to <span class="redirectTo"></span></div> - <div>Example: <span class="exampleUrl"></span> becomes <span class="redirectResult"></span></div> - <div> + <div><span class="disabled"></span><span class="description">Redirector Rule</span></div> + <div><div class="patternLabel">Redirect:</div><span class="pattern">pattern</span></div> + <div><div class="patternLabel">to:</div><span class="redirectTo">nothing</span></div> + <!-- <div>Example: <span class="exampleUrl"></span> becomes <span class="redirectResult"></span></div> --> + <div class="editdeleteRow"> <a class="edit" href="#edit">Edit</a> <a class="delete" href="#delete">Delete</a> </div> </li> </ul> <div id="config" class="dialog"> - <h2>Configuration</h2> - <input type="checkbox" id="enable-redirector" data-pref="enabled" /><label>Enabled</label><br /> - <input type="checkbox" id="show-status-bar-icon" data-pref="showStatusBarIcon"/><label>Statusbar icon</label><br /> + <h2>Settings</h2> + <input type="checkbox" id="enable-redirector" data-pref="enabled" /><label>Enable</label><br /> + <!-- <input type="checkbox" id="show-status-bar-icon" data-pref="showStatusBarIcon"/><label>Statusbar icon</label><br /> --> <input type="checkbox" id="show-context-menu" data-pref="showContextMenu"/><label>Context menu</label><br /> - <input type="checkbox" id="enable-shortcut-key" data-pref="enableShortcutKey"/><label>Enable/Disable via Alt-r</label><br /> + <input type="checkbox" id="enable-shortcut-key" data-pref="enableShortcutKey"/><label>Toggle via Alt-r</label><br /> <input type="checkbox" id="enable-debug-output" data-pref="debugEnabled"/><label>Debug output</label><br /> <div class="button-row"> <button id="close">Close</button> @@ -72,13 +74,13 @@ <input type="checkbox" id="escape-matches" /> </div> <div> - <label>Enabled</label> + <label>Enable</label> <input type="checkbox" id="redirect-enabled" /> </div> <div class="button-row"> <button id="save">Save</button> + <button id="test-pattern">Test</button> <button id="cancel">Cancel</button> - <button id="test-pattern">Test pattern</button> </div> </div> </body> |