mirror of
https://bitbucket.org/skobkin/chrome_point_plus.git
synced 2024-12-28 17:24:20 +00:00
Merged in isqua/chrome_point_plus/extract_options_css (pull request #18)
Move options style to separate file
This commit is contained in:
Alexey Skobkin
commit
ead197bf78
132
chrome_point_plus/css/options.css
Normal file
132
chrome_point_plus/css/options.css
Normal file
|
|
@ -0,0 +1,132 @@
|
|||
/* Options page */
|
||||
.pp-options {
|
||||
width: 450px;
|
||||
height: 450px;
|
||||
background: #EEE;
|
||||
}
|
||||
|
||||
/* Tabs style */
|
||||
.pp-options .usual {
|
||||
width:450px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.pp-options .usual ul {
|
||||
padding: 0 0 10px 0;
|
||||
margin: 0 0 18px 0;
|
||||
}
|
||||
|
||||
.pp-options .usual li {
|
||||
list-style: none;
|
||||
float: left;
|
||||
}
|
||||
.pp-options .usual ul a {
|
||||
display: block;
|
||||
padding: 6px 10px;
|
||||
text-decoration: none!important;
|
||||
margin: 1px;
|
||||
margin-left: 0;
|
||||
font: 12px Georgia;
|
||||
color: #FFF;
|
||||
background: #C8C8C8;
|
||||
border-radius: 15px 15px 0 0;
|
||||
}
|
||||
.pp-options .usual ul a:hover {
|
||||
color: #FFF;
|
||||
background: #BBB;
|
||||
}
|
||||
.pp-options .usual ul a.selected {
|
||||
margin-bottom: 0;
|
||||
color: #FFF;
|
||||
background: #A5A5A5;
|
||||
cursor: default;
|
||||
}
|
||||
.pp-options .usual div#tabs-content {
|
||||
margin: 0 5px 0 0;
|
||||
padding: 5px;
|
||||
background-color: #A5A5A5;
|
||||
border-radius: 0 15px 0 0;
|
||||
|
||||
}
|
||||
.pp-options .usual #panel {
|
||||
background: #B5B5B5;
|
||||
margin: 0 5px 0 0;
|
||||
padding: 10px;
|
||||
border-radius: 0 0 15px 15px;
|
||||
display: flex;
|
||||
}
|
||||
.pp-options .usual #panel button.button {
|
||||
background-color: #C8C8C8;
|
||||
border-radius:15px;
|
||||
border:1px solid #dcdcdc;
|
||||
display:inline-block;
|
||||
cursor:pointer;
|
||||
color:#000;
|
||||
font-family:Arial;
|
||||
font-size:15px;
|
||||
font-weight:bold;
|
||||
padding: 5px 25px;
|
||||
text-decoration:none;
|
||||
text-shadow:0px 1px 0px #ffffff;
|
||||
}
|
||||
.pp-options .usual #panel button.button:hover{
|
||||
background-color:#BBB;
|
||||
}
|
||||
.pp-options .usual #panel button.button:active {
|
||||
position:relative;
|
||||
top:1px;
|
||||
}
|
||||
|
||||
.pp-options .usual div a {
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.pp-options .tab-content {
|
||||
padding: 5px 0 0 5px;
|
||||
}
|
||||
|
||||
.pp-options .option-node {
|
||||
display: block;
|
||||
margin: 5px 0 5px 15px;
|
||||
}
|
||||
|
||||
.pp-options .option-node label {
|
||||
font: 10pt Georgia;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.pp-options .tab-content .text {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
/* Disables subcheckboxes if parent disabled */
|
||||
.pp-options .option-node input[type="checkbox"]:not(:checked) ~.option-node {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.pp-options .option-node input[type="checkbox"]:not(:checked) ~.option-node label {
|
||||
color: #BBB;
|
||||
}
|
||||
|
||||
/* Panel */
|
||||
.pp-options .left, .pp-options .right {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.pp-options .left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.pp-options .right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.pp-options #status {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.pp-options #pp-version {
|
||||
margin-top: 6px;
|
||||
text-align: right;
|
||||
}
|
||||
|
|
@ -27,139 +27,6 @@ div#markItUpText-input {
|
|||
position: relative;
|
||||
}
|
||||
|
||||
/* Options page */
|
||||
.pp-options {
|
||||
width: 450px;
|
||||
height: 450px;
|
||||
background: #EEE;
|
||||
}
|
||||
|
||||
/* Tabs style */
|
||||
.pp-options .usual {
|
||||
width:450px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.pp-options .usual ul {
|
||||
padding: 0 0 10px 0;
|
||||
margin: 0 0 18px 0;
|
||||
}
|
||||
|
||||
.pp-options .usual li {
|
||||
list-style: none;
|
||||
float: left;
|
||||
}
|
||||
.pp-options .usual ul a {
|
||||
display: block;
|
||||
padding: 6px 10px;
|
||||
text-decoration: none!important;
|
||||
margin: 1px;
|
||||
margin-left: 0;
|
||||
font: 12px Georgia;
|
||||
color: #FFF;
|
||||
background: #C8C8C8;
|
||||
border-radius: 15px 15px 0 0;
|
||||
}
|
||||
.pp-options .usual ul a:hover {
|
||||
color: #FFF;
|
||||
background: #BBB;
|
||||
}
|
||||
.pp-options .usual ul a.selected {
|
||||
margin-bottom: 0;
|
||||
color: #FFF;
|
||||
background: #A5A5A5;
|
||||
cursor: default;
|
||||
}
|
||||
.pp-options .usual div#tabs-content {
|
||||
margin: 0 5px 0 0;
|
||||
padding: 5px;
|
||||
background-color: #A5A5A5;
|
||||
border-radius: 0 15px 0 0;
|
||||
|
||||
}
|
||||
.pp-options .usual #panel {
|
||||
background: #B5B5B5;
|
||||
margin: 0 5px 0 0;
|
||||
padding: 10px;
|
||||
border-radius: 0 0 15px 15px;
|
||||
display: flex;
|
||||
}
|
||||
.pp-options .usual #panel button.button {
|
||||
background-color: #C8C8C8;
|
||||
border-radius:15px;
|
||||
border:1px solid #dcdcdc;
|
||||
display:inline-block;
|
||||
cursor:pointer;
|
||||
color:#000;
|
||||
font-family:Arial;
|
||||
font-size:15px;
|
||||
font-weight:bold;
|
||||
padding: 5px 25px;
|
||||
text-decoration:none;
|
||||
text-shadow:0px 1px 0px #ffffff;
|
||||
}
|
||||
.pp-options .usual #panel button.button:hover{
|
||||
background-color:#BBB;
|
||||
}
|
||||
.pp-options .usual #panel button.button:active {
|
||||
position:relative;
|
||||
top:1px;
|
||||
}
|
||||
|
||||
.pp-options .usual div a {
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.pp-options .tab-content {
|
||||
padding: 5px 0 0 5px;
|
||||
}
|
||||
|
||||
.pp-options .option-node {
|
||||
display: block;
|
||||
margin: 5px 0 5px 15px;
|
||||
}
|
||||
|
||||
.pp-options .option-node label {
|
||||
font: 10pt Georgia;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.pp-options .tab-content .text {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
/* Disables subcheckboxes if parent disabled */
|
||||
.pp-options .option-node input[type="checkbox"]:not(:checked) ~.option-node {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.pp-options .option-node input[type="checkbox"]:not(:checked) ~.option-node label {
|
||||
color: #BBB;
|
||||
}
|
||||
|
||||
/* Panel */
|
||||
.pp-options .left, .pp-options .right {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.pp-options .left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.pp-options .right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.pp-options #status {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.pp-options #pp-version {
|
||||
margin-top: 6px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* Auto-loaded Booru pictures */
|
||||
.booru_pic {
|
||||
display: block !important;
|
||||
|
|
@ -235,4 +102,4 @@ div#markItUpText-input {
|
|||
display: block;
|
||||
color: rgba(255,255,255,.75);
|
||||
padding: 10px 0px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>Point Plus options</title>
|
||||
|
||||
<link rel="stylesheet" href="css/point-plus.css" type="text/css"/>
|
||||
|
||||
<link rel="stylesheet" href="css/options.css" type="text/css"/>
|
||||
<script src="vendor/jquery/jquery.min.js"></script>
|
||||
<script src="js/jquery.idTabs.min.js"></script>
|
||||
</head>
|
||||
|
|
@ -15,12 +15,12 @@
|
|||
<li><a href="#websocket" data-i18n="options_tabs_websocket"></a></li>
|
||||
<li><a href="#feedback" data-i18n="options_tabs_feedback"></a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
<div id="tabs-content">
|
||||
<div class="tab-content" id="media">
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fancybox"><label for="option-fancybox" data-i18n="option_fancybox"></label>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fancybox-images"><label for="option-fancybox-images" data-i18n="option_fancybox_images"></label>
|
||||
</div>
|
||||
|
|
@ -44,7 +44,7 @@
|
|||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding"><label for="option-embedding" data-i18n="option_embedding"></label>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-images-load-booru"><label for="option-images-load-booru" data-i18n="option_images_load_booru"></label>
|
||||
</div>
|
||||
|
|
@ -72,7 +72,7 @@
|
|||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-soundcloud"><label for="option-embedding-soundcloud" data-i18n="option_embedding_soundcloud"></label>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-soundcloud-orig-link"><label for="option-embedding-soundcloud-orig-link" data-i18n="option_embedding_soundcloud_orig_link"></label>
|
||||
</div>
|
||||
|
|
@ -98,7 +98,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-nsfw"><label for="option-nsfw" data-i18n="option_nsfw"></label>
|
||||
|
||||
|
|
@ -128,11 +128,11 @@
|
|||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ctrl-enter" disabled="disabled"><label for="option-ctrl-enter" data-i18n="option_ctrl_enter"></label>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fluid-layout"><label for="option-fluid-layout" data-i18n="option_fluid_layout"></label>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-visual-editor-post"><label for="option-visual-editor-post" data-i18n="option_visual_editor_post"></label>
|
||||
</div>
|
||||
|
|
@ -140,17 +140,17 @@
|
|||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-search-with-google"><label for="option-search-with-google" data-i18n="option_search_with_google"></label>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-enlarge-font"><label for="option-enlarge-font" data-i18n="option_enlarge_font"></label>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="radio" class="option-enum" name="option-enlarge-font-size" id="option-enlarge-font-size-85" value="85" checked="checked"><label for="option-enlarge-font-size-85">0.85em</label>
|
||||
<input type="radio" class="option-enum" name="option-enlarge-font-size" id="option-enlarge-font-size-100" value="100"><label for="option-enlarge-font-size-100">1em</label>
|
||||
<input type="radio" class="option-enum" name="option-enlarge-font-size" id="option-enlarge-font-size-110" value="110"><label for="option-enlarge-font-size-110">1.1em</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-at-before-username"><label for="option-at-before-username" data-i18n="option_at_before_username"></label>
|
||||
</div>
|
||||
|
|
@ -167,30 +167,30 @@
|
|||
<input type="checkbox" class="option-boolean" id="option-other-scroll-space-key"><label for="option-other-scroll-space-key" data-i18n="option_other_scroll_space_key"></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="tab-content" id="websocket">
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws"><label for="option-ws" data-i18n="option_ws"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-comments"><label for="option-ws-comments" data-i18n="option_ws_comments"></label>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-comments-color-fadeout"><label for="option-ws-comments-color-fadeout" data-i18n="option_ws_comments_color_fadeout"></label>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-comments-notifications"><label for="option-ws-comments-notifications" data-i18n="option_ws_comments_notifications"></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-feeds" disabled><label for="option-ws-feeds" data-i18n="option_ws_feeds"></label>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-feeds-subscriptions"><label for="option-ws-feeds-subscriptions" data-i18n="option_ws_feeds_subscriptions"></label>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-feeds-blogs"><label for="option-ws-feeds-blogs" data-i18n="option_ws_feeds_blogs"></label>
|
||||
</div>
|
||||
|
|
@ -202,17 +202,17 @@
|
|||
<div class="text" data-i18n="options_feedback_text"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div id="panel">
|
||||
<div class="left" id="status"></div>
|
||||
|
||||
|
||||
<div class="right">
|
||||
<div id="pp-version"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script src="js/options.js"></script>
|
||||
<script src="js/i18n.js"></script>
|
||||
</body>
|
||||
|
|
|
|||
Loading…
Reference in a new issue