Ruud
10 years ago
14 changed files with 1174 additions and 1476 deletions
@ -0,0 +1,819 @@ |
|||
.page.settings { |
|||
min-width: 960px; |
|||
} |
|||
|
|||
.page.settings:after { |
|||
content: ""; |
|||
display: block; |
|||
clear: both; |
|||
visibility: hidden; |
|||
line-height: 0; |
|||
height: 0; |
|||
} |
|||
|
|||
.page.settings .tabs { |
|||
float: left; |
|||
width: 14.7%; |
|||
font-size: 17px; |
|||
text-align: right; |
|||
list-style: none; |
|||
padding: 35px 0; |
|||
margin: 0; |
|||
min-height: 470px; |
|||
background-image: linear-gradient( |
|||
76deg, |
|||
rgba(0,0,0,0) 50%, |
|||
rgba(0,0,0,0.3) 100% |
|||
); |
|||
} |
|||
.page.settings .tabs a { |
|||
display: block; |
|||
padding: 7px 15px; |
|||
font-weight: normal; |
|||
transition: all 0.3s ease-in-out; |
|||
color: rgba(255, 255, 255, 0.8); |
|||
text-shadow: none; |
|||
} |
|||
.page.settings .tabs a:hover, |
|||
.page.settings .tabs .active a { |
|||
background: rgb(78, 89, 105); |
|||
color: #fff; |
|||
} |
|||
.page.settings .tabs > li { |
|||
border-bottom: 1px solid rgb(78, 89, 105); |
|||
} |
|||
|
|||
.page.settings .tabs .subtabs { |
|||
list-style: none; |
|||
padding: 0; |
|||
margin: -5px 0 10px; |
|||
} |
|||
|
|||
.page.settings .tabs .subtabs a { |
|||
font-size: 13px; |
|||
padding: 0 15px; |
|||
font-weight: normal; |
|||
transition: all .3s ease-in-out; |
|||
color: rgba(255, 255, 255, 0.7); |
|||
} |
|||
|
|||
.page.settings .tabs .subtabs .active a { |
|||
color: #fff; |
|||
background: rgb(78, 89, 105); |
|||
} |
|||
|
|||
|
|||
.page.settings .containers { |
|||
width: 84%; |
|||
float: left; |
|||
padding: 40px 0 40px 2%; |
|||
min-height: 300px; |
|||
} |
|||
|
|||
.page .advanced { |
|||
display: none; |
|||
color: #edc07f; |
|||
} |
|||
.page.show_advanced .advanced { display: block; } |
|||
.page.show_advanced span.advanced, |
|||
.page.show_advanced input.advanced { display: inline; } |
|||
|
|||
.page.settings .tab_content { |
|||
display: none; |
|||
} |
|||
.page.settings .tab_content.active { display: block; } |
|||
|
|||
.page fieldset { |
|||
padding: 10px 0; |
|||
} |
|||
.page fieldset h2 { |
|||
font-weight: normal; |
|||
font-size: 25px; |
|||
padding: 0 9px 10px 30px; |
|||
margin: 0; |
|||
border-bottom: 1px solid #333; |
|||
box-shadow: 0 1px 0 rgba(255,255,255, 0.15); |
|||
} |
|||
|
|||
.page fieldset h2 .icon { |
|||
vertical-align: bottom; |
|||
position: absolute; |
|||
left: -25px; |
|||
top: 3px; |
|||
background: #FFF; |
|||
border-radius: 2.5px; |
|||
line-height: 0; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
.page fieldset.enabler:hover h2 .icon { |
|||
display: none; |
|||
} |
|||
|
|||
.page fieldset h2 .hint { |
|||
font-size: 12px; |
|||
margin-left: 10px; |
|||
} |
|||
.page fieldset h2 .hint a { |
|||
margin: 0 !important; |
|||
padding: 0; |
|||
} |
|||
|
|||
.page fieldset.disabled .ctrlHolder { |
|||
display: none; |
|||
} |
|||
.page fieldset > .ctrlHolder:first-child { |
|||
display: block; |
|||
padding: 0; |
|||
position: relative; |
|||
margin: 0 0 -23px; |
|||
border: none; |
|||
width: 20px; |
|||
} |
|||
|
|||
.Scan_folder { padding: 0 !important; } |
|||
|
|||
.page .ctrlHolder { |
|||
line-height: 25px; |
|||
padding: 10px 10px 10px 30px; |
|||
font-size: 14px; |
|||
border: 0; |
|||
} |
|||
.page .ctrlHolder.save_success:not(:first-child) { |
|||
background: url('../images/icon.check.png') no-repeat 7px center; |
|||
} |
|||
.page .ctrlHolder:last-child { border: none; } |
|||
.page .ctrlHolder:hover { background-color: rgba(255,255,255,0.05); } |
|||
.page .ctrlHolder.focused { background-color: rgba(255,255,255,0.2); } |
|||
.page .ctrlHolder.focused:first-child, .page .ctrlHolder:first-child{ background-color: transparent; } |
|||
|
|||
.page .ctrlHolder .formHint { |
|||
width: 46%; |
|||
margin: -18px 0; |
|||
color: #fff !important; |
|||
display: inline-block; |
|||
vertical-align: middle; |
|||
padding: 0 0 0 2%; |
|||
line-height: 14px; |
|||
} |
|||
|
|||
.page .check { |
|||
margin-top: 6px; |
|||
} |
|||
|
|||
.page .check + .formHint { |
|||
float: none; |
|||
width: auto; |
|||
display: inline-block; |
|||
padding-left: 1% !important; |
|||
height: 24px; |
|||
vertical-align: middle; |
|||
line-height: 24px; |
|||
} |
|||
|
|||
.page .ctrlHolder label { |
|||
font-weight: bold; |
|||
width: 20%; |
|||
margin: 0; |
|||
padding: 6px 0 0; |
|||
} |
|||
|
|||
.page .xsmall { width: 25px !important; text-align: center; } |
|||
|
|||
.page .enabler { |
|||
display: block; |
|||
} |
|||
|
|||
.page .option_list { |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.page .option_list .check { |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
.page .option_list .enabler { |
|||
padding: 0; |
|||
margin-left: 5px !important; |
|||
} |
|||
|
|||
.page .option_list .enabler:not(.disabled) { |
|||
margin: 0 0 0 30px; |
|||
} |
|||
|
|||
.page .option_list .enabler:not(.disabled) .ctrlHolder:first-child { |
|||
margin: 10px 0 -33px 0; |
|||
} |
|||
|
|||
.page .option_list h3 { |
|||
padding: 0; |
|||
margin: 10px 5px 0; |
|||
text-align: center; |
|||
font-weight: normal; |
|||
text-shadow: none; |
|||
text-transform: uppercase; |
|||
font-size: 12px; |
|||
background: rgba(255,255,255,0.03); |
|||
} |
|||
|
|||
.page .option_list .enabler.disabled { |
|||
display: inline-block; |
|||
padding: 4px 0 5px; |
|||
width: 24%; |
|||
vertical-align: top; |
|||
} |
|||
.page .option_list .enabler:not(.disabled) .icon { |
|||
display: none; |
|||
} |
|||
|
|||
.page .option_list .enabler.disabled h2 { |
|||
cursor: pointer; |
|||
border: none; |
|||
box-shadow: none; |
|||
padding: 0 10px 0 0; |
|||
font-size: 16px; |
|||
position: relative; |
|||
left: 25px; |
|||
margin-right: 25px; |
|||
} |
|||
|
|||
.page .option_list .enabler:not(.disabled) h2 { |
|||
font-size: 16px; |
|||
font-weight: bold; |
|||
border: none; |
|||
border-top: 1px solid rgba(255,255,255, 0.15); |
|||
box-shadow: 0 -1px 0 #333; |
|||
margin: 0; |
|||
padding: 10px 0 5px 25px; |
|||
} |
|||
.page .option_list .enabler:not(.disabled):first-child h2 { |
|||
border: none; |
|||
box-shadow: none; |
|||
} |
|||
|
|||
.page .option_list .enabler.disabled h2 .hint { |
|||
display: none; |
|||
} |
|||
.page .option_list .enabler h2 .hint { |
|||
font-weight: normal; |
|||
} |
|||
|
|||
.page input[type=text], .page input[type=password] { |
|||
padding: 5px 3px; |
|||
margin: 0; |
|||
width: 30%; |
|||
} |
|||
.page .input.xsmall { width: 5% } |
|||
.page .input.small { width: 10% } |
|||
.page .input.medium { width: 15% } |
|||
.page .input.large { width: 25% } |
|||
.page .input.xlarge { width: 30% } |
|||
|
|||
.page .advanced_toggle { |
|||
clear: both; |
|||
display: block; |
|||
text-align: right; |
|||
height: 20px; |
|||
margin: 0 0 -38px; |
|||
} |
|||
.page .advanced_toggle .check { |
|||
margin: 0; |
|||
} |
|||
.page .advanced_toggle span { padding: 0 5px; } |
|||
.page.show_advanced .advanced_toggle { |
|||
color: #edc07f; |
|||
} |
|||
|
|||
.page form .directory { |
|||
display: inline-block; |
|||
padding: 0 4% 0 4px; |
|||
font-size: 13px; |
|||
width: 30%; |
|||
overflow: hidden; |
|||
vertical-align: top; |
|||
position: relative; |
|||
} |
|||
.page form .directory:after { |
|||
content: "\e097"; |
|||
position: absolute; |
|||
right: 7px; |
|||
top: 2px; |
|||
font-family: 'Elusive-Icons'; |
|||
color: #f5e39c; |
|||
} |
|||
.page form .directory > input { |
|||
height: 25px; |
|||
display: inline-block; |
|||
float: right; |
|||
text-align: right; |
|||
white-space: nowrap; |
|||
cursor: pointer; |
|||
background: none; |
|||
border: 0; |
|||
color: #FFF; |
|||
width: 100%; |
|||
} |
|||
.page form .directory input:empty:before { |
|||
content: 'No folder selected'; |
|||
font-style: italic; |
|||
opacity: .3; |
|||
} |
|||
|
|||
.page .directory_list { |
|||
z-index: 2; |
|||
position: absolute; |
|||
width: 450px; |
|||
margin: 28px 0 20px 18.4%; |
|||
background: #5c697b; |
|||
box-shadow: 0 20px 40px -20px rgba(0,0,0,0.55); |
|||
} |
|||
|
|||
.page .directory_list .pointer { |
|||
border-right: 6px solid transparent; |
|||
border-left: 6px solid transparent; |
|||
border-bottom: 6px solid #5c697b; |
|||
display: block; |
|||
position: absolute; |
|||
width: 0; |
|||
margin: -6px 0 0 45%; |
|||
} |
|||
|
|||
.page .directory_list ul { |
|||
width: 92%; |
|||
height: 300px; |
|||
overflow: auto; |
|||
margin: 0 4%; |
|||
font-size: 16px; |
|||
} |
|||
|
|||
.page .directory_list li { |
|||
padding: 4px 30px 4px 10px; |
|||
cursor: pointer; |
|||
margin: 0 !important; |
|||
border-top: 1px solid rgba(255,255,255,0.1); |
|||
background: url('../images/right.arrow.png') no-repeat 98% center; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
text-overflow: ellipsis; |
|||
} |
|||
|
|||
.page .directory_list li.blur { |
|||
opacity: .3; |
|||
} |
|||
|
|||
.page .directory_list li:last-child { |
|||
border-bottom: 1px solid rgba(255,255,255,0.1); |
|||
} |
|||
|
|||
.page .directory_list li:hover { |
|||
background-color: #515c68; |
|||
} |
|||
|
|||
.page .directory_list li.empty { |
|||
background: none; |
|||
height: 100px; |
|||
text-align: center; |
|||
font-style: italic; |
|||
border: none; |
|||
line-height: 100px; |
|||
cursor: default; |
|||
color: #BBB; |
|||
text-shadow: none; |
|||
font-size: 12px; |
|||
} |
|||
|
|||
.page .directory_list .actions { |
|||
clear: both; |
|||
padding: 4% 4% 2%; |
|||
min-height: 45px; |
|||
position: relative; |
|||
width: 100%; |
|||
text-align: right; |
|||
} |
|||
|
|||
.page .directory_list .actions label { |
|||
float: right; |
|||
width: auto; |
|||
padding: 0; |
|||
} |
|||
.page .directory_list .actions .inlay { |
|||
margin: 0 0 0 7px; |
|||
} |
|||
|
|||
.page .directory_list .actions .back { |
|||
font-weight: bold; |
|||
width: 160px; |
|||
display: inline-block; |
|||
padding: 0; |
|||
line-height: 120%; |
|||
vertical-align: top; |
|||
position: absolute; |
|||
text-align: left; |
|||
left: 4%; |
|||
} |
|||
|
|||
.page .directory_list .actions:last-child { |
|||
float: right; |
|||
padding: 4%; |
|||
} |
|||
|
|||
.page .directory_list .actions:last-child > span { |
|||
padding: 0 5px; |
|||
text-shadow: none; |
|||
} |
|||
|
|||
.page .directory_list .actions:last-child > .clear { |
|||
left: 4%; |
|||
position: absolute; |
|||
background-color: #af3128; |
|||
} |
|||
|
|||
.page .directory_list .actions:last-child > .cancel { |
|||
font-weight: bold; |
|||
color: #ddd; |
|||
} |
|||
|
|||
.page .directory_list .actions:last-child > .save { |
|||
background: #9dc156; |
|||
} |
|||
|
|||
|
|||
.page .multi_directory.is_empty .delete { |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.page .multi_directory .delete { |
|||
display: none; |
|||
} |
|||
.page .multi_directory:hover .delete { |
|||
display: inline-block; |
|||
width: 22px; |
|||
height: 24px; |
|||
vertical-align: top; |
|||
background-position: center; |
|||
margin-left: 5px; |
|||
} |
|||
|
|||
|
|||
.page .tag_input select { |
|||
width: 20%; |
|||
display: inline-block; |
|||
} |
|||
|
|||
.page .tag_input .selection { |
|||
border-radius: 0 10px 10px 0; |
|||
height: 26px; |
|||
} |
|||
|
|||
.page .tag_input > input { |
|||
display: none; |
|||
} |
|||
|
|||
.page .tag_input > ul { |
|||
list-style: none; |
|||
border-radius: 3px; |
|||
cursor: text; |
|||
width: 30%; |
|||
margin: 0 !important; |
|||
min-height: 27px; |
|||
line-height: 0; |
|||
display: inline-block; |
|||
} |
|||
.page .tag_input:hover > ul { |
|||
border-radius: 3px 0 0 3px; |
|||
} |
|||
.page .tag_input:hover .formHint { display: none; } |
|||
|
|||
.page .tag_input > ul > li { |
|||
display: inline-block; |
|||
min-height: 20px; |
|||
min-width: 2px; |
|||
font-size: 12px; |
|||
padding: 0; |
|||
margin: 4px 0 0 !important; |
|||
border-width: 0; |
|||
background: 0; |
|||
line-height: 20px; |
|||
} |
|||
.page .tag_input > ul > li:first-child { min-width: 4px; } |
|||
.page .tag_input li.choice { |
|||
cursor: -moz-grab; |
|||
cursor: -webkit-grab; |
|||
cursor: grab; |
|||
padding: 0; |
|||
border-radius: 2px; |
|||
} |
|||
.page .tag_input > ul:hover > li.choice { |
|||
background: linear-gradient( |
|||
180deg, |
|||
rgba(255,255,255,0.3) 0%, |
|||
rgba(255,255,255,0.1) 100% |
|||
); |
|||
} |
|||
.page .tag_input > ul > li.choice:hover, |
|||
.page .tag_input > ul > li.choice.selected { |
|||
background: linear-gradient( |
|||
180deg, |
|||
#5b9bd1 0%, |
|||
#406db8 100% |
|||
); |
|||
} |
|||
|
|||
.page .tag_input .select { |
|||
display: none; |
|||
} |
|||
.page .tag_input:hover .select { display: inline-block; } |
|||
|
|||
.page .tag_input li input { |
|||
background: 0; |
|||
border: 0; |
|||
color: #fff; |
|||
outline-width: 0; |
|||
padding: 0; |
|||
min-width: 2px; |
|||
} |
|||
.page .tag_input li:first-child input { |
|||
padding-left: 2px; |
|||
min-width: 0; |
|||
} |
|||
|
|||
.page .tag_input li:not(.choice) span { |
|||
white-space: pre; |
|||
position: absolute; |
|||
top: -9999px; |
|||
} |
|||
|
|||
.page .tag_input .delete { |
|||
display: none; |
|||
height: 10px; |
|||
width: 16px; |
|||
position: absolute; |
|||
margin: -9px 0 0 -16px; |
|||
border-radius: 30px 30px 0 0; |
|||
cursor: pointer; |
|||
background: url('../images/icon.delete.png') no-repeat center 2px, linear-gradient( |
|||
180deg, |
|||
#5b9bd1 0%, |
|||
#5b9bd1 100% |
|||
); |
|||
background-size: 65%; |
|||
} |
|||
.page .tag_input .choice:hover .delete, |
|||
.page .tag_input .choice.selected .delete { display: inline-block; } |
|||
.page .tag_input .choice .delete:hover { |
|||
height: 14px; |
|||
margin-top: -13px; |
|||
} |
|||
|
|||
.page .combined_table .head { |
|||
margin: 0 0 0 60px; |
|||
} |
|||
.page .disabled .head { display: none; } |
|||
.page .combined_table .head abbr { |
|||
display: inline-block; |
|||
font-weight: bold; |
|||
border-bottom: 1px dotted #fff; |
|||
line-height: 140%; |
|||
cursor: help; |
|||
} |
|||
.page .combined_table .head abbr:first-child { |
|||
display: none; |
|||
} |
|||
.page .combined_table .head abbr.host { margin-right: 120px; } |
|||
.page .combined_table input.host { width: 140px; } |
|||
.page .section_newznab .combined_table .head abbr.host { margin-right: 180px; } |
|||
.page .section_newznab .combined_table input.host { width: 200px; } |
|||
|
|||
.page .combined_table .head abbr.name { margin-right: 57px; } |
|||
.page .combined_table input.name { width: 120px; } |
|||
.page .combined_table .head abbr.api_key { margin-right: 75px; } |
|||
|
|||
.page .combined_table .head abbr.pass_key { margin-right: 71px; } |
|||
.page .combined_table input.pass_key { width: 113px; } |
|||
|
|||
.page .section_newznab .combined_table .head abbr.api_key { margin-right: 170px; } |
|||
.page .section_newznab .combined_table input.api_key { width: 203px; } |
|||
|
|||
.page .combined_table .head abbr.extra_score { |
|||
margin-right: 15px; |
|||
display: none; |
|||
} |
|||
.page .combined_table input.extra_score { |
|||
width: 75px; |
|||
display: none; |
|||
} |
|||
.page.show_advanced .combined_table .head .extra_score, |
|||
.page.show_advanced .combined_table .extra_score { |
|||
display: inline-block; |
|||
} |
|||
|
|||
.page .combined_table .head abbr.custom_tag { |
|||
margin-right: 15px; |
|||
display: none; |
|||
} |
|||
.page .combined_table input.custom_tag { |
|||
width: 140px; |
|||
display: none; |
|||
} |
|||
.page.show_advanced .combined_table .head .custom_tag, |
|||
.page.show_advanced .combined_table .custom_tag { |
|||
display: inline-block; |
|||
} |
|||
|
|||
|
|||
.page .combined_table .seed_ratio, |
|||
.page .combined_table .seed_time { |
|||
width: 70px; |
|||
text-align: center; |
|||
margin-left: 10px; |
|||
} |
|||
.page .combined_table .seed_time { |
|||
margin-right: 10px; |
|||
} |
|||
|
|||
.page .combined_table .ctrlHolder { |
|||
padding-top: 2px; |
|||
padding-bottom: 3px; |
|||
} |
|||
.page .combined_table .ctrlHolder.hide { display: none; } |
|||
|
|||
.page .combined_table .ctrlHolder > * { |
|||
margin: 0 10px 0 0; |
|||
} |
|||
.page .combined_table .ctrlHolder > .check { |
|||
margin-top: 6px; |
|||
} |
|||
|
|||
.page .combined_table .ctrlHolder .delete { |
|||
display: none; |
|||
width: 22px; |
|||
height: 22px; |
|||
line-height: 22px; |
|||
text-align: center; |
|||
vertical-align: middle; |
|||
color: #fe3d3d; |
|||
} |
|||
.page .combined_table .ctrlHolder:hover .delete { |
|||
display: inline-block; |
|||
} |
|||
|
|||
.page .combined_table .ctrlHolder.is_empty .delete, .page.settings .combined_table .ctrlHolder.is_empty .check { |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.page .tab_about .usenet { |
|||
padding: 20px 30px 0; |
|||
font-size: 1.5em; |
|||
line-height: 1.3em; |
|||
} |
|||
|
|||
.page .tab_about .usenet a { |
|||
padding: 0 5px; |
|||
} |
|||
|
|||
.page .tab_about .usenet ul { |
|||
float: left; |
|||
width: 50%; |
|||
margin: 10px 0; |
|||
padding: 0; |
|||
} |
|||
|
|||
.page .tab_about .usenet li { |
|||
background: url('../images/icon.check.png') no-repeat left center; |
|||
padding: 0 0 0 25px; |
|||
} |
|||
|
|||
.page .tab_about .donate { |
|||
float: left; |
|||
width: 42%; |
|||
text-align: center; |
|||
font-size: 17px; |
|||
padding: 0 0 0 4%; |
|||
margin: 20px 0 0; |
|||
border-left: 1px solid #333; |
|||
box-shadow: -1px 0 0 rgba(255,255,255, 0.15); |
|||
} |
|||
.page .tab_about .donate form { |
|||
padding: 10px 0 0; |
|||
} |
|||
|
|||
.page .tab_about .info { |
|||
padding: 20px 30px; |
|||
margin: 0; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
.page .tab_about .info dt { |
|||
clear: both; |
|||
float: left; |
|||
width: 17%; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
.page .tab_about .info dd { |
|||
float: right; |
|||
width: 80%; |
|||
padding: 0; |
|||
margin: 0; |
|||
font-style: italic; |
|||
} |
|||
.page .tab_about .info dd.version { cursor: pointer; } |
|||
|
|||
.page .tab_about .group_actions > div { |
|||
padding: 30px; |
|||
text-align: center; |
|||
} |
|||
|
|||
.page .tab_about .group_actions a { |
|||
margin: 0 10px; |
|||
font-size: 20px; |
|||
} |
|||
|
|||
.group_userscript { |
|||
background: 5px 75px no-repeat; |
|||
min-height: 460px; |
|||
font-size: 20px; |
|||
font-weight: normal; |
|||
} |
|||
|
|||
.settings .group_userscript { |
|||
background-position: center 120px; |
|||
background-size: auto 70%; |
|||
min-height: 360px; |
|||
} |
|||
|
|||
.group_userscript h2 .hint { |
|||
display: block; |
|||
margin: 0 !important; |
|||
} |
|||
|
|||
.group_userscript .userscript { |
|||
float: left; |
|||
margin: 14px 0 0 25px; |
|||
height: 36px; |
|||
line-height: 25px; |
|||
} |
|||
|
|||
.group_userscript .or { |
|||
float: left; |
|||
margin: 20px -10px 0 10px; |
|||
} |
|||
|
|||
.group_userscript .bookmarklet { |
|||
display: block; |
|||
float: left; |
|||
padding: 20px 15px 0 25px; |
|||
border-radius: 5px; |
|||
} |
|||
|
|||
.group_userscript .bookmarklet span { |
|||
margin-left: 10px; |
|||
display: inline-block; |
|||
} |
|||
|
|||
.active .group_imdb_automation:not(.disabled) { |
|||
background: url('../images/imdb_watchlist.png') no-repeat right 50px; |
|||
min-height: 210px; |
|||
} |
|||
|
|||
|
|||
.tooltip { |
|||
position: absolute; |
|||
right: 0; |
|||
width: 30px; |
|||
height: 30px; |
|||
} |
|||
|
|||
.tooltip > a { |
|||
opacity: .3; |
|||
font-size: 11px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.tooltip:hover > a { |
|||
opacity: 1; |
|||
} |
|||
|
|||
.tooltip div { |
|||
background: #FFF; |
|||
color: #000; |
|||
padding: 10px; |
|||
width: 380px; |
|||
z-index: 200; |
|||
position: absolute; |
|||
transition: all .4s cubic-bezier(0.9,0,0.1,1); |
|||
margin-top: 40px; |
|||
right: 0; |
|||
opacity: 0; |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.tooltip.shown div { |
|||
margin-top: 10px; |
|||
opacity: 1; |
|||
visibility: visible; |
|||
} |
|||
|
|||
.tooltip div a { |
|||
color: #5b9bd1; |
|||
} |
|||
@ -1,139 +0,0 @@ |
|||
/* ------------------------------------------------------------------------------ |
|||
|
|||
UNI-FORM DEFAULT by DRAGAN BABIC (v2) | Wed, 31 Mar 10 |
|||
|
|||
------------------------------------------------------------------------------ |
|||
|
|||
Copyright (c) 2010, Dragan Babic |
|||
|
|||
Permission is hereby granted, free of charge, to any person |
|||
obtaining a copy of this software and associated documentation |
|||
files (the "Software"), to deal in the Software without |
|||
restriction, including without limitation the rights to use, |
|||
copy, modify, merge, publish, distribute, sublicense, and/or sell |
|||
copies of the Software, and to permit persons to whom the |
|||
Software is furnished to do so, subject to the following |
|||
conditions: |
|||
|
|||
The above copyright notice and this permission notice shall be |
|||
included in all copies or substantial portions of the Software. |
|||
|
|||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, |
|||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES |
|||
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND |
|||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT |
|||
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, |
|||
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING |
|||
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR |
|||
OTHER DEALINGS IN THE SOFTWARE. |
|||
|
|||
------------------------------------------------------------------------------ */ |
|||
|
|||
.uniForm{} |
|||
|
|||
.uniForm legend{ font-weight: bold; font-size: 100%; margin: 0; padding: 1.5em 0; } |
|||
|
|||
.uniForm .ctrlHolder{ padding: 1em; border-bottom: 1px solid #efefef; } |
|||
.uniForm .ctrlHolder.focused{ background: #fffcdf; } |
|||
|
|||
.uniForm .inlineLabels .noLabel{} |
|||
|
|||
.uniForm .buttonHolder{ background: #efefef; text-align: right; margin: 1.5em 0 0 0; padding: 1.5em; |
|||
/* CSS3 */ |
|||
border-radius: 4px; |
|||
} |
|||
.uniForm .buttonHolder .primaryAction{ padding: 10px 22px; line-height: 1; background: #254a86; border: 1px solid #163362; font-size: 12px; font-weight: bold; color: #fff; |
|||
/* CSS3 */ |
|||
border-radius: 4px; |
|||
box-shadow: 1px 1px 0 #fff; |
|||
text-shadow: -1px -1px 0 rgba(0,0,0,.25); |
|||
} |
|||
.uniForm .buttonHolder .primaryAction:active{ position: relative; top: 1px; } |
|||
.uniForm .secondaryAction { text-align: left; } |
|||
.uniForm button.secondaryAction { background: transparent; border: none; color: #777; margin: 1.25em 0 0 0; padding: 0; } |
|||
|
|||
.uniForm .inlineLabels label em, |
|||
.uniForm .inlineLabels .label em{ font-style: normal; font-weight: bold; } |
|||
.uniForm label small{ font-size: .75em; color: #777; } |
|||
|
|||
.uniForm .textInput, |
|||
.uniForm textarea { padding: 4px 2px; border: 1px solid #aaa; background: #fff; } |
|||
.uniForm textarea { height: 12em; } |
|||
.uniForm select {} |
|||
.uniForm .fileUpload {} |
|||
|
|||
.uniForm ul{} |
|||
.uniForm li{} |
|||
.uniForm ul li label{ font-size: .85em; } |
|||
|
|||
.uniForm .small {} |
|||
.uniForm .medium{} |
|||
.uniForm .large {} /* Large is default and should match the value you set for .textInput, textarea or select */ |
|||
.uniForm .auto {} |
|||
.uniForm .small, |
|||
.uniForm .medium, |
|||
.uniForm .auto{} |
|||
|
|||
/* Get rid of the 'glow' effect in WebKit, optional */ |
|||
.uniForm .ctrlHolder .textInput:focus, |
|||
.uniForm .ctrlHolder textarea:focus{ outline: none; } |
|||
|
|||
.uniForm .formHint { font-size: .85em; color: #777; } |
|||
.uniForm .inlineLabels .formHint { padding-top: .5em; } |
|||
.uniForm .ctrlHolder.focused .formHint{ color: #333; } |
|||
|
|||
/* ----------------------------------------------------------------------------- */ |
|||
/* ############################### Messages #################################### */ |
|||
/* ----------------------------------------------------------------------------- */ |
|||
|
|||
/* Error message at the top of the form */ |
|||
.uniForm #errorMsg{ background: #ffdfdf; border: 1px solid #f3afb5; margin: 0 0 1.5em 0; padding: 0 1.5em; |
|||
/* CSS3 */ |
|||
border-radius: 4px; |
|||
-webkit-border-radius: 4px; |
|||
-moz-border-radius: 4px; |
|||
|
|||
} |
|||
.uniForm #errorMsg h3{} /* Feel free to use a heading level suitable to your page structure */ |
|||
.uniForm #errorMsg ol{ margin: 0 0 1.5em 0; padding: 0; } |
|||
.uniForm #errorMsg ol li{ margin: 0 0 3px 1.5em; padding: 7px; background: #f6bec1; position: relative; font-size: .85em; |
|||
/* CSS3 */ |
|||
border-radius: 4px; |
|||
-webkit-border-radius: 4px; |
|||
-moz-border-radius: 4px; |
|||
|
|||
} |
|||
|
|||
.uniForm .ctrlHolder.error, |
|||
.uniForm .ctrlHolder.focused.error{ background: #ffdfdf; border: 1px solid #f3afb5; |
|||
/* CSS3 */ |
|||
border-radius: 4px; |
|||
-webkit-border-radius: 4px; |
|||
-moz-border-radius: 4px; |
|||
|
|||
} |
|||
.uniForm .ctrlHolder.error input.error, |
|||
.uniForm .ctrlHolder.error select.error, |
|||
.uniForm .ctrlHolder.error textarea.error{ color: #af4c4c; margin: 0 0 6px 0; padding: 4px; } |
|||
|
|||
/* Success messages at the top of the form */ |
|||
.uniForm #okMsg{ background: #c8ffbf; border: 1px solid #a2ef95; margin: 0 0 1.5em 0; padding: 0 1.5em; text-align: center; |
|||
/* CSS3 */ |
|||
border-radius: 4px; |
|||
-webkit-border-radius: 4px; |
|||
-moz-border-radius: 4px; |
|||
|
|||
} |
|||
.uniForm #OKMsg p{ margin: 0; } |
|||
|
|||
/* ----------------------------------------------------------------------------- */ |
|||
/* ############################### Columns ##################################### */ |
|||
/* ----------------------------------------------------------------------------- */ |
|||
|
|||
.uniForm .col{} |
|||
.uniForm .col.first{} |
|||
.uniForm .col.last{} |
|||
.uniForm .col{ margin-bottom: 1.5em; } |
|||
/* Use .first and .last classes to control the layout/spacing of your columns */ |
|||
.uniForm .col.first{ width: 49%; float: left; clear: none; } |
|||
.uniForm .col.last { width: 49%; float: right; clear: none; margin-right: 0; } |
|||
@ -1,154 +0,0 @@ |
|||
/* ------------------------------------------------------------------------------ |
|||
|
|||
Copyright (c) 2010, Dragan Babic |
|||
|
|||
Permission is hereby granted, free of charge, to any person |
|||
obtaining a copy of this software and associated documentation |
|||
files (the "Software"), to deal in the Software without |
|||
restriction, including without limitation the rights to use, |
|||
copy, modify, merge, publish, distribute, sublicense, and/or sell |
|||
copies of the Software, and to permit persons to whom the |
|||
Software is furnished to do so, subject to the following |
|||
conditions: |
|||
|
|||
The above copyright notice and this permission notice shall be |
|||
included in all copies or substantial portions of the Software. |
|||
|
|||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, |
|||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES |
|||
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND |
|||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT |
|||
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, |
|||
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING |
|||
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR |
|||
OTHER DEALINGS IN THE SOFTWARE. |
|||
|
|||
------------------------------------------------------------------------------ */ |
|||
/* ############################# GENERALS ################################### */ |
|||
/* ------------------------------------------------------------------------------ */ |
|||
|
|||
.uniForm{ margin: 0; padding: 0; position: relative; z-index: 1; } /* reset stuff */ |
|||
|
|||
/* Some generals and more resets */ |
|||
.uniForm fieldset{ border: none; margin: 0; padding: 0; } |
|||
.uniForm fieldset legend{ margin: 0; padding: 0; } |
|||
|
|||
/* This are the main units that contain form elements */ |
|||
.uniForm .ctrlHolder, |
|||
.uniForm .buttonHolder{ margin: 0; padding: 0; clear: both; } |
|||
|
|||
/* Clear all floats */ |
|||
.uniForm:after, |
|||
.uniForm .buttonHolder:after, |
|||
.uniForm .ctrlHolder:after, |
|||
.uniForm .ctrlHolder .multiField:after, |
|||
.uniForm .inlineLabel:after{ content: "."; display: block; height: 0; line-height: 0; font-size: 0; clear: both; min-height: 0; visibility: hidden; } |
|||
|
|||
.uniForm label, |
|||
.uniForm button{ cursor: pointer; } |
|||
|
|||
/* ------------------------------------------------------------------------------ */ |
|||
/* ########################## DEFAULT LAYOUT ################################ */ |
|||
/* ------------------------------------------------------------------------------ */ |
|||
/* Styles for form controls where labels are above the input elements */ |
|||
/* ------------------------------------------------------------------------------ */ |
|||
|
|||
.uniForm label, |
|||
.uniForm .label{ display: block; float: none; margin: 0 0 .5em 0; padding: 0; line-height: 100%; width: auto; } |
|||
|
|||
/* Float the input elements */ |
|||
.uniForm .textInput, |
|||
.uniForm .fileUpload, |
|||
.uniForm .selectInput, |
|||
.uniForm select, |
|||
.uniForm textarea{ float: left; width: 53%; margin: 0; } |
|||
|
|||
/* Postition the hints */ |
|||
.uniForm .formHint{ float: right; width: 43%; margin: 0; clear: none; } |
|||
|
|||
/* Position the elements inside combo boxes (multiple inputs/selects/checkboxes/radio buttons per unit) */ |
|||
.uniForm ul{ float: left; width: 53%; margin: 0; padding: 0; } |
|||
.uniForm ul li{ margin: 0 0 .5em 0; list-style: none; } |
|||
.uniForm ul li label{ margin: 0; float: none; display: block; overflow: visible; } |
|||
/* Alternate layout */ |
|||
.uniForm ul.alternate li{ float: left; width: 30%; margin-right: 3%; } |
|||
.uniForm ul.alternate li label{ float: none; display: block; width: 98%; } |
|||
.uniForm ul .textInput, |
|||
.uniForm ul .selectInput, |
|||
.uniForm ul select, |
|||
.uniForm ul.alternate .textInput, |
|||
.uniForm ul.alternate .selectInput, |
|||
.uniForm ul.alternate select{ width: 98%; margin-top: .5em; display: block; float: none; } |
|||
|
|||
/* Required fields asterisk styling */ |
|||
.uniForm label em, |
|||
.uniForm .label em{ float: left; width: 1em; margin: 0 0 0 -1em; } |
|||
|
|||
/* ------------------------------------------------------------------------------ */ |
|||
/* ######################### ALTERNATE LAYOUT ############################### */ |
|||
/* ------------------------------------------------------------------------------ */ |
|||
/* Styles for form controls where labels are in line with the input elements */ |
|||
/* Set the class of the parent (preferably to a fieldset) to .inlineLabels */ |
|||
/* ------------------------------------------------------------------------------ */ |
|||
|
|||
.uniForm .inlineLabels label, |
|||
.uniForm .inlineLabels .label{ float: left; margin: .3em 2% 0 0; padding: 0; line-height: 1; position: relative; width: 32%; } |
|||
|
|||
/* Float the input elements */ |
|||
.uniForm .inlineLabels .textInput, |
|||
.uniForm .inlineLabels .fileUpload, |
|||
.uniForm .inlineLabels .selectInput, |
|||
.uniForm .inlineLabels select, |
|||
.uniForm .inlineLabels textarea{ float: left; width: 64%; } |
|||
|
|||
/* Postition the hints */ |
|||
.uniForm .inlineLabels .formHint{ clear: both; float: none; width: auto; margin-left: 34%; position: static; } |
|||
|
|||
/* Position the elements inside combo boxes (multiple inputs/selects/checkboxes/radio buttons per unit) */ |
|||
.uniForm .inlineLabels ul{ float: left; width: 66%; } |
|||
.uniForm .inlineLabels ul li{ margin: .5em 0; } |
|||
.uniForm .inlineLabels ul li label{ float: none; display: block; width: 100%; } |
|||
/* Alternate layout */ |
|||
.uniForm .inlineLabels ul.alternate li{ margin-right: 3%; margin-top: .25em; } |
|||
.uniForm .inlineLabels ul li label .textInput, |
|||
.uniForm .inlineLabels ul li label textarea, |
|||
.uniForm .inlineLabels ul li label select{ float: none; display: block; width: 98%; } |
|||
|
|||
/* Required fields asterisk styling */ |
|||
.uniForm .inlineLabels label em, |
|||
.uniForm .inlineLabels .label em{ display: block; float: none; margin: 0; position: absolute; right: 0; } |
|||
|
|||
/* ----------------------------------------------------------------------------- */ |
|||
/* ########################### Additional Stuff ################################ */ |
|||
/* ----------------------------------------------------------------------------- */ |
|||
|
|||
/* Generals */ |
|||
.uniForm legend{ color: inherit; } |
|||
|
|||
.uniForm .secondaryAction{ float: left; } |
|||
|
|||
/* .inlineLabel is used for inputs within labels - checkboxes and radio buttons */ |
|||
.uniForm .inlineLabel input, |
|||
.uniForm .inlineLabels .inlineLabel input, |
|||
.uniForm .blockLabels .inlineLabel input, |
|||
/* class .inlineLabel is depreciated */ |
|||
.uniForm label input{ float: none; display: inline; margin: 0; padding: 0; border: none; } |
|||
|
|||
.uniForm .buttonHolder .inlineLabel, |
|||
.uniForm .buttonHolder label{ float: left; margin: .5em 0 0 0; width: auto; max-width: 60%; text-align: left; } |
|||
|
|||
/* When you don't want to use a label */ |
|||
.uniForm .inlineLabels .noLabel ul{ margin-left: 34%; /* Match to width of label + gap to field */ } |
|||
|
|||
/* Classes for control of the widths of the fields */ |
|||
.uniForm .small { width: 30% !important; } |
|||
.uniForm .medium{ width: 45% !important; } |
|||
.uniForm .large { } /* Large is default and should match the value you set for .textInput, textarea or select */ |
|||
.uniForm .auto { width: auto !important; } |
|||
.uniForm .small, |
|||
.uniForm .medium, |
|||
.uniForm .auto{ margin-right: 4px; } |
|||
|
|||
/* Columns */ |
|||
.uniForm .col{ float: left; } |
|||
.uniForm .col{ width: 50%; } |
|||
Loading…
Reference in new issue