| /* INTRODUCTION |
| /* INTRODUCTION |
| /* This is the standard Elkarte default theme. |
| /* This is the standard Elkarte default theme. |
| /* This file contains essential layout code only. |
| /* This file contains essential layout code only. |
| /* Colors, gradients, images, etc. are in _variantname.css. |
| /* Colors, gradients, images, etc. are in _variantname.css. |
| /* |
| /* |
| /* All theme variants depend on this layout code for stability. |
| /* All theme variants depend on this layout code for stability. |
| /* It is better to copy code to a variant CSS file for testing. |
| /* It is better to copy code to a variant CSS file for testing. |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| /* $CONTENTS - still a bit WIP. @todo |
| /* $CONTENTS - still a bit WIP. @todo |
| /* |
| /* |
| /* $GENERAL.............Global resets, clearfixes, etc. |
| /* $GENERAL.............Global resets, clearfixes, etc. |
| /* $COMMON..............Common classes to drive you bonkers. |
| /* $COMMON..............Common classes to drive you bonkers. |
| /* $BBC.................Quotes, code blocks, BBC styles. |
| /* $BBC.................Quotes, code blocks, BBC styles. |
| /* $AJAX................The "loading" bar (quick edit, etc). |
| /* $AJAX................The "loading" bar (quick edit, etc). |
| /* |
| /* |
| /* $MAIN................Forum header, wrapper, and footer. |
| /* $MAIN................Forum header, wrapper, and footer. |
| /* $MENUS...............Main and secondary menus. |
| /* $MENUS...............Main and secondary menus. |
| /* $LINKTREE............The breadcrumbs. |
| /* $LINKTREE............The breadcrumbs. |
| /* $BUTTONS.............Most button strips. |
| /* $BUTTONS.............Most button strips. |
| /* $PAGELINKS...........Page navigation links. |
| /* $PAGELINKS...........Page navigation links. |
| /* |
| /* |
| /* $TABLES..............Generic tables (error log, etc.). |
| /* $TABLES..............Generic tables (error log, etc.). |
| /* $SETTINGS............Generic lists for settings pages. |
| /* $SETTINGS............Generic lists for settings pages. |
| /* $BOARDS..............Board index, sub-boards, and message index. |
| /* $BOARDS..............Board index, sub-boards, and message index. |
| /* |
| /* |
| /* $TOPICS..............The display template (topic view), including send. |
| /* $TOPICS..............The display template (topic view), including send. |
| /* $EDITOR..............Main editor (posts, events, polls) and topic summary. |
| /* $EDITOR..............Main editor (posts, events, polls) and topic summary. |
| /* $MODERATE............Move topic, split topic, merge topic. |
| /* $MODERATE............Move topic, split topic, merge topic. |
| /* |
| /* |
| /* $PROFILE.............The profile areas. |
| /* $PROFILE.............The profile areas. |
| /* $PERSONAL............The personal messages (PM) areas. |
| /* $PERSONAL............The personal messages (PM) areas. |
| /* $CALENDAR............Wombats (and the calendar). |
| /* $CALENDAR............Wombats (and the calendar). |
| /* $STATISTICS..........The statistics centre. |
| /* $STATISTICS..........The statistics centre. |
| /* |
| /* |
| /* $HELP................Help pages, help icons and pop-ups, tooltips. |
| /* $HELP................Help pages, help icons and pop-ups, tooltips. |
| /* $SEARCH..............Search pages, including memberlist search. |
| /* $SEARCH..............Search pages, including memberlist search. |
| /* $MEMBERLIST..........The memberlist table. |
| /* $MEMBERLIST..........The memberlist table. |
| /* $LOGIN...............Login and registration, maintenance mode. |
| /* $LOGIN...............Login and registration, maintenance mode. |
| /* |
| /* |
| /* $BOXES...............Message boxes (error, warning, info, etc). |
| /* $BOXES...............Message boxes (error, warning, info, etc). |
| /* $PROGRESS............Nifty progress bars. |
| /* $PROGRESS............Nifty progress bars. |
| /* $MEDIA...............Experimental media queries. |
| /* $MEDIA...............Experimental media queries. |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| |
| |
| /* $GENERAL */ |
| /* $GENERAL */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| /* Put this here to make it easy to find. */ |
| /* Put this here to make it easy to find. */ |
| /* Width control for top bar, header, main content and footer content. */ |
| /* Width control for top bar, header, main content and footer content. */ |
| .wrapper { |
| .wrapper { |
| margin: 0 auto; |
| margin: 0 auto; |
| /* Next controls forum width, when it is not set in admin. */ |
| /* Next controls forum width, when it is not set in admin. */ |
| width: 90%; |
| width: 90%; |
| /* Next limits maximum width on wide screens. */ |
| /* Next limits maximum width on wide screens. */ |
| /* Sized in em, since some people require larger text. */ |
| /* Sized in em, since some people require larger text. */ |
| /* For ease of reading, content really should not be too wide. */ |
| /* For ease of reading, content really should not be too wide. */ |
| max-width: 90em; |
| max-width: 90em; |
| /* Next is just for some testing. */ |
| /* Next is just for some testing. */ |
| /*min-width: 100%;*/ |
| /*min-width: 100%;*/ |
| } |
| } |
| |
| |
| /* Cursor declared here.Should not be required anywhere else. */ |
| /* Cursor declared here.Should not be required anywhere else. */ |
| a:hover, a.new_win:hover { |
| a:hover, a.new_win:hover { |
| cursor: pointer; |
| cursor: pointer; |
| } |
| } |
| |
| |
| body { |
| body { |
| margin: 0; |
| margin: 0; |
| padding: 0 0 0 0; |
| padding: 0 0 0 0; |
| /* Set a font-size that will look the same in all browsers. */ |
| /* Set a font-size that will look the same in all browsers. */ |
| /* Start with the best Vista/W7 font, then Mac, Linux, then old fallbacks. */ |
| /* Start with the best Vista/W7 font, then Mac, Linux, then old fallbacks. */ |
| /* this results in a base 14pt and pt to em translation approx as so |
| /* this results in a base 14pt and pt to em translation approx as so |
| /* 9 - .643, 10 - .714, 11 - .786, 12 - .857, 13 - .929, 14 - 1, 15 - 1.071, 16 - 1.143 |
| /* 9 - .643, 10 - .714, 11 - .786, 12 - .857, 13 - .929, 14 - 1, 15 - 1.071, 16 - 1.143 |
| /* 17 - 1.214, 18 - 1.286, 19 - 1.357, 20 - 1.429, 21 - 1.5, 22 - 1.571, 23 - 1.643 |
| /* 17 - 1.214, 18 - 1.286, 19 - 1.357, 20 - 1.429, 21 - 1.5, 22 - 1.571, 23 - 1.643 |
| /* 24 - 1.714, 25 - 1.786, 26 - 1.857, 27 - 1.929, 28 - 2, 29 - 2.071 */ |
| /* 24 - 1.714, 25 - 1.786, 26 - 1.857, 27 - 1.929, 28 - 2, 29 - 2.071 */ |
| font: 87.5%/150% "Segoe UI", "Helvetica Neue", "Liberation Sans", "Nimbus Sans L", "Trebuchet MS", Arial, sans-serif; |
| font: 87.5%/150% "Segoe UI", "Helvetica Neue", "Liberation Sans", "Nimbus Sans L", "Trebuchet MS", Arial, sans-serif; |
| text-rendering: optimizeLegibility; |
| text-rendering: optimizeLegibility; |
| } |
| } |
| |
| |
| /* Tables should show empty cells. */ |
| /* Tables should show empty cells. */ |
| table { |
| table { |
| empty-cells: show; |
| empty-cells: show; |
| } |
| } |
| |
| |
| /* Global box sizing, for stabilising fluid layouts. */ |
| /* Global box sizing, for stabilising fluid layouts. */ |
| /* IMPORTANT: Do not declare div here (borks jQuery menus). */ |
| /* IMPORTANT: Do not declare div here (borks jQuery menus). */ |
| /* Default most elements to zero padding and margin. */ |
| /* Default most elements to zero padding and margin. */ |
| /* Declare these separately to divs to avoid padding and margin problems. */ |
| /* Declare these separately to divs to avoid padding and margin problems. */ |
| h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dd ,dt, |
| h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dd ,dt, |
| p, fieldset, form, input, button, select, .input_text, textarea, .editor { |
| p, fieldset, form, input, button, select, .input_text, textarea, .editor { |
| -moz-box-sizing: border-box; |
| -moz-box-sizing: border-box; |
| -webkit-box-sizing: border-box; |
| -webkit-box-sizing: border-box; |
| box-sizing: border-box; |
| box-sizing: border-box; |
| padding: 0; |
| padding: 0; |
| margin: 0; |
| margin: 0; |
| font-weight: normal; |
| font-weight: normal; |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| /* Declarations for specific elements. @todo - Maybe simplify - test. */ |
| /* Declarations for specific elements. @todo - Maybe simplify - test. */ |
| .wrapper, div.windowbg, div.windowbg2, |
| .wrapper, div.windowbg, div.windowbg2, |
| .roundframe, .description, .information, .successbox, .warningbox, |
| .roundframe, .description, .information, .successbox, .warningbox, |
| .category_header, .generic_list_wrapper, .submitbutton, |
| .category_header, .generic_list_wrapper, .submitbutton, |
| .grid8, .grid17, .grid20, .grid25, .grid30, .grid33, .grid50, #description_board .generalinfo { |
| .grid8, .grid17, .grid20, .grid25, .grid30, .grid33, .grid50, #description_board .generalinfo { |
| -moz-box-sizing: border-box; |
| -moz-box-sizing: border-box; |
| -webkit-box-sizing: border-box; |
| -webkit-box-sizing: border-box; |
| box-sizing: border-box; |
| box-sizing: border-box; |
| } |
| } |
| |
| |
| /* Collection of pseudo element clearfixes. */ |
| /* Collection of pseudo element clearfixes. */ |
| .category_header:after, .wrapper:after, |
| .category_header:after, .wrapper:after, |
| #main_content_section:after, #main_container:after, |
| #main_content_section:after, #main_container:after, |
| .attachment_name:after, .editor_wrapper:after { |
| .attachment_name:after, .editor_wrapper:after { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| content: ""; |
| content: ""; |
| } |
| } |
| .quickbuttons:after { |
| .quickbuttons:after { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| content: ""; |
| content: ""; |
| } |
| } |
| /* @todo */ |
| /* @todo */ |
| .statistics>.flow_hidden>.category_header:after { |
| .statistics>.flow_hidden>.category_header:after { |
| display: none; |
| display: none; |
| } |
| } |
| /* Set list-style to none by default. Best in most places.*/ |
| /* Set list-style to none by default. Best in most places.*/ |
| ul, ol { |
| ul, ol { |
| list-style: none; |
| list-style: none; |
| } |
| } |
| |
| |
| /* No image should have a border when linked. */ |
| /* No image should have a border when linked. */ |
| /* @todo - I'm sure this would be better done with specific classes |
| /* @todo - I'm sure this would be better done with specific classes |
| /* rather than global tag name. */ |
| /* rather than global tag name. */ |
| a img { |
| a img { |
| border: 0; |
| border: 0; |
| } |
| } |
| |
| |
| /* Style the different types of inputs to be uniform for all browsers. */ |
| /* Style the different types of inputs to be uniform for all browsers. */ |
| |
| |
| /* NOTE: This does require some browser-specific code to get good results. */ |
| /* NOTE: This does require some browser-specific code to get good results. */ |
| /* Paddings on all types of inputs are set here. */ |
| /* Paddings on all types of inputs are set here. */ |
| /* If specific styling is wanted for some inputs, be aware of browser |
| /* If specific styling is wanted for some inputs, be aware of browser |
| /* differences when adding custom padding, or it will drive you mental. */ |
| /* differences when adding custom padding, or it will drive you mental. */ |
| |
| |
| /* ALSO: This is still not quite pixel perfect everywhere for all browsers, |
| /* ALSO: This is still not quite pixel perfect everywhere for all browsers, |
| /* in particular not for Internet Explorer. They can live with it. */ |
| /* in particular not for Internet Explorer. They can live with it. */ |
| /* |
| /* |
| .button_submit - covers input[type=submit], input[type=button], |
| .button_submit - covers input[type=submit], input[type=button], |
| button[type=submit] and button[type=button] |
| button[type=submit] and button[type=button] |
| .linkbutton - covers links, to make them look like a submit button. |
| .linkbutton - covers links, to make them look like a submit button. |
| .button_reset - covers input[type=reset] and button[type=reset] |
| .button_reset - covers input[type=reset] and button[type=reset] |
| .input_check - covers input[type=checkbox] |
| .input_check - covers input[type=checkbox] |
| .input_radio - covers input[type=radio] |
| .input_radio - covers input[type=radio] |
| .input_text - covers input[type=text] |
| .input_text - covers input[type=text] |
| .input_file - covers input[type=file] |
| .input_file - covers input[type=file] |
| */ |
| */ |
| input, button, select, textarea, .editor { |
| input, button, select, textarea, .editor { |
| font: 87.5%/150% "Segoe UI", "Helvetica Neue", "Liberation Sans", "Nimbus Sans L", "Trebuchet MS", Arial, sans-serif; |
| font: 87.5%/150% "Segoe UI", "Helvetica Neue", "Liberation Sans", "Nimbus Sans L", "Trebuchet MS", Arial, sans-serif; |
| } |
| } |
| /* The following is necessary. */ |
| /* The following is necessary. */ |
| textarea, .editor { |
| textarea, .editor { |
| border-radius: 4px; |
| border-radius: 4px; |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| .sceditor-container { |
| .sceditor-container { |
| margin: 0 0 6px 0; |
| margin: 0 0 6px 0; |
| } |
| } |
| /* Gecko-specific reset - makes buttons consistent with other browsers. */ |
| /* Gecko-specific reset - makes buttons consistent with other browsers. */ |
| /* Yes, rotten browser-specific code. It will save some dramas though. */ |
| /* Yes, rotten browser-specific code. It will save some dramas though. */ |
| button::-moz-focus-inner, input[type='button']::-moz-focus-inner, |
| button::-moz-focus-inner, input[type='button']::-moz-focus-inner, |
| input[type='reset']::-moz-focus-inner, input[type='submit']::-moz-focus-inner, |
| input[type='reset']::-moz-focus-inner, input[type='submit']::-moz-focus-inner, |
| select::-moz-focus-inner { |
| select::-moz-focus-inner { |
| border: 0; |
| border: 0; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| |
| |
| /* Declarations for inputs, selects and buttons */ |
| /* Declarations for inputs, selects and buttons */ |
| input, .input_text, button, select { |
| input, .input_text, button, select { |
| padding: 0 6px; |
| padding: 0 6px; |
| min-height: 2em; |
| min-height: 2em; |
| max-height: 2em; |
| max-height: 2em; |
| height: 2em; |
| height: 2em; |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| |
| select { |
| |
| padding: 0 6px 0 2px; |
| |
| } |
| .input_text { |
| .input_text { |
| font-size: .876em; |
| font-size: .876em; |
| } |
| } |
| select option { |
| select option { |
| padding: 0 4px; |
| padding: 0 4px; |
| } |
| } |
| /* Special form elements need to be addressed */ |
| /* Special form elements need to be addressed */ |
| select#cat, select#suggestions, select#file , input[type="file"] { |
| select#cat, select#suggestions, select#file , input[type="file"] { |
| height: auto; |
| height: auto; |
| max-height: none; |
| max-height: none; |
| } |
| } |
| input[type="number"] { |
| input[type="number"] { |
| padding: 0 0 0 6px; |
| padding: 0 0 0 6px; |
| } |
| } |
| /* No borders around checkboxes or radio buttons, and middle aligned. */ |
| /* No borders around checkboxes or radio buttons, and middle aligned. */ |
| .input_check, .input_radio { |
| .input_check, .input_radio { |
| border: none; |
| border: none; |
| background: none; |
| background: none; |
| vertical-align: middle; |
| vertical-align: middle; |
| margin: 0 2px 2px; |
| margin: 0 2px 2px; |
| } |
| } |
| |
| |
| /* Common button styling. */ |
| /* Common button styling. */ |
| /* It is being replaced with three classes: */ |
| /* It is being replaced with three classes: */ |
| /* .button_submit is not floated */ |
| /* .button_submit is not floated */ |
| /* .right_submit is right floated */ |
| /* .right_submit is right floated */ |
| /* .left_submit is left floated */ |
| /* .left_submit is left floated */ |
| /* The button_reset class may need attention too. */ |
| /* The button_reset class may need attention too. */ |
| .button_submit, .right_submit, .left_submit, .button_reset, |
| .button_submit, .right_submit, .left_submit, .button_reset, |
| /* Anchors styled to look like buttons. */ |
| /* Anchors styled to look like buttons. */ |
| /* These have standard body text size. Can be chained with smalltext class. */ |
| /* These have standard body text size. Can be chained with smalltext class. */ |
| .linkbutton:link, .linkbutton_right:link, .linkbutton_left:link, |
| .linkbutton:link, .linkbutton_right:link, .linkbutton_left:link, |
| .linkbutton:visited, .linkbutton_right:visited, .linkbutton_left:visited { |
| .linkbutton:visited, .linkbutton_right:visited, .linkbutton_left:visited { |
| padding: 0 6px; |
| padding: 0 6px; |
| display: inline-block; |
| display: inline-block; |
| } |
| } |
| .left_submit, .linkbutton_left { |
| .left_submit, .linkbutton_left { |
| float: left; |
| float: left; |
| } |
| } |
| .right_submit, .linkbutton_right { |
| .right_submit, .linkbutton_right { |
| float: right; |
| float: right; |
| } |
| } |
| /* Hover effects. */ |
| /* Hover effects. */ |
| .button_submit:hover, .right_submit:hover, .left_submit:hover, |
| .button_submit:hover, .right_submit:hover, .left_submit:hover, |
| .button_reset:hover, |
| .button_reset:hover, |
| .linkbutton:hover, .linkbutton_right:hover, .linkbutton_left:hover { |
| .linkbutton:hover, .linkbutton_right:hover, .linkbutton_left:hover { |
| cursor: pointer; |
| cursor: pointer; |
| } |
| } |
| /* Dont show disabled buttons as active on hover */ |
| /* Dont show disabled buttons as active on hover */ |
| input[type=submit][disabled]:hover, button[disabled], button[disabled]:hover { |
| input[type=submit][disabled]:hover, button[disabled], button[disabled]:hover { |
| border: 1px solid #afafaf; |
| border: 1px solid #afafaf; |
| border-top: 1px solid #cfcfcf; |
| border-top: 1px solid #cfcfcf; |
| border-left: 1px solid #bfbfbf; |
| border-left: 1px solid #bfbfbf; |
| box-shadow: 1px 1px 2px #e5e5e5; |
| box-shadow: 1px 1px 2px #e5e5e5; |
| } |
| } |
| .linkbutton:link, .linkbutton_right:link, .linkbutton_left:link, |
| .linkbutton:link, .linkbutton_right:link, .linkbutton_left:link, |
| .linkbutton:visited, .linkbutton_right:visited, .linkbutton_left:visited { |
| .linkbutton:visited, .linkbutton_right:visited, .linkbutton_left:visited { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| line-height: 1.929em; |
| line-height: 1.929em; |
| } |
| } |
| |
| |
| /* @todo - A common, tag-agnostic class to hold submit buttons, etc. */ |
| /* @todo - A common, tag-agnostic class to hold submit buttons, etc. */ |
| /* Old markup had crud like <div class="smalltext righttext padding ffs zomg"> */ |
| /* Old markup had crud like <div class="smalltext righttext padding ffs zomg"> */ |
| /* Use new class that is defined to suit, and with a sensible name. */ |
| /* Use new class that is defined to suit, and with a sensible name. */ |
| .submitbutton { |
| .submitbutton { |
| text-align: right; |
| text-align: right; |
| padding: 6px 0; |
| padding: 6px 0; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| #post_confirm_buttons { |
| #post_confirm_buttons { |
| padding: 0 0 1px 0; |
| padding: 0 0 1px 0; |
| } |
| } |
| |
| |
| /* @todo - Test this out some more. */ |
| /* @todo - Test this out some more. */ |
| .submitbutton .button_submit, .submitbutton .linkbutton, .submitbutton .right_submit { |
| .submitbutton .button_submit, .submitbutton .linkbutton, .submitbutton .right_submit { |
| padding: 0 6px; |
| padding: 0 6px; |
| margin-right: 0.4em; |
| margin-right: 0.2em; |
| margin-left: 0.4em; |
| margin-left: 0.2em; |
| } |
| } |
| /* @todo mostly for those go buttons that don't have a form id */ |
| /* @todo mostly for those go buttons that don't have a form id */ |
| .button_submit.submitgo { |
| .button_submit.submitgo { |
| margin-bottom: 4px; |
| margin-bottom: 4px; |
| } |
| } |
| /* IE has its own padding needs */ |
| /* IE has its own padding needs */ |
| #ie select, #ie8 select, #ie9 select { |
| #ie select, #ie8 select, #ie9 select { |
| padding: 0 0 0 6px; |
| padding: 0 0 0 6px; |
| } |
| } |
| |
| |
| /* the new "button" */ |
| /* the new "button" */ |
| /* @todo - Might add extra fallbacks. Possibly monospace. */ |
| /* @todo - Might add extra fallbacks. Possibly monospace. */ |
| /* @todo - Also, look at deprecating spans here. */ |
| /* @todo - Also, look at deprecating spans here. */ |
| .new_posts, .require_approval { |
| .new_posts, .require_approval { |
| font-weight: bold; |
| font-weight: bold; |
| line-height: 1.12px; |
| line-height: 1.12px; |
| } |
| } |
| .new_posts, .require_approval { |
| .new_posts, .require_approval { |
| display: inline; |
| display: inline; |
| padding: 1px 4px 2px 4px; |
| padding: 1px 4px 2px 4px; |
| font-size: .643em; |
| font-size: .643em; |
| font-family: verdana, sans-serif; |
| font-family: verdana, sans-serif; |
| } |
| } |
| .new_posts:hover { |
| .new_posts:hover { |
| text-decoration: underline; |
| text-decoration: underline; |
| } |
| } |
| del .bbc_link:link, del .bbc_link:visited { |
| del .bbc_link:link, del .bbc_link:visited { |
| text-decoration: line-through; |
| text-decoration: line-through; |
| } |
| } |
| .childboards .new_posts { |
| .childboards .new_posts { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| padding: 1px 3px 2px; |
| padding: 1px 3px 2px; |
| } |
| } |
| |
| |
| /* Standard horizontal rule.. ([hr], etc.) */ |
| /* Standard horizontal rule.. ([hr], etc.) */ |
| hr { |
| hr { |
| margin: 12px 0; |
| margin: 12px 0; |
| height: 1px; |
| height: 1px; |
| } |
| } |
| |
| |
| /* Fieldsets are used to group elements. */ |
| /* Fieldsets are used to group elements. */ |
| /* @todo - Can we do this by class? What about default styling? Needed? */ |
| /* @todo - Can we do this by class? What about default styling? Needed? */ |
| /* Declaring as overflow: auto; is probably a good idea. Test for teh bugz. */ |
| /* Declaring as overflow: auto; is probably a good idea. Test for teh bugz. */ |
| fieldset { |
| fieldset { |
| overflow: auto; |
| overflow: auto; |
| border: none; |
| border: none; |
| } |
| } |
| |
| |
| strong { |
| strong { |
| color: #666; |
| color: #666; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| /*...and em as italics */ |
| /*...and em as italics */ |
| em { |
| em { |
| font-style: italic; |
| font-style: italic; |
| } |
| } |
| .table_grid_perms { |
| .table_grid_perms { |
| table-layout: fixed; |
| table-layout: fixed; |
| word-wrap: break-word; |
| word-wrap: break-word; |
| -webkit-hyphens: auto; |
| -webkit-hyphens: auto; |
| -moz-hyphens: auto; |
| -moz-hyphens: auto; |
| -ms-hyphens: auto; |
| -ms-hyphens: auto; |
| } |
| } |
| .grid8 { |
| .grid8 { |
| width: 8%; |
| width: 8%; |
| } |
| } |
| .grid17 { |
| .grid17 { |
| width: 17%; |
| width: 17%; |
| } |
| } |
| .grid20 { |
| .grid20 { |
| width: 20%; |
| width: 20%; |
| } |
| } |
| .grid25 { |
| .grid25 { |
| width: 25%; |
| width: 25%; |
| } |
| } |
| .grid30 { |
| .grid30 { |
| width: 30%; |
| width: 30%; |
| } |
| } |
| .grid33 { |
| .grid33 { |
| width: 33%; |
| width: 33%; |
| } |
| } |
| .grid50 { |
| .grid50 { |
| width: 49.5%; |
| width: 49.5%; |
| } |
| } |
| |
| |
| /* $COMMON */ |
| /* $COMMON */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* HTML5 additions for deprecated tags. */ |
| /* HTML5 additions for deprecated tags. */ |
| .tt { |
| .tt { |
| font-family: monospace; |
| font-family: monospace; |
| } |
| } |
| /* Alternative for u tag. */ |
| /* Alternative for u tag. */ |
| .underline { |
| .underline { |
| text-decoration: underline; |
| text-decoration: underline; |
| } |
| } |
| |
| |
| /* @todo - Test this everywhere. */ |
| /* @todo - Test this everywhere. */ |
| .standard_category { |
| .standard_category { |
| clear: both; |
| clear: both; |
| margin: 1em 0 0 0; |
| margin: 1em 0 0 0; |
| } |
| } |
| /* @todo - Test this everywhere. */ |
| /* @todo - Test this everywhere. */ |
| .standard_category>.content { |
| .standard_category>.content { |
| margin: 4px 0 0 0; |
| margin: 4px 0 0 0; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| |
| |
| /* Floats, overflows, clears. @todo */ |
| /* Floats, overflows, clears. @todo */ |
| .floatright { |
| .floatright { |
| float: right; |
| float: right; |
| } |
| } |
| .floatleft { |
| .floatleft { |
| float: left; |
| float: left; |
| } |
| } |
| .flow_auto { |
| .flow_auto { |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| .flow_hidden { |
| .flow_hidden { |
| overflow: hidden; |
| overflow: hidden; |
| } |
| } |
| .clear { |
| .clear { |
| clear: both; |
| clear: both; |
| } |
| } |
| .clear_left { |
| .clear_left { |
| clear: left; |
| clear: left; |
| } |
| } |
| .clear_right { |
| .clear_right { |
| clear: right; |
| clear: right; |
| } |
| } |
| |
| |
| /* Default font sizes (defined in em, so IE can resize): small (12px default), |
| /* Default font sizes (defined in em, so IE can resize): small (12px default), |
| /* normal (14px default), and large (16px default). |
| /* normal (14px default), and large (16px default). |
| /* Since these are purely presentational classes, they should be used sparingly. */ |
| /* Since these are purely presentational classes, they should be used sparingly. */ |
| /* @todo - th shouldn't be required. */ |
| /* @todo - th shouldn't be required. */ |
| .smalldescription, .smalldescription th, .smalltext, .smalltext th { |
| .smalldescription, .smalldescription th, .smalltext, .smalltext th { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| .largetext { |
| .largetext { |
| font-size: 1.286em; |
| font-size: 1.286em; |
| } |
| } |
| .centertext { |
| .centertext { |
| text-align: center; |
| text-align: center; |
| } |
| } |
| .righttext { |
| .righttext { |
| text-align: right; |
| text-align: right; |
| } |
| } |
| .lefttext { |
| .lefttext { |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .double_height { |
| .double_height { |
| line-height: 2em; |
| line-height: 2em; |
| } |
| } |
| .nowrap { |
| .nowrap { |
| white-space: nowrap; |
| white-space: nowrap; |
| } |
| } |
| .wordbreak { |
| .wordbreak { |
| word-break: break-all; |
| word-break: break-all; |
| } |
| } |
| /* Styles for main headers. */ |
| /* Styles for main headers. */ |
| .category_header, .forum_category .category_header { |
| .category_header, .forum_category .category_header { |
| padding: 4px 10px 2px 10px; |
| padding: 4px 10px 2px 10px; |
| font-size: 1.214em; |
| font-size: 1.214em; |
| line-height: 1.8em; |
| line-height: 1.8em; |
| } |
| } |
| |
| |
| /* Styles for subsection headers. @todo */ |
| /* Styles for subsection headers. @todo */ |
| .secondary_header { |
| .secondary_header { |
| margin: 12px 0 0 0; |
| margin: 12px 0 0 0; |
| font-size: 1.143em; |
| font-size: 1.143em; |
| line-height: 1.8em; |
| line-height: 1.8em; |
| padding: 1px 10px 1px; |
| padding: 1px 10px 1px; |
| } |
| } |
| |
| |
| .category_header .icon { |
| .category_header .icon { |
| margin: 0 5px 0 0; |
| margin: 0 5px 0 0; |
| vertical-align: text-top; |
| vertical-align: text-top; |
| } |
| } |
| /* Category Header icons as sprites |
| /* Category Header icons as sprites |
| ------------------------------------------------- */ |
| ------------------------------------------------- */ |
| .hdicon:before { |
| .hdicon:before { |
| background-image: url(../images/icons/header.png); |
| background-image: url(../images/icons/header.png); |
| background-repeat: no-repeat; |
| background-repeat: no-repeat; |
| content: ""; |
| content: ""; |
| display: inline-block; |
| display: inline-block; |
| height: 24px; |
| height: 24px; |
| width: 30px; |
| width: 30px; |
| vertical-align: text-bottom; |
| vertical-align: text-bottom; |
| } |
| } |
| /* broke formatting for compactness */ |
| /* broke formatting for compactness */ |
| .cat_img_attachments:before {background-position: 0 0;} |
| .cat_img_attachments:before {background-position: 0 0;} |
| .cat_img_buddies:before {background-position: 0 -24px;} |
| .cat_img_buddies:before {background-position: 0 -24px;} |
| .cat_img_config:before {background-position: 0 -48px} |
| .cat_img_config:before {background-position: 0 -48px} |
| .cat_img_contacts:before {background-position: 0 -72px;} |
| .cat_img_contacts:before {background-position: 0 -72px;} |
| .cat_img_helptopics:before {background-position: 0 -96px;} |
| .cat_img_helptopics:before {background-position: 0 -96px;} |
| .cat_img_inbox:before {background-position: 0 -120px;} |
| .cat_img_inbox:before {background-position: 0 -120px;} |
| .cat_img_login:before {background-position: 0 -144px;} |
| .cat_img_login:before {background-position: 0 -144px;} |
| .cat_img_mail:before {background-position: 0 -168px;} |
| .cat_img_mail:before {background-position: 0 -168px;} |
| .cat_img_moderation:before {background-position: 0 -192px;} |
| .cat_img_moderation:before {background-position: 0 -192px;} |
| .cat_img_plus:before {background-position: 0 -216px;} |
| .cat_img_plus:before {background-position: 0 -216px;} |
| .cat_img_posts:before {background-position: 0 -240px;} |
| .cat_img_posts:before {background-position: 0 -240px;} |
| .cat_img_profile:before {background-position: 0 -264px;} |
| .cat_img_profile:before {background-position: 0 -264px;} |
| .cat_img_search:before {background-position: 0 -288px;} |
| .cat_img_search:before {background-position: 0 -288px;} |
| .cat_img_stats_info:before {background-position: 0 -312px;} |
| .cat_img_stats_info:before {background-position: 0 -312px;} |
| .cat_img_topics:before {background-position: 0 -336px;} |
| .cat_img_topics:before {background-position: 0 -336px;} |
| .cat_img_write:before {background-position: 0 -360px;} |
| .cat_img_write:before {background-position: 0 -360px;} |
| .cat_img_database:before {background-position: 0 -384px;} |
| .cat_img_database:before {background-position: 0 -384px;} |
| .cat_img_address:before {background-position: 0 -408px;} |
| .cat_img_address:before {background-position: 0 -408px;} |
| .cat_img_calendar:before {background-position: 0 -432px;} |
| .cat_img_calendar:before {background-position: 0 -432px;} |
| .cat_img_minus:before {background-position: 0 -456px;} |
| .cat_img_minus:before {background-position: 0 -456px;} |
| .cat_img_star:before {background-position: 0 -480px;} |
| .cat_img_star:before {background-position: 0 -480px;} |
| .cat_img_clock:before {background-position: 0 -504px;} |
| .cat_img_clock:before {background-position: 0 -504px;} |
| .cat_img_eye:before {background-position: 0 -528px;} |
| .cat_img_eye:before {background-position: 0 -528px;} |
| .cat_img_piechart:before {background-position: 0 -552px;} |
| .cat_img_piechart:before {background-position: 0 -552px;} |
| .cat_img_talk:before {background-position: 0 -576px;} |
| .cat_img_talk:before {background-position: 0 -576px;} |
| |
| |
| h2 a.collapse { |
| h2 a.collapse { |
| margin: 2px 4px -2px 0; |
| margin: 2px 4px -2px 0; |
| float: right; |
| float: right; |
| } |
| } |
| |
| |
| /* Upshrink image in the general category headers */ |
| /* Upshrink image in the general category headers */ |
| #category_toggle, #category_toggle_more, #upshrink_header { |
| #category_toggle, #category_toggle_more, #upshrink_header { |
| display: block; |
| display: block; |
| float: right; |
| float: right; |
| padding: 0 16px; |
| padding: 0 16px; |
| overflow: hidden; |
| overflow: hidden; |
| position: relative; |
| position: relative; |
| } |
| } |
| #category_toggle span, #category_toggle_more span, #upshrink_header span { |
| #category_toggle span, #category_toggle_more span, #upshrink_header span { |
| background-repeat: no-repeat; |
| background-repeat: no-repeat; |
| background-image: url(../images/_light/expcol.png); |
| background-image: url(../images/_light/expcol.png); |
| position: absolute; |
| position: absolute; |
| top: 50%; |
| top: 50%; |
| margin-top: -30px; |
| margin-top: -30px; |
| left: 50%; |
| left: 50%; |
| margin-left: -58px; |
| margin-left: -58px; |
| padding: 47px 50px; |
| padding: 47px 50px; |
| } |
| } |
| /* Upshrink image in the page top for the header collapse */ |
| /* Upshrink image in the page top for the header collapse */ |
| #collapse_button .linklevel1 { |
| #collapse_button .linklevel1 { |
| display: block; |
| display: block; |
| overflow: hidden; |
| overflow: hidden; |
| position: relative; |
| position: relative; |
| padding: 0; |
| padding: 0; |
| margin-right: 1px; |
| margin-right: 1px; |
| } |
| } |
| .collapse {background-position: 0 -25px;} |
| .collapse {background-position: 0 -25px;} |
| .expand {background-position: -116px -25px;} |
| .expand {background-position: -116px -25px;} |
| |
| |
| /* Alternating backgrounds for posts, and several other sections of the forum. */ |
| /* Alternating backgrounds for posts, and several other sections of the forum. */ |
| .windowbg, #preview_body, .windowbg2 {} |
| .windowbg, #preview_body, .windowbg2 {} |
| |
| |
| /* General code for generic divs. Should make them behave. */ |
| /* General code for generic divs. Should make them behave. */ |
| /* @todo - Not keen on this. Do no-tag-names solution instead? */ |
| /* @todo - Not keen on this. Do no-tag-names solution instead? */ |
| /* @todo - When sorted out take care of div.core_posts too */ |
| /* @todo - When sorted out take care of div.core_posts too */ |
| div.windowbg, div.windowbg2 { |
| div.windowbg, div.windowbg2 { |
| overflow: auto; |
| overflow: auto; |
| padding: 10px 0; |
| padding: 10px 0; |
| } |
| } |
| |
| |
| /* Other highlighted text, such as search results. */ |
| /* Other highlighted text, such as search results. */ |
| .highlight { |
| .highlight { |
| font-weight: bold; |
| font-weight: bold; |
| font-size: 1.071em; |
| font-size: 1.071em; |
| } |
| } |
| /* Legacy highlight color, for selected membergroups etc. */ |
| /* Legacy highlight color, for selected membergroups etc. */ |
| /* Used by JS to show a selected item. @todo - deprecate? */ |
| /* Used by JS to show a selected item. @todo - deprecate? */ |
| .highlight2 { |
| .highlight2 { |
| font-size: 1.071em; |
| font-size: 1.071em; |
| } |
| } |
| |
| |
| /* Sometimes there will be an error when you post */ |
| /* Sometimes there will be an error when you post */ |
| .error { |
| .error { |
| color: red; |
| color: red; |
| } |
| } |
| .border_error { |
| .border_error { |
| border: 1px solid red !important; |
| border: 1px solid red !important; |
| } |
| } |
| |
| |
| /* Messages that somehow need to attract the attention. */ |
| /* Messages that somehow need to attract the attention. */ |
| .alert { |
| .alert { |
| color: red; |
| color: red; |
| } |
| } |
| |
| |
| /* Colors for warnings. */ |
| /* Colors for warnings. */ |
| .warn_mute { |
| .warn_mute { |
| color: red; |
| color: red; |
| } |
| } |
| .warn_moderate, .softalert { |
| .warn_moderate, .softalert { |
| color: #ffa500; |
| color: #ffa500; |
| } |
| } |
| .warn_watch, .success { |
| .warn_watch, .success { |
| color: green; |
| color: green; |
| } |
| } |
| .moderation_link, .moderation_link:visited { |
| .moderation_link, .moderation_link:visited { |
| color: red; |
| color: red; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| |
| |
| /* Used for sections that need somewhat larger corners */ |
| /* Used for sections that need somewhat larger corners */ |
| /* @todo - Daft name. Other stuffz. :P */ |
| /* @todo - Daft name. Other stuffz. :P */ |
| .roundframe { |
| .roundframe { |
| overflow: hidden; |
| overflow: hidden; |
| margin: 2px 0 0 0; |
| margin: 2px 0 0 0; |
| padding: 9px; |
| padding: 9px; |
| } |
| } |
| .roundframe p { |
| .roundframe p { |
| padding: 6px; |
| padding: 6px; |
| } |
| } |
| |
| |
| /* The generic wrapper thingy. Used by generic list template */ |
| /* The generic wrapper thingy. Used by generic list template */ |
| .generic_list_wrapper { |
| .generic_list_wrapper { |
| overflow: auto; |
| overflow: auto; |
| margin: 0; |
| margin: 0; |
| padding: 8px 8px 16px 8px; |
| padding: 8px 8px 16px 8px; |
| } |
| } |
| .generic_list_wrapper .additional_row { |
| .generic_list_wrapper .additional_row { |
| margin: 0; |
| margin: 0; |
| padding: 10px 0 0; |
| padding: 10px 0 0; |
| } |
| } |
| /* The .information box is used by the after_title additional row */ |
| /* The .information box is used by the after_title additional row */ |
| .generic_list_wrapper .information .additional_row { |
| .generic_list_wrapper .information .additional_row { |
| border: none; |
| border: none; |
| padding: 6px 0; |
| padding: 6px 0; |
| } |
| } |
| .generic_list_wrapper .information { |
| .generic_list_wrapper .information { |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| border: none; |
| border: none; |
| } |
| } |
| |
| |
| /* @todo - Ha. Just another silly bunch of divs. */ |
| /* @todo - Ha. Just another silly bunch of divs. */ |
| .content { |
| .content { |
| padding: 0.2em 1em; |
| padding: 0.2em 1em; |
| } |
| } |
| .content p { |
| .content p { |
| margin: 0 0 6px 0; |
| margin: 0 0 6px 0; |
| } |
| } |
| |
| |
| /* Styles used by the auto suggest control. */ |
| /* Styles used by the auto suggest control. */ |
| .auto_suggest_div { |
| .auto_suggest_div { |
| position: absolute; |
| position: absolute; |
| z-index: 100; |
| z-index: 100; |
| visibility: hidden; |
| visibility: hidden; |
| } |
| } |
| .auto_suggest_div:focus { |
| .auto_suggest_div:focus { |
| outline: none !important; |
| outline: none !important; |
| } |
| } |
| .auto_suggest_item { |
| .auto_suggest_item { |
| padding: 1px 4px; |
| padding: 1px 4px; |
| } |
| } |
| .auto_suggest_item_hover { |
| .auto_suggest_item_hover { |
| padding: 1px 4px; |
| padding: 1px 4px; |
| cursor: pointer; |
| cursor: pointer; |
| } |
| } |
| /* To ensure the question and the input are on two different lines */ |
| /* To ensure the question and the input are on two different lines */ |
| .verificationquestion label { |
| .verificationquestion label { |
| display: block; |
| display: block; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| |
| |
| /* $BBC */ |
| /* $BBC */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| /* The "Quote:" and "Code:" header parts... */ |
| /* The "Quote:" and "Code:" header parts... */ |
| .codeheader, .quoteheader { |
| .codeheader, .quoteheader { |
| margin: 6px 0 0 0; |
| margin: 6px 0 0 0; |
| padding: 4px 6px 2px 6px; |
| padding: 4px 6px 2px 6px; |
| font-weight: bold; |
| font-weight: bold; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| /* [Select] link to copy code. */ |
| /* [Select] link to copy code. */ |
| .codeoperation { |
| .codeoperation { |
| font-weight: normal; |
| font-weight: normal; |
| } |
| } |
| /* A quote, perhaps from another post. */ |
| /* A quote, perhaps from another post. */ |
| .bbc_standard_quote, .bbc_alternate_quote, |
| .bbc_standard_quote, .bbc_alternate_quote, |
| /* A code block - maybe PHP ;) - shared styles. */ |
| /* A code block - maybe PHP ;) - shared styles. */ |
| .bbc_code { |
| .bbc_code { |
| overflow: auto; |
| overflow: auto; |
| margin: 0 0 1em 0; |
| margin: 0 0 1em 0; |
| padding: 6px 10px; |
| padding: 6px 10px; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| /* Extra code block styling. */ |
| /* Extra code block styling. */ |
| .bbc_code { |
| .bbc_code { |
| overflow: auto; |
| overflow: auto; |
| height: 20em; |
| height: 20em; |
| white-space: nowrap; |
| white-space: nowrap; |
| font-family: "DejaVu Sans Mono", Monaco, Consolas, monospace; |
| font-family: "DejaVu Sans Mono", Monaco, Consolas, monospace; |
| resize: vertical; |
| resize: vertical; |
| } |
| } |
| /* Stop em compounding when elements are nested. */ |
| /* Stop em compounding when elements are nested. */ |
| /* @todo - Scrap old extra divs in Subs.php. */ |
| /* @todo - Scrap old extra divs in Subs.php. */ |
| .bbc_standard_quote .bbc_alternate_quote, .bbc_alternate_quote .bbc_standard_quote, |
| .bbc_standard_quote .bbc_alternate_quote, .bbc_alternate_quote .bbc_standard_quote, |
| .bbc_standard_quote .bbc_code, .bbc_alternate_quote .bbc_code, .bbc_standard_quote .codeheader, |
| .bbc_standard_quote .bbc_code, .bbc_alternate_quote .bbc_code, .bbc_standard_quote .codeheader, |
| .bbc_alternate_quote .codeheader, .bbc_standard_quote .quoteheader, .bbc_alternate_quote .quoteheader, |
| .bbc_alternate_quote .codeheader, .bbc_standard_quote .quoteheader, .bbc_alternate_quote .quoteheader, |
| /* And for quote inside small text areas, like the topic summary. */ |
| /* And for quote inside small text areas, like the topic summary. */ |
| #topic_summary .bbc_standard_quote, #topic_summary .bbc_alternate_quote , |
| #topic_summary .bbc_standard_quote, #topic_summary .bbc_alternate_quote , |
| #topic_summary .bbc_code, #topic_summary .codeheader, #topic_summary .quoteheader { |
| #topic_summary .bbc_code, #topic_summary .codeheader, #topic_summary .quoteheader { |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| /* Styling for BBC tags */ |
| /* Styling for BBC tags */ |
| .bbc_size { |
| .bbc_size { |
| line-height: 1.4em; |
| line-height: 1.4em; |
| } |
| } |
| /* @todo - Are all these "inherit" declarations really necessary? */ |
| /* @todo - Are all these "inherit" declarations really necessary? */ |
| .bbc_color a { |
| .bbc_color a { |
| color: inherit; |
| color: inherit; |
| } |
| } |
| .bbc_strong { |
| .bbc_strong { |
| color: inherit; |
| color: inherit; |
| } |
| } |
| .bbc_img { |
| .bbc_img { |
| border: 0; |
| border: 0; |
| max-width: 100%; |
| max-width: 100%; |
| } |
| } |
| .bbc_table { |
| .bbc_table { |
| color: inherit; |
| color: inherit; |
| font: inherit; |
| font: inherit; |
| } |
| } |
| .bbc_table td { |
| .bbc_table td { |
| color: inherit; |
| color: inherit; |
| font: inherit; |
| font: inherit; |
| vertical-align: top; |
| vertical-align: top; |
| padding: 0 1em 0 0; |
| padding: 0 1em 0 0; |
| } |
| } |
| .bbc_table th { |
| .bbc_table th { |
| color: inherit; |
| color: inherit; |
| font: inherit; |
| font: inherit; |
| font-weight: bold; |
| font-weight: bold; |
| padding: 0 1em 0 0; |
| padding: 0 1em 0 0; |
| } |
| } |
| .bbc_u { |
| .bbc_u { |
| text-decoration: underline; |
| text-decoration: underline; |
| } |
| } |
| .bbc_list { |
| .bbc_list { |
| padding: 0 0 0 35px; |
| padding: 0 0 0 35px; |
| text-align: left; |
| text-align: left; |
| list-style-type: square; |
| list-style-type: square; |
| } |
| } |
| /* Everything is same except HTML5 valid */ |
| /* Everything is same except HTML5 valid */ |
| .bbc_tt { |
| .bbc_tt { |
| font-family: "DejaVu Sans Mono", Monaco, "Lucida Console", "Courier New", monospace; |
| font-family: "DejaVu Sans Mono", Monaco, "Lucida Console", "Courier New", monospace; |
| } |
| } |
| .bbc_pre { |
| .bbc_pre { |
| font-family: "DejaVu Sans Mono", Monaco, Consolas, monospace; |
| font-family: "DejaVu Sans Mono", Monaco, Consolas, monospace; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| .bbc_footnotes { |
| .bbc_footnotes { |
| margin-top: 10px; |
| margin-top: 10px; |
| padding: 4px 8px 4px 0; |
| padding: 4px 8px 4px 0; |
| font-size: small; |
| font-size: small; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| .footnote_return { |
| .footnote_return { |
| font-size: 1.357em; |
| font-size: 1.357em; |
| } |
| } |
| /* Shorten url's inside posts. */ |
| /* Shorten url's inside posts. */ |
| a.bbc_link { |
| a.bbc_link { |
| display: inline-block; |
| display: inline-block; |
| white-space: nowrap; |
| white-space: nowrap; |
| overflow: hidden; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| text-overflow: ellipsis; |
| max-width: 100%; |
| max-width: 100%; |
| vertical-align: bottom; |
| vertical-align: bottom; |
| } |
| } |
| |
| |
| /* $AJAX */ |
| /* $AJAX */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* The "Loading" bar for quick edit, etc. */ |
| /* The "Loading" bar for quick edit, etc. */ |
| #ajax_in_progress { |
| #ajax_in_progress { |
| position: fixed; |
| position: fixed; |
| top: 0; |
| top: 0; |
| left: 0; |
| left: 0; |
| padding: 15px; |
| padding: 15px; |
| width: 100%; |
| width: 100%; |
| text-align: center; |
| text-align: center; |
| font-size: 1.571em; |
| font-size: 1.571em; |
| z-index: 100; |
| z-index: 100; |
| } |
| } |
| #ajax_in_progress a { |
| #ajax_in_progress a { |
| color: orange; |
| color: orange; |
| text-decoration: underline; |
| text-decoration: underline; |
| } |
| } |
| |
| |
| /* $MAIN. */ |
| /* $MAIN. */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| /* The top bar. */ |
| /* The top bar. */ |
| #top_section { |
| #top_section { |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| #top_section_notice { |
| #top_section_notice { |
| float: left; |
| float: left; |
| margin: 0; |
| margin: 0; |
| padding: 14px 8px 0 8px; |
| padding: 14px 8px 0 8px; |
| line-height: 1.286em; |
| line-height: 1.286em; |
| min-width: 38%; |
| min-width: 38%; |
| } |
| } |
| #top_section_notice .toggle_login { |
| #top_section_notice .toggle_login { |
| display: inline; |
| display: inline; |
| cursor: pointer; |
| cursor: pointer; |
| } |
| } |
| #top_section_notice form { |
| #top_section_notice form { |
| white-space: nowrap; |
| white-space: nowrap; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .top_button { |
| .top_button { |
| line-height: 1.286em; |
| line-height: 1.286em; |
| padding: 2px; |
| padding: 2px; |
| margin-left: 1px; |
| margin-left: 1px; |
| vertical-align: top; |
| vertical-align: top; |
| } |
| } |
| .top_button img { |
| .top_button img { |
| vertical-align: middle; |
| vertical-align: middle; |
| padding: 2px; |
| padding: 2px; |
| } |
| } |
| #password_login { |
| #password_login { |
| display: inline-block; |
| display: inline-block; |
| vertical-align: middle; |
| vertical-align: middle; |
| -webkit-appearance: caps-lock-indicator; |
| -webkit-appearance: caps-lock-indicator; |
| } |
| } |
| #search_form { |
| #search_form { |
| padding: 12px 3px 4px 8px; |
| padding: 12px 3px 4px 8px; |
| float: right; |
| float: right; |
| } |
| } |
| #search_form * { |
| #search_form * { |
| margin: 0; |
| margin: 0; |
| border-radius: 0; |
| border-radius: 0; |
| /* Webkit (bleh) fix. */ |
| /* Webkit (bleh) fix. */ |
| float: left; |
| float: left; |
| } |
| } |
| /* The logo and slogan. */ |
| /* The logo and slogan. */ |
| #header { |
| #header { |
| padding: 2px 2px 0 2px; |
| padding: 2px 2px 0 2px; |
| } |
| } |
| /* The main title. */ |
| /* The main title. */ |
| #forumtitle, .rightheader #forumtitle { |
| #forumtitle, .rightheader #forumtitle { |
| float: left; |
| float: left; |
| padding: 10px 10px 6px 13px; |
| padding: 10px 10px 6px 13px; |
| font-size: 2.357em; |
| font-size: 2.357em; |
| line-height: 1.455em; |
| line-height: 1.455em; |
| } |
| } |
| .centerheader #forumtitle { |
| .centerheader #forumtitle { |
| display: none; |
| display: none; |
| } |
| } |
| .rightheader #forumtitle { |
| .rightheader #forumtitle { |
| float: right; |
| float: right; |
| } |
| } |
| /* Float these items to the right. @todo - Simplify. */ |
| /* Float these items to the right. @todo - Simplify. */ |
| #logobox, .rightheader #logobox { |
| #logobox, .rightheader #logobox { |
| float: right; |
| float: right; |
| padding: 0.95em 12px 0 12px; |
| padding: 0.95em 12px 0 12px; |
| max-width: 40%; |
| max-width: 40%; |
| } |
| } |
| .centerheader #logobox { |
| .centerheader #logobox { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .rightheader #logobox, .rightheader #logo { |
| .rightheader #logobox, .rightheader #logo { |
| float: left; |
| float: left; |
| padding-bottom: 7px; |
| padding-bottom: 7px; |
| } |
| } |
| .centerheader #logobox, .centerheader #logo, .centerheader #siteslogan { |
| .centerheader #logobox, .centerheader #logo, .centerheader #siteslogan { |
| float: none; |
| float: none; |
| display: block; |
| display: block; |
| margin: 0 auto; |
| margin: 0 auto; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| #siteslogan { |
| #siteslogan { |
| clear: both; |
| clear: both; |
| } |
| } |
| /* Tweak the logo */ |
| /* Tweak the logo */ |
| #logo { |
| #logo { |
| margin: 0 8px 0 0; |
| margin: 0 8px 0 0; |
| padding: 0; |
| padding: 0; |
| float: right; |
| float: right; |
| } |
| } |
| .rightheader #logo { |
| .rightheader #logo { |
| margin: 0 0 0 8px; |
| margin: 0 0 0 8px; |
| } |
| } |
| /* Main forum area. */ |
| /* Main forum area. */ |
| /* Box-shadow only on this one. */ |
| /* Box-shadow only on this one. */ |
| #wrapper { |
| #wrapper { |
| margin-top: 20px; |
| margin-top: 20px; |
| padding: 1.2em 1em; |
| padding: 1.2em 1em; |
| } |
| } |
| /* The user info, news, etc.*/ |
| /* The user info, news, etc.*/ |
| #news { |
| #news { |
| vertical-align: top; |
| vertical-align: top; |
| padding: 0 0 1em 0; |
| padding: 0 0 1em 0; |
| margin-left: -1px; |
| margin-left: -1px; |
| } |
| } |
| #news .bbc_link { |
| #news .bbc_link { |
| display: inline; |
| display: inline; |
| } |
| } |
| |
| |
| /* The login form. */ |
| /* The login form. */ |
| #guest_form { |
| #guest_form { |
| padding: 0 0 8px 0; |
| padding: 0 0 8px 0; |
| } |
| } |
| #guest_form input, #guest_form select { |
| #guest_form input, #guest_form select { |
| font-size: 1.071em; |
| font-size: 1.071em; |
| margin: 0 0 8px 0; |
| margin: 0 0 8px 0; |
| } |
| } |
| .modtask { |
| .modtask { |
| margin: 1em 0 0 0; |
| margin: 1em 0 0 0; |
| } |
| } |
| .modtask a { |
| .modtask a { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| /* The content section */ |
| /* The content section */ |
| #main_content_section { |
| #main_content_section { |
| padding: 1em 0 0 0; |
| padding: 1em 0 0 0; |
| min-height: 180px; |
| min-height: 180px; |
| } |
| } |
| /* The footer with copyright links etc. */ |
| /* The footer with copyright links etc. */ |
| #footer_section { |
| #footer_section { |
| margin: 35px 0 0 0; |
| margin: 35px 0 0 0; |
| } |
| } |
| #footer_section .wrapper { |
| #footer_section .wrapper { |
| padding: 20px 5px; |
| padding: 20px 5px; |
| } |
| } |
| #footer_section p, #footer_section a { |
| #footer_section p, #footer_section a { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| #footer_section li { |
| #footer_section li { |
| display: inline; |
| display: inline; |
| padding-right: 5px; |
| padding-right: 5px; |
| } |
| } |
| #footer_section .copyright { |
| #footer_section .copyright { |
| display: inline; |
| display: inline; |
| visibility: visible; |
| visibility: visible; |
| font-family: Verdana, Arial, sans-serif; |
| font-family: Verdana, Arial, sans-serif; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| #footer_section .rssfeeds { |
| #footer_section .rssfeeds { |
| float: right; |
| float: right; |
| padding-top: 2px; |
| padding-top: 2px; |
| width: 21px; |
| width: 21px; |
| margin: auto; |
| margin: auto; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| |
| |
| |
| |
| /* $MENUS */ |
| /* $MENUS */ |
| /* This section contains code for the main forum menu (#main_menu), |
| /* This section contains code for the main forum menu (#main_menu), |
| /* and for the secondary menus in admin/profile/pm (.admin_menu), |
| /* and for the secondary menus in admin/profile/pm (.admin_menu), |
| /* and for the tertiary menu strip in admin/etc (#adm_submenus). |
| /* and for the tertiary menu strip in admin/etc (#adm_submenus). |
| /* |
| /* |
| /* Top level <ul> elements have the class or id mentioned above. |
| /* Top level <ul> elements have the class or id mentioned above. |
| /* <li> elements are for positioning only (classes are listlevel1, etc). |
| /* <li> elements are for positioning only (classes are listlevel1, etc). |
| /* Top level links (like main menu buttons) have the class linklevel1. |
| /* Top level links (like main menu buttons) have the class linklevel1. |
| /* Drop menu wrappers are either menulevel2 or menulevel3. |
| /* Drop menu wrappers are either menulevel2 or menulevel3. |
| /* Drop menu links are either linklevel2 or linklevel3. |
| /* Drop menu links are either linklevel2 or linklevel3. |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| /* Main menu bar: wrapper/background. */ |
| /* Main menu bar: wrapper/background. */ |
| #menu_nav { |
| #menu_nav { |
| padding: 6px; |
| padding: 6px; |
| } |
| } |
| #main_menu { |
| #main_menu { |
| position: relative; |
| position: relative; |
| } |
| } |
| /* Wrapper for primary admin/profile/etc menus. */ |
| /* Wrapper for primary admin/profile/etc menus. */ |
| .admin_menu { |
| .admin_menu { |
| padding: 0 3px; |
| padding: 0 3px; |
| } |
| } |
| /* Wrapper for secondary admin/profile/etc menus. */ |
| /* Wrapper for secondary admin/profile/etc menus. */ |
| #adm_submenus { |
| #adm_submenus { |
| overflow: auto; |
| overflow: auto; |
| padding: 0 3px; |
| padding: 0 3px; |
| } |
| } |
| /* Level 1 button positioning. */ |
| /* Level 1 button positioning. */ |
| /* 1px padding gives slight gap between buttons, and drop menus. */ |
| /* 1px padding gives slight gap between buttons, and drop menus. */ |
| .listlevel1 { |
| .listlevel1 { |
| position: relative; |
| position: relative; |
| float: left; |
| float: left; |
| margin: 0 2px; |
| margin: 0 2px; |
| padding: 2px 0; |
| padding: 2px 0; |
| font-size: 0.929em; |
| font-size: 0.929em; |
| line-height: 2.077em; |
| line-height: 2.077em; |
| } |
| } |
| .poster .listlevel1 { |
| .poster .listlevel1 { |
| line-height: 1.667em; |
| line-height: 1.667em; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| .listlevel1:hover { |
| .listlevel1:hover { |
| z-index: 6; |
| z-index: 6; |
| } |
| } |
| .listlevel1#collapse_button, .listlevel1#button_profile { |
| .listlevel1#collapse_button, .listlevel1#button_profile { |
| float: right; |
| float: right; |
| } |
| } |
| .listlevel1#button_profile img { |
| .listlevel1#button_profile img { |
| max-width: 1.5em; |
| max-width: 1.5em; |
| max-height: 1.5em; |
| max-height: 1.5em; |
| margin: 0; |
| margin: 0; |
| margin-right: 0.6em; |
| margin-right: 0.6em; |
| position: relative; |
| position: relative; |
| top: 4px; |
| top: 4px; |
| } |
| } |
| /* Level 1 Menu bar: link or button. */ |
| /* Level 1 Menu bar: link or button. */ |
| .linklevel1 { |
| .linklevel1 { |
| display: block; |
| display: block; |
| padding: 0 0.6em; |
| padding: 0 0.6em; |
| white-space: nowrap; |
| white-space: nowrap; |
| } |
| } |
| .listlevel1#button_profile .linklevel1 { |
| .listlevel1#button_profile .linklevel1 { |
| min-width: 5em; |
| min-width: 5em; |
| } |
| } |
| |
| |
| /* Levels 2 and 3: drop menu wrapper. */ |
| /* Levels 2 and 3: drop menu wrapper. */ |
| .menulevel2, .menulevel3 { |
| .menulevel2, .menulevel3 { |
| position: absolute; |
| position: absolute; |
| top: 100%; |
| top: 100%; |
| left: -9999px; |
| left: -9999px; |
| z-index: 90; |
| z-index: 90; |
| margin: 0; |
| margin: 0; |
| padding: 0.6em; |
| padding: 0.6em; |
| width: 18.4em; |
| width: 18.4em; |
| } |
| } |
| /* Level 3: drop menu positioning. */ |
| /* Level 3: drop menu positioning. */ |
| .menulevel3 { |
| .menulevel3 { |
| margin: -2em 0 0 15.3em; |
| margin: -2em 0 0 15.3em; |
| } |
| } |
| /* Reposition Level 2 drop menu as visible on hover. */ |
| /* Reposition Level 2 drop menu as visible on hover. */ |
| .listlevel1:hover .menulevel2, .listlevel1.sfhover .menulevel2 { |
| .listlevel1:hover .menulevel2, .listlevel1.sfhover .menulevel2 { |
| left: 0; |
| left: 0; |
| } |
| } |
| .listlevel1#button_profile:hover .menulevel2, .listlevel1#button_profile.sfhover .menulevel2 { |
| .listlevel1#button_profile:hover .menulevel2, .listlevel1#button_profile.sfhover .menulevel2 { |
| left: auto; |
| left: auto; |
| right: 0; |
| right: 0; |
| } |
| } |
| /* Hiding Level 3 drop menu off hover. */ |
| /* Hiding Level 3 drop menu off hover. */ |
| .listlevel1:hover .menulevel3, .listlevel1.sfhover .menulevel3 { |
| .listlevel1:hover .menulevel3, .listlevel1.sfhover .menulevel3 { |
| left: -9999px; |
| left: -9999px; |
| } |
| } |
| /* Reposition Level 3 drop menu as visible on hover. */ |
| /* Reposition Level 3 drop menu as visible on hover. */ |
| .listlevel2:hover .menulevel3, .listlevel2.sfhover .menulevel3 { |
| .listlevel2:hover .menulevel3, .listlevel2.sfhover .menulevel3 { |
| left: -14px; |
| left: -14px; |
| } |
| } |
| /* Level 2 and 3 button positioning. */ |
| /* Level 2 and 3 button positioning. */ |
| /* 1px vertical padding gives slight gap between buttons. */ |
| /* 1px vertical padding gives slight gap between buttons. */ |
| .listlevel2, .listlevel3 { |
| .listlevel2, .listlevel3 { |
| position: relative; |
| position: relative; |
| float: none; |
| float: none; |
| padding: 1px 0; |
| padding: 1px 0; |
| width: 17em; |
| width: 17em; |
| } |
| } |
| /* Levels 2 and 3 drop menus: link or button. */ |
| /* Levels 2 and 3 drop menus: link or button. */ |
| .linklevel2, .linklevel3 { |
| .linklevel2, .linklevel3 { |
| position: relative; |
| position: relative; |
| display: block; |
| display: block; |
| padding: 0 7px; |
| padding: 0 7px; |
| } |
| } |
| /* @todo - Note: The next declarations are for keyboard access with js disabled. */ |
| /* @todo - Note: The next declarations are for keyboard access with js disabled. */ |
| /* Hmm. These are tricky with the new Superfish/Superclick combo. */ |
| /* Hmm. These are tricky with the new Superfish/Superclick combo. */ |
| /* May need a noScript class added somewhere. Pondering required. */ |
| /* May need a noScript class added somewhere. Pondering required. */ |
| /* |
| /* |
| .linklevel2:focus, .linklevel3:focus { |
| .linklevel2:focus, .linklevel3:focus { |
| margin-left: 9990px; |
| margin-left: 9990px; |
| width: 17em; |
| width: 17em; |
| } |
| } |
| .linklevel3:focus { |
| .linklevel3:focus { |
| margin-left: 19950px; |
| margin-left: 19950px; |
| } |
| } |
| */ |
| */ |
| /* @todo - Cancel those for hover and/or js access. */ |
| /* @todo - Cancel those for hover and/or js access. */ |
| /* |
| /* |
| .listlevel2:hover .linklevel2:focus, .listlevel2.sfhover .linklevel2:focus, |
| .listlevel2:hover .linklevel2:focus, .listlevel2.sfhover .linklevel2:focus, |
| .listlevel3:hover .linklevel3:focus, .listlevel3.sfhover .linklevel3:focus { |
| .listlevel3:hover .linklevel3:focus, .listlevel3.sfhover .linklevel3:focus { |
| z-index: 999; |
| z-index: 999; |
| margin-left: 0; |
| margin-left: 0; |
| width: auto; |
| width: auto; |
| } |
| } |
| */ |
| */ |
| /* Styles for sidebar menus. |
| /* Styles for sidebar menus. |
| ------------------------------------------------------- */ |
| ------------------------------------------------------- */ |
| #main_admsection { |
| #main_admsection { |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| #menu_sidebar { |
| #menu_sidebar { |
| float: left; |
| float: left; |
| padding: 0 10px 1em 0; |
| padding: 0 10px 1em 0; |
| width: 200px; |
| width: 200px; |
| } |
| } |
| /* @todo */ |
| /* @todo */ |
| #menu_sidebar .sidebar_menu { |
| #menu_sidebar .sidebar_menu { |
| padding: 4px 0 9px 0; |
| padding: 4px 0 9px 0; |
| } |
| } |
| /* Same styling for Level 1 and Level 2. */ |
| /* Same styling for Level 1 and Level 2. */ |
| #menu_sidebar .listlevel1 { |
| #menu_sidebar .listlevel1 { |
| float: none; |
| float: none; |
| padding: 1px 0; |
| padding: 1px 0; |
| } |
| } |
| #menu_sidebar .listlevel1:hover .menulevel2, |
| #menu_sidebar .listlevel1:hover .menulevel2, |
| #menu_sidebar .listlevel1.sfhover .menulevel2 { |
| #menu_sidebar .listlevel1.sfhover .menulevel2 { |
| top: 0.35em; |
| top: 0.35em; |
| left: 170px; |
| left: 170px; |
| } |
| } |
| #menu_sidebar .pm_indicator { |
| #menu_sidebar .pm_indicator { |
| font-size: 0.6em; |
| font-size: 0.6em; |
| font-weight: normal; |
| font-weight: normal; |
| } |
| } |
| /* @todo - Note: The next declarations are for keyboard access with js disabled. */ |
| /* @todo - Note: The next declarations are for keyboard access with js disabled. */ |
| /* Hmm. These are tricky with the new Superfish/Superclick combo. */ |
| /* Hmm. These are tricky with the new Superfish/Superclick combo. */ |
| /* May need a noScript class added somewhere. Pondering required. */ |
| /* May need a noScript class added somewhere. Pondering required. */ |
| /* |
| /* |
| #menu_sidebar .linklevel2:focus { |
| #menu_sidebar .linklevel2:focus { |
| margin-left: 10150px; |
| margin-left: 10150px; |
| width: 17em; |
| width: 17em; |
| } |
| } |
| */ |
| */ |
| /* Cancel those for hover and/or js access. */ |
| /* Cancel those for hover and/or js access. */ |
| /* |
| /* |
| #menu_sidebar .listlevel2:hover .linklevel2:focus, #menu_sidebar .listlevel2.sfhover .linklevel2:focus { |
| #menu_sidebar .listlevel2:hover .linklevel2:focus, #menu_sidebar .listlevel2.sfhover .linklevel2:focus { |
| margin-left: 0; |
| margin-left: 0; |
| width: auto; |
| width: auto; |
| } |
| } |
| */ |
| */ |
| |
| |
| |
| |
| /* $LINKTREE */ |
| /* $LINKTREE */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| /* The navigation list (i.e. linktree) */ |
| /* The navigation list (i.e. linktree) */ |
| .navigate_section { |
| .navigate_section { |
| overflow: hidden; |
| overflow: hidden; |
| margin: 3px 0 0 0; |
| margin: 3px 0 0 0; |
| padding-right: 1em; |
| padding-right: 1em; |
| } |
| } |
| #main_content_section .navigate_section { |
| #main_content_section .navigate_section { |
| margin: 12px 0 6px 0; |
| margin: 12px 0 6px 0; |
| } |
| } |
| .linktree { |
| .linktree { |
| position: relative; |
| position: relative; |
| float: left; |
| float: left; |
| font-size: 0.929em; |
| font-size: 0.929em; |
| line-height: 2em; |
| line-height: 2em; |
| display: inline-block; |
| display: inline-block; |
| padding: 0 1.1em 0 2em; |
| padding: 0 1.1em 0 2em; |
| border: none; |
| border: none; |
| |
| white-space: nowrap; |
| } |
| } |
| |
| |
| /* Nifty indicators. */ |
| /* Nifty indicators. */ |
| .linktree:after { |
| .linktree:after { |
| content: ""; |
| content: ""; |
| position: absolute; |
| position: absolute; |
| display: inline-block; |
| display: inline-block; |
| right: -1em; |
| right: -1em; |
| top: 0; |
| top: 0; |
| width: 2em; |
| width: 2em; |
| height: 2em; |
| height: 2em; |
| /* Scale the squares diagonal to = the line-height */ |
| /* Scale the squares diagonal to = the line-height */ |
| transform: scale(0.7071) rotate(45deg); |
| transform: scale(0.7071) rotate(45deg); |
| -webkit-transform: scale(0.7071) rotate(45deg); |
| -webkit-transform: scale(0.7071) rotate(45deg); |
| -ms-transform: scale(0.7071) rotate(45deg); |
| -ms-transform: scale(0.7071) rotate(45deg); |
| z-index: 1; |
| z-index: 1; |
| } |
| } |
| #ie8 .linktree:after { |
| #ie8 .linktree:after { |
| border-right: 1px solid #ccc; |
| border-right: 1px solid #ccc; |
| width: 0; |
| width: 0; |
| right: 0; |
| right: 0; |
| } |
| } |
| .linktree:first-child { |
| .linktree:first-child { |
| padding-left: 1em; |
| padding-left: 1em; |
| } |
| } |
| |
| |
| /* $BUTTONS */ |
| /* $BUTTONS */ |
| /* This section contains code for the quickbuttons (quote, quick edit, etc) |
| /* This section contains code for the quickbuttons (quote, quick edit, etc) |
| /* and for the buttonlist class (reply, add poll, notify, etc). |
| /* and for the buttonlist class (reply, add poll, notify, etc). |
| /* These classes share some styling. |
| /* These classes share some styling. |
| /* Declarations are amalgamated where styling is shared. |
| /* Declarations are amalgamated where styling is shared. |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* Styles for the standard button lists. |
| /* Styles for the standard button lists. |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| .buttonlist { |
| .buttonlist { |
| padding: 5px 5px 0 5px; |
| padding: 5px 5px 0 5px; |
| } |
| } |
| .buttonlist li { |
| .buttonlist li { |
| float: left; |
| float: left; |
| margin: 0 0 0 4px; |
| margin: 0 0 0 4px; |
| line-height: 2.231em; |
| line-height: 2.231em; |
| } |
| } |
| /* @todo - Save code by amalgamating common button background declarations. */ |
| /* @todo - Save code by amalgamating common button background declarations. */ |
| .buttonlist li a { |
| .buttonlist li a { |
| display: block; |
| display: block; |
| padding: 0 6px; |
| padding: 0 6px; |
| font-size: 0.786em; |
| font-size: 0.786em; |
| line-height: 2em; |
| line-height: 2em; |
| } |
| } |
| |
| |
| /* The quick buttons. */ |
| /* The quick buttons. */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| .quickbuttons { |
| .quickbuttons { |
| margin: 8px 0 6px 0; |
| margin: 8px 0 6px 0; |
| text-align: right; |
| text-align: right; |
| } |
| } |
| .quickbuttons li { |
| .quickbuttons li { |
| white-space: nowrap; |
| white-space: nowrap; |
| } |
| } |
| /* Follow ups and topic summary need it a bit different. */ |
| /* Follow ups and topic summary need it a bit different. */ |
| .follow_ups, #topic_summary .quickbuttons { |
| .follow_ups, #topic_summary .quickbuttons { |
| float: right; |
| float: right; |
| margin: -7px 0 0 7px; |
| margin: -7px 0 0 7px; |
| } |
| } |
| /* Most of them. */ |
| /* Most of them. */ |
| .quickbuttons .listlevel1 { |
| .quickbuttons .listlevel1 { |
| position: relative; |
| position: relative; |
| float: right; |
| float: right; |
| margin: 2px 0; |
| margin: 2px 0; |
| padding: 2px 0; |
| padding: 2px 0; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| /* Odd cases. */ |
| /* Odd cases. */ |
| .follow_ups .listlevel1, #topic_summary .quickbuttons .listlevel1 { |
| .follow_ups .listlevel1, #topic_summary .quickbuttons .listlevel1 { |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| .quickbuttons .modified { |
| .quickbuttons .modified { |
| float: left; |
| float: left; |
| padding: 0 0 0 6px; |
| padding: 0 0 0 6px; |
| } |
| } |
| .quickbuttons .inline_mod_check { |
| .quickbuttons .inline_mod_check { |
| margin: 4px 0 0; |
| margin: 4px 0 0; |
| padding: 0 4px; |
| padding: 0 4px; |
| } |
| } |
| .inline_mod_check .input_check { |
| .inline_mod_check .input_check { |
| height: auto; |
| height: auto; |
| margin: 0 0 2px; |
| margin: 0 0 2px; |
| } |
| } |
| |
| |
| /* @todo - Save code by amalgamating common button background declarations. */ |
| /* @todo - Save code by amalgamating common button background declarations. */ |
| .quickbuttons .linklevel1 { |
| .quickbuttons .linklevel1 { |
| float: left; |
| float: left; |
| padding: 1px 6px 0 22px; |
| padding: 1px 6px 0 22px; |
| line-height: 2em; |
| line-height: 2em; |
| cursor: pointer; |
| cursor: pointer; |
| } |
| } |
| /* @todo remove this when we drop ie8 */ |
| /* @todo remove this when we drop ie8 */ |
| #ie8 .quickbuttons .linklevel1 { |
| #ie8 .quickbuttons .linklevel1 { |
| float: none; |
| float: none; |
| } |
| } |
| /* @todo - Check with js disabled after sorting most of the other crud. */ |
| /* @todo - Check with js disabled after sorting most of the other crud. */ |
| /* Note: The next declarations are for keyboard access with js disabled. */ |
| /* Note: The next declarations are for keyboard access with js disabled. */ |
| /*.quickbuttons .linklevel1:focus { |
| /*.quickbuttons .linklevel1:focus { |
| margin: 0 -9910px 0 9910px; |
| margin: 0 -9910px 0 9910px; |
| }*/ |
| }*/ |
| /* Cancel for hover and/or js access. */ |
| /* Cancel for hover and/or js access. */ |
| /*.quickbuttons .listlevel1:hover .linklevel1:focus, .quickbuttons .listlevel1.sfhover .linklevel1:focus { |
| /*.quickbuttons .listlevel1:hover .linklevel1:focus, .quickbuttons .listlevel1.sfhover .linklevel1:focus { |
| margin: 0; |
| margin: 0; |
| }*/ |
| }*/ |
| .quickbuttons .linklevel1:before, .quickbuttons .linklevel2:before { |
| .quickbuttons .linklevel1:before, .quickbuttons .linklevel2:before { |
| position: absolute; |
| position: absolute; |
| z-index: 5; |
| z-index: 5; |
| display: block; |
| display: block; |
| height: 24px; |
| height: 24px; |
| width: 18px; |
| width: 18px; |
| left: 3px; |
| left: 3px; |
| top: 50%; |
| top: 50%; |
| margin-top: -12px; |
| margin-top: -12px; |
| content: ""; |
| content: ""; |
| } |
| } |
| .quickmod_check { |
| .quickmod_check { |
| left: 3px; |
| left: 3px; |
| } |
| } |
| /* The rest of them. */ |
| /* The rest of them. */ |
| .quickbuttons .linklevel1:before, .quickbuttons .linklevel2:before { |
| .quickbuttons .linklevel1:before, .quickbuttons .linklevel2:before { |
| background-repeat: no-repeat; |
| background-repeat: no-repeat; |
| /* A rare example of where longhand background declarations work well. */ |
| /* A rare example of where longhand background declarations work well. */ |
| background-image: url(../images/theme/quickbuttons.png); |
| background-image: url(../images/theme/quickbuttons.png); |
| } |
| } |
| /* The long list of sprite coordinates is much less verbose this way. */ |
| /* The long list of sprite coordinates is much less verbose this way. */ |
| .quote_button:before {background-position: 0 0;} |
| .quote_button:before {background-position: 0 0;} |
| .remove_button:before {background-position: 0 -24px;} |
| .remove_button:before {background-position: 0 -24px;} |
| .modify_button:before {background-position: 0 -48px;} |
| .modify_button:before {background-position: 0 -48px;} |
| .approve_button:before {background-position: 0 -72px;} |
| .approve_button:before {background-position: 0 -72px;} |
| .restore_button:before {background-position: 0 -96px;} |
| .restore_button:before {background-position: 0 -96px;} |
| .split_button:before {background-position: 0 -120px;} |
| .split_button:before {background-position: 0 -120px;} |
| .reply_button:before {background-position: 0 -144px;} |
| .reply_button:before {background-position: 0 -144px;} |
| .reply_all_button:before {background-position: 0 -144px;} |
| .reply_all_button:before {background-position: 0 -144px;} |
| .notify_button:before {background-position: 0 -168px;} |
| .notify_button:before {background-position: 0 -168px;} |
| .unapprove_button:before {background-position: 0 -192px;} |
| .unapprove_button:before {background-position: 0 -192px;} |
| .close_button:before {background-position: 0 -216px;} |
| .close_button:before {background-position: 0 -216px;} |
| .im_reply_button:before {background-position: 0 -240px;} |
| .im_reply_button:before {background-position: 0 -240px;} |
| .details_button:before {background-position: 0 -264px;} |
| .details_button:before {background-position: 0 -264px;} |
| .ignore_button:before {background-position: 0 -288px;} |
| .ignore_button:before {background-position: 0 -288px;} |
| .report_button:before {background-position: 0 -312px;} |
| .report_button:before {background-position: 0 -312px;} |
| .warn_button:before {background-position: 0 -336px;} |
| .warn_button:before {background-position: 0 -336px;} |
| .quotetonew_button:before {background-position: 0 -360px;} |
| .quotetonew_button:before {background-position: 0 -360px;} |
| .like_button:before {background-position: 0 -384px;} |
| .like_button:before {background-position: 0 -384px;} |
| .unlike_button:before {background-position: 0 -408px;} |
| .unlike_button:before {background-position: 0 -408px;} |
| .star_button:before {background-position: 0 -432px;} |
| .star_button:before {background-position: 0 -432px;} |
| .quick_edit:before {background-position: 0 -456px;} |
| .quick_edit:before {background-position: 0 -456px;} |
| .likes_button:before {background-position: 0 -480px;} |
| .likes_button:before {background-position: 0 -480px;} |
| /* No icon here. */ |
| /* No icon here. */ |
| .linklevel1.post_options:before, |
| .linklevel1.post_options:before, |
| .follow_ups .linklevel1:before { |
| .follow_ups .linklevel1:before { |
| display: none; |
| display: none; |
| } |
| } |
| /* "More..." gets custom padding (no icon). */ |
| /* "More..." gets custom padding (no icon). */ |
| .linklevel1.post_options { |
| .linklevel1.post_options { |
| padding: 1px 6px 0 6px; |
| padding: 1px 6px 0 6px; |
| } |
| } |
| /* Follow ups gets custom padding (no icon). */ |
| /* Follow ups gets custom padding (no icon). */ |
| .follow_ups .linklevel1 { |
| .follow_ups .linklevel1 { |
| padding: 1px 6px 0 6px; |
| padding: 1px 6px 0 6px; |
| } |
| } |
| /* Quickbutton and follow ups drop menus. */ |
| /* Quickbutton and follow ups drop menus. */ |
| .quickbuttons .menulevel2, .follow_ups .menulevel2 { |
| .quickbuttons .menulevel2, .follow_ups .menulevel2 { |
| padding: 0.5em; |
| padding: 0.5em; |
| width: auto; |
| width: auto; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .quickbuttons .listlevel1:hover .menulevel2, |
| .quickbuttons .listlevel1:hover .menulevel2, |
| .quickbuttons .listlevel1.sfhover .menulevel2 { |
| .quickbuttons .listlevel1.sfhover .menulevel2 { |
| right: -1px; |
| right: -1px; |
| left: auto; |
| left: auto; |
| } |
| } |
| /* Show appropriate like/unlike action */ |
| /* Show appropriate like/unlike action */ |
| .like_button:before, .likes_button:before, .unlike_button:before { |
| .like_button:before, .likes_button:before, .unlike_button:before { |
| background-position: 0 -480px; |
| background-position: 0 -480px; |
| } |
| } |
| .unlike_button:hover:before { |
| .unlike_button:hover:before { |
| background-position: 0 -408px; |
| background-position: 0 -408px; |
| } |
| } |
| .like_button:hover:before { |
| .like_button:hover:before { |
| background-position: 0 -384px; |
| background-position: 0 -384px; |
| } |
| } |
| .quickbuttons .listlevel2 { |
| .quickbuttons .listlevel2 { |
| width: 12em; |
| width: 12em; |
| } |
| } |
| .follow_ups .listlevel2 { |
| .follow_ups .listlevel2 { |
| width: 20em; |
| width: 20em; |
| } |
| } |
| |
| .follow_ups .linklevel2 { |
| |
| overflow: hidden; |
| |
| text-overflow: ellipsis; |
| |
| } |
| .quickbuttons .linklevel2 { |
| .quickbuttons .linklevel2 { |
| padding: 0 6px 0 26px; |
| padding: 0 6px 0 26px; |
| line-height: 2.1em; |
| line-height: 2.1em; |
| } |
| } |
| |
| |
| /* $PAGELINKS */ |
| /* $PAGELINKS */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* The page navigation area. */ |
| /* The page navigation area. */ |
| .pagesection { |
| .pagesection { |
| clear: both; |
| clear: both; |
| overflow: hidden; |
| overflow: hidden; |
| padding: 4px; |
| padding: 4px; |
| } |
| } |
| .pagesection .floatright input, .pagesection .floatright select { |
| .pagesection .floatright input, .pagesection .floatright select { |
| margin-top: 3px; |
| margin-top: 3px; |
| } |
| } |
| .category_header .pagesection .floatright input, .pagesection .floatright select { |
| .category_header .pagesection .floatright input, .pagesection .floatright select { |
| margin-top: 0; |
| margin-top: 0; |
| } |
| } |
| /* Necessary for some browsers to keep the pages all on the same line */ |
| /* Necessary for some browsers to keep the pages all on the same line */ |
| .linavPages { |
| .linavPages { |
| float: left; |
| float: left; |
| } |
| } |
| .selectbox, .pagelinks { |
| .selectbox, .pagelinks { |
| margin: 5px 0 0 0; |
| margin: 5px 0 0 0; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| /* @todo - Styling will need a bit more thought here. */ |
| /* @todo - Styling will need a bit more thought here. */ |
| /* Do not use display: inline-block;*/ |
| /* Do not use display: inline-block;*/ |
| /* Why not? Because it has a well-known quirk. It's white-space-dependent. */ |
| /* Why not? Because it has a well-known quirk. It's white-space-dependent. */ |
| /* http://robertnyman.com/2010/02/24/css-display-inline-block-why-it-rocks-and-why-it-sucks/ */ |
| /* http://robertnyman.com/2010/02/24/css-display-inline-block-why-it-rocks-and-why-it-sucks/ */ |
| /* Specifically, the section titled "The enormous drawback". */ |
| /* Specifically, the section titled "The enormous drawback". */ |
| /* @todo - Save code by amalgamating common button background declarations. */ |
| /* @todo - Save code by amalgamating common button background declarations. */ |
| .pagelinks .navPages { |
| .pagelinks .navPages { |
| display: block; |
| display: block; |
| float: left; |
| float: left; |
| padding: 1px 5px; |
| padding: 1px 5px; |
| } |
| } |
| |
| |
| .pagelinks .current_page { |
| .pagelinks .current_page { |
| display: block; |
| display: block; |
| float: left; |
| float: left; |
| padding: 1px 8px 1px 8px; |
| padding: 1px 8px 1px 8px; |
| font-weight: bolder; |
| font-weight: bolder; |
| } |
| } |
| .expand_pages { |
| .expand_pages { |
| display: block; |
| display: block; |
| float: left; |
| float: left; |
| min-width: 1.5em; |
| min-width: 1.5em; |
| text-align: center; |
| text-align: center; |
| cursor: pointer; |
| cursor: pointer; |
| font-weight: bold; |
| font-weight: bold; |
| padding: 2px 0; |
| padding: 2px 0; |
| } |
| } |
| .next_page, .previous_page { |
| .next_page, .previous_page { |
| padding: 0 2px; |
| padding: 0 2px; |
| text-transform: capitalize; |
| text-transform: capitalize; |
| } |
| } |
| |
| |
| /* @todo - Fix for all templates. */ |
| /* @todo - Fix for all templates. */ |
| .small_pagelinks { |
| .small_pagelinks { |
| float: right; |
| float: right; |
| margin-top: -2px; |
| margin-top: -2px; |
| } |
| } |
| .small_pagelinks li { |
| .small_pagelinks li { |
| float: left; |
| float: left; |
| } |
| } |
| .small_pagelinks li { |
| .small_pagelinks li { |
| display: inline; |
| display: inline; |
| } |
| } |
| .small_pagelinks .navPages { |
| .small_pagelinks .navPages { |
| padding: 2px 3px 0 3px; |
| padding: 2px 3px 0 3px; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| display: block; |
| display: block; |
| float: left; |
| float: left; |
| } |
| } |
| |
| |
| #expanded_pages_container { |
| #expanded_pages_container { |
| position: absolute; |
| position: absolute; |
| } |
| } |
| #expanded_pages_container, #expanded_pages { |
| #expanded_pages_container, #expanded_pages { |
| overflow: hidden; |
| overflow: hidden; |
| } |
| } |
| #pages_scroll_left, #pages_scroll_right { |
| #pages_scroll_left, #pages_scroll_right { |
| position: absolute; |
| position: absolute; |
| top: 0; |
| top: 0; |
| margin: 0; |
| margin: 0; |
| } |
| } |
| #pages_scroll_left { |
| #pages_scroll_left { |
| left: 0; |
| left: 0; |
| } |
| } |
| #pages_scroll_right { |
| #pages_scroll_right { |
| right: 0; |
| right: 0; |
| } |
| } |
| /* Globally accessible top/bottom links. */ |
| /* Globally accessible top/bottom links. */ |
| #gotop, #gobottom { |
| #gotop, #gobottom { |
| position: fixed; |
| position: fixed; |
| bottom: 50%; |
| bottom: 50%; |
| left: 0; |
| left: 0; |
| z-index: 9; |
| z-index: 9; |
| padding: 1.286em 0.1em 0 0.1em; |
| padding: 1.286em 0.1em 0 0.1em; |
| height: 1.5em; |
| height: 1.5em; |
| font-size: 2em; |
| font-size: 2em; |
| font-weight: bold; |
| font-weight: bold; |
| -webkit-backface-visibility: hidden; |
| -webkit-backface-visibility: hidden; |
| -webkit-transform: translateZ(0); |
| -webkit-transform: translateZ(0); |
| } |
| } |
| #gobottom { |
| #gobottom { |
| top: 50%; |
| top: 50%; |
| padding: 0.8em 0.1em 0.5em 0.1em; |
| padding: 0.8em 0.1em 0.5em 0.1em; |
| } |
| } |
| #gotop:hover, #gobottom:hover { |
| #gotop:hover, #gobottom:hover { |
| text-decoration: none; |
| text-decoration: none; |
| } |
| } |
| /* Skip navigation link. */ |
| /* Skip navigation link. */ |
| #top { |
| #top { |
| position: absolute; |
| position: absolute; |
| top: -10em; |
| top: -10em; |
| left: 3em; |
| left: 3em; |
| padding: 1em 2em; |
| padding: 1em 2em; |
| font-weight: bold; |
| font-weight: bold; |
| background: none repeat scroll 0 0 rgba(0, 0, 0, 0); |
| background: none repeat scroll 0 0 rgba(0, 0, 0, 0); |
| transition: top .5s ease-out 0s, background 1s linear 0s; |
| transition: top .5s ease-out 0s, background 1s linear 0s; |
| } |
| } |
| #top:focus { |
| #top:focus { |
| top: -4px; |
| top: -4px; |
| } |
| } |
| |
| |
| |
| |
| /* $TABLES */ |
| /* $TABLES */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* A general table class. */ |
| /* A general table class. */ |
| .table_grid { |
| .table_grid { |
| margin: 0; |
| margin: 0; |
| width: 100%; |
| width: 100%; |
| border-spacing: 0; |
| border-spacing: 0; |
| border-collapse: collapse; |
| border-collapse: collapse; |
| border-top: none; |
| border-top: none; |
| } |
| } |
| .table_head>th { |
| .table_head>th { |
| padding: 5px 8px; |
| padding: 5px 8px; |
| font-size: 1em; |
| font-size: 1em; |
| font-weight: bold; |
| font-weight: bold; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .table_head>th.centertext { |
| .table_head>th.centertext { |
| text-align: center; |
| text-align: center; |
| } |
| } |
| /* Trial extra classes, for table_heads that have equal width columns. */ |
| /* Trial extra classes, for table_heads that have equal width columns. */ |
| /* @todo - Not sure how much these will be used. Try them out. */ |
| /* @todo - Not sure how much these will be used. Try them out. */ |
| .two_column>th { |
| .two_column>th { |
| width: 50%; |
| width: 50%; |
| } |
| } |
| .three_column>th { |
| .three_column>th { |
| width: 33.333%; |
| width: 33.333%; |
| } |
| } |
| .four_column>th { |
| .four_column>th { |
| width: 25%; |
| width: 25%; |
| } |
| } |
| .five_column>th { |
| .five_column>th { |
| width: 20%; |
| width: 20%; |
| } |
| } |
| /* Basic cells. */ |
| /* Basic cells. */ |
| .table_grid td, .letterspacing{ |
| .table_grid td, .letterspacing{ |
| padding: 5px 8px; |
| padding: 5px 8px; |
| border-bottom: 1px solid #ccc; |
| border-bottom: 1px solid #ccc; |
| } |
| } |
| /* Subtle zebra striping for rows. */ |
| |
| .table_grid .standard_row { |
| |
| background: #fff; |
| |
| } |
| |
| |
| |
| .table_grid textarea { |
| .table_grid textarea { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .table_grid .statsbar div { |
| .table_grid .statsbar div { |
| display: none; |
| display: none; |
| } |
| } |
| .table_grid textarea { |
| .table_grid textarea { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| /* GenericList */ |
| /* GenericList */ |
| .additional_row { |
| .additional_row { |
| padding: 6px 0; |
| padding: 6px 0; |
| } |
| } |
| |
| |
| .sort_by_item .sort, .sort { |
| .sort_by_item .sort, .sort { |
| margin: 0 0 -4px 4px; |
| margin: 0 0 -4px 4px; |
| } |
| } |
| |
| |
| /* For Errors.template.php. */ |
| /* For Errors.template.php. */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| #errorfile_table .current { |
| #errorfile_table .current { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| |
| |
| |
| |
| /* $SETTINGS */ |
| /* $SETTINGS */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* Lists - settings use these a lot. |
| /* Lists - settings use these a lot. |
| /* @todo - Inefficient selector. Should not need dl tag. */ |
| /* @todo - Inefficient selector. Should not need dl tag. */ |
| dl.settings { |
| dl.settings { |
| clear: right; |
| clear: right; |
| overflow: auto; |
| overflow: auto; |
| margin: 0 0 10px 0; |
| margin: 0 0 10px 0; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| dl.settings dt { |
| dl.settings dt { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| margin: 0 0 10px 0; |
| margin: 0 0 10px 0; |
| padding: 0; |
| padding: 0; |
| width: 40%; |
| width: 40%; |
| } |
| } |
| dl.settings .settings_title { |
| dl.settings .settings_title { |
| float: none; |
| float: none; |
| clear: both; |
| clear: both; |
| margin: 0 0 10px 0; |
| margin: 0 0 10px 0; |
| padding: 5px 0 0 0; |
| padding: 5px 0 0 0; |
| width: 100%; |
| width: 100%; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| /* @todo -Inefficient selector. Should not need dl or dt tags. */ |
| /* @todo -Inefficient selector. Should not need dl or dt tags. */ |
| dl.settings dt.windowbg { |
| dl.settings dt.windowbg { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| margin: 0 0 3px 0; |
| margin: 0 0 3px 0; |
| padding: 0 0 5px 0; |
| padding: 0 0 5px 0; |
| width: 98%; |
| width: 98%; |
| } |
| } |
| dl.settings dd { |
| dl.settings dd { |
| float: right; |
| float: right; |
| overflow: auto; |
| overflow: auto; |
| margin: 0 0 3px 0; |
| margin: 0 0 3px 0; |
| padding: 0; |
| padding: 0; |
| width: 55%; |
| width: 55%; |
| min-height: 2em; |
| min-height: 2em; |
| } |
| } |
| /* I'm a tad leary of these setting new margins, but this line is here to compress */ |
| /* I'm a tad leary of these setting new margins, but this line is here to compress */ |
| /* listings in fieldset, like a permissions radio listing, from taking up excess space */ |
| /* listings in fieldset, like a permissions radio listing, from taking up excess space */ |
| .settings dd>fieldset dd, .settings dd>fieldset dt { |
| .settings dd>fieldset dd, .settings dd>fieldset dt { |
| margin: 0; |
| margin: 0; |
| } |
| } |
| dl.settings img { |
| dl.settings img { |
| margin: 0 10px 0 0; |
| margin: 0 10px 0 0; |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| /* help icons */ |
| /* help icons */ |
| dl.settings dt a img { |
| dl.settings dt a img { |
| position: relative; |
| position: relative; |
| vertical-align: top; |
| vertical-align: top; |
| } |
| } |
| dl.settings textarea { |
| dl.settings textarea { |
| width: 85%; |
| width: 85%; |
| padding: 0 0.5em; |
| padding: 0 0.5em; |
| } |
| } |
| dl.settings label { |
| dl.settings label { |
| vertical-align: top; |
| vertical-align: top; |
| } |
| } |
| .settings .smalldescription { |
| .settings .smalldescription { |
| padding-left: 1em; |
| padding-left: 1em; |
| display: inline-block; |
| display: inline-block; |
| } |
| } |
| |
| |
| |
| |
| /* $BOARDS */ |
| /* $BOARDS */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| /* The small stats, under upper linktree. */ |
| /* The small stats, under upper linktree. */ |
| #index_common_stats { |
| #index_common_stats { |
| margin: 0 8px 6px 8px; |
| margin: 0 8px 6px 8px; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| /* The board categories and newsfader - some shared styling. */ |
| /* The board categories and newsfader - some shared styling. */ |
| .forum_category { |
| .forum_category { |
| clear: both; |
| clear: both; |
| margin: 0 0 1em 0; |
| margin: 0 0 1em 0; |
| } |
| } |
| .category_boards, .board_row, .childboard_row { |
| .category_boards, .board_row, .childboard_row { |
| margin: 1px 0 0 0; |
| margin: 1px 0 0 0; |
| } |
| } |
| .board_row { |
| .board_row { |
| padding: 14px 0 11px 0; |
| padding: 14px 0 11px 0; |
| } |
| } |
| .childboard_row { |
| .childboard_row { |
| margin: 0; |
| margin: 0; |
| } |
| } |
| .childboards li:nth-child(n+3):before { |
| .childboards li:nth-child(n+3):before { |
| content: " - "; |
| content: " - "; |
| } |
| } |
| .board_info, .board_latest { |
| .board_info, .board_latest { |
| display: table-cell; |
| display: table-cell; |
| vertical-align: top; |
| vertical-align: top; |
| width: 70%; |
| width: 70%; |
| padding: 0 8px; |
| padding: 0 8px; |
| font-size: 0.929em; |
| font-size: 0.929em; |
| } |
| } |
| .board_latest { |
| .board_latest { |
| width: 40%; |
| width: 40%; |
| min-width: 36em; |
| min-width: 36em; |
| padding: 0 14px; |
| padding: 0 14px; |
| } |
| } |
| .icon_anchor { |
| .icon_anchor { |
| display: block; |
| display: block; |
| text-align: center; |
| text-align: center; |
| min-width: 50px; |
| min-width: 50px; |
| padding: 2px 6px 0 0; |
| padding: 2px 6px 0 0; |
| float: left; |
| float: left; |
| } |
| } |
| .board_name { |
| .board_name { |
| padding: 0 0 1px 0; |
| padding: 0 0 1px 0; |
| font-size: 1.143em; |
| font-size: 1.143em; |
| } |
| } |
| .board_info .board_description, .board_info .moderators { |
| .board_info .board_description, .board_info .moderators { |
| margin: 0 0 0 56px; |
| margin: 0 0 0 56px; |
| } |
| } |
| .moderators { |
| .moderators { |
| font-size: 0.929em; |
| font-size: 0.929em; |
| } |
| } |
| .board_stats { |
| .board_stats { |
| text-align: right; |
| text-align: right; |
| padding: 1px 0 1px 6px; |
| padding: 1px 0 1px 6px; |
| float: right; |
| float: right; |
| min-width: 8.4em; |
| min-width: 8.4em; |
| } |
| } |
| .board_avatar { |
| .board_avatar { |
| float: left; |
| float: left; |
| margin-right: 5px; |
| margin-right: 5px; |
| } |
| } |
| .board_avatar a { |
| .board_avatar a { |
| width: 40px; |
| width: 40px; |
| height: 40px; |
| height: 40px; |
| display: table-cell; |
| display: table-cell; |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| .board_avatar .avatar { |
| .board_avatar .avatar { |
| max-width: 40px; |
| max-width: 40px; |
| max-height: 40px; |
| max-height: 40px; |
| display: block; |
| display: block; |
| margin: auto; |
| margin: auto; |
| } |
| } |
| .lastpost_link, .board_lastposter, .board_lasttime { |
| .lastpost_link, .board_lastposter, .board_lasttime { |
| white-space: pre; |
| white-space: pre; |
| } |
| } |
| .lastpost_link>a { |
| .lastpost_link>a { |
| font-size: 1.071em; |
| font-size: 1.071em; |
| line-height: 1.571em; |
| line-height: 1.571em; |
| } |
| } |
| .board_lasttime { |
| .board_lasttime { |
| display: block; |
| display: block; |
| } |
| } |
| .childboard_row { |
| .childboard_row { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| .childboards { |
| .childboards { |
| margin: 0 14px 0 64px; |
| margin: 0 14px 0 64px; |
| } |
| } |
| .childboards>li { |
| .childboards>li { |
| display: inline-block; |
| display: inline-block; |
| padding: 6px 0.3em 4px 0; |
| padding: 6px 0.3em 4px 0; |
| } |
| } |
| /* The posting icons and mark read button. */ |
| /* The posting icons and mark read button. */ |
| #posting_icons { |
| #posting_icons { |
| margin: 0 0 20px 4px; |
| margin: 0 0 20px 4px; |
| } |
| } |
| #posting_icons p { |
| #posting_icons p { |
| display: table-cell; |
| display: table-cell; |
| padding: 0 6px; |
| padding: 0 6px; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| #posting_icons .buttonlist { |
| #posting_icons .buttonlist { |
| padding: 0; |
| padding: 0; |
| } |
| } |
| #posting_icons img { |
| #posting_icons img { |
| margin: 0 2px; |
| margin: 0 2px; |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| /* Styles for the info center on the board index. */ |
| /* Styles for the info center on the board index. */ |
| #upshrinkHeaderIC .board_row { |
| #upshrinkHeaderIC .board_row { |
| padding: 8px 12px; |
| padding: 8px 12px; |
| } |
| } |
| .ic_section_header { |
| .ic_section_header { |
| margin: 0 0 8px 0; |
| margin: 0 0 8px 0; |
| padding: 0 0 4px 0; |
| padding: 0 0 4px 0; |
| font-size: 1.071em; |
| font-size: 1.071em; |
| } |
| } |
| /* Icons for info centre title bars. */ |
| /* Icons for info centre title bars. */ |
| .ic_section_header .icon{ |
| .ic_section_header .icon{ |
| margin: -3px 4px 0 4px; |
| margin: -3px 4px 0 4px; |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| #ic_recentposts, #ps_recentposts, #ps_recenttopics { |
| #ic_recentposts, #ps_recentposts, #ps_recenttopics { |
| margin: 0 auto; |
| margin: 0 auto; |
| width: 95%; |
| width: 95%; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| border-collapse: collapse; |
| border-collapse: collapse; |
| } |
| } |
| #ps_recentposts .norecent, #ps_recenttopics .norecent { |
| #ps_recentposts .norecent, #ps_recenttopics .norecent { |
| padding: 1em; |
| padding: 1em; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| #ic_recentposts td, #ic_recentposts th, #ps_recentposts td, #ps_recentposts th, #ps_recenttopics td, #ps_recenttopics th { |
| #ic_recentposts td, #ic_recentposts th, #ps_recentposts td, #ps_recentposts th, #ps_recenttopics td, #ps_recenttopics th { |
| padding: 2px 4px; |
| padding: 2px 4px; |
| vertical-align: top; |
| vertical-align: top; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .recentpost { |
| .recentpost { |
| width: 40%; |
| width: 40%; |
| } |
| } |
| .recenttopic { |
| .recenttopic { |
| width: 55%; |
| width: 55%; |
| } |
| } |
| .recentposter { |
| .recentposter { |
| width: 15%; |
| width: 15%; |
| } |
| } |
| .recentboard { |
| .recentboard { |
| width: 20%; |
| width: 20%; |
| } |
| } |
| .recenttime { |
| .recenttime { |
| width: 25%; |
| width: 25%; |
| } |
| } |
| .inline { |
| .inline { |
| padding: 0 32px; |
| padding: 0 29px; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| |
| |
| #sort_by { |
| #sort_by { |
| margin-bottom: -6px; |
| margin-bottom: -6px; |
| |
| min-height: 2.2em; |
| } |
| } |
| #sort_by .input_check { |
| #sort_by .input_check { |
| margin-bottom: 0; |
| margin-bottom: 0; |
| } |
| } |
| .topic_sorting:hover #sortby, #sortby:hover, #sortby { |
| .topic_sorting:hover #sortby, #sortby:hover, #sortby { |
| width: 11em; |
| width: 11em; |
| right: -2.5em; |
| right: -2.5em; |
| } |
| } |
| #sort_by.topic_sorting_recent { |
| #sort_by.topic_sorting_recent { |
| margin: 4px 6px -1px 0; |
| margin: 4px 6px -1px 0; |
| } |
| } |
| .topic_sorting_recent:hover #sortby, .topic_sorting_recent #sortby { |
| .topic_sorting_recent:hover #sortby, .topic_sorting_recent #sortby { |
| right: -1em; |
| right: -1em; |
| } |
| } |
| .sort_by_item { |
| .sort_by_item { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .sort_by_item .sort { |
| .sort_by_item .sort { |
| vertical-align: baseline; |
| vertical-align: baseline; |
| } |
| } |
| .topic_sorting>li { |
| .topic_sorting>li { |
| float: right; |
| float: right; |
| } |
| } |
| .topic_sorting { |
| .topic_sorting { |
| float: right; |
| float: right; |
| font-size: 1.143em; |
| font-size: 1.143em; |
| } |
| } |
| .topic_sorting>li { |
| .topic_sorting>li { |
| padding: 0 3px; |
| padding: 0 3px; |
| } |
| } |
| .topic_sorting.topic_sorting_recent { |
| .topic_sorting.topic_sorting_recent { |
| margin-top: 0; |
| margin-top: 0; |
| } |
| } |
| |
| |
| /* For the who is template. */ |
| /* For the who is template. */ |
| /* Sort of a stray - ?action=who;sa=credits */ |
| /* Sort of a stray - ?action=who;sa=credits */ |
| #credits p { |
| #credits p { |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| font-style: italic; |
| font-style: italic; |
| } |
| } |
| |
| |
| /* @todo - Would prefer to deprecate this. Tied up with js. */ |
| /* @todo - Would prefer to deprecate this. Tied up with js. */ |
| img.new_posts { |
| img.new_posts { |
| padding: 0 1px; |
| padding: 0 1px; |
| } |
| } |
| /* @todo - Not required, or not in this file. */ |
| /* @todo - Not required, or not in this file. */ |
| .fix_rtl_names { |
| .fix_rtl_names { |
| display: inline-block; |
| display: inline-block; |
| } |
| } |
| |
| |
| |
| |
| /* Styles for the message (topic) index. */ |
| /* Styles for the message (topic) index. */ |
| #messageindex, #unread { |
| #messageindex, #unread { |
| clear: both; |
| clear: both; |
| } |
| } |
| .action_unread .topic_sorting #sortby, .action_unread #sortby, |
| .action_unread .topic_sorting #sortby, .action_unread #sortby, |
| .action_unreadreplies .topic_sorting #sortby, .action_unreadreplies #sortby { |
| .action_unreadreplies .topic_sorting #sortby, .action_unreadreplies #sortby { |
| width: 9em; |
| width: 9em; |
| } |
| } |
| #unread_header { |
| #unread_header { |
| margin-top: 0.5em; |
| margin-top: 0.5em; |
| } |
| } |
| /* The board description and who-is-viewing stuff. */ |
| /* The board description and who-is-viewing stuff. */ |
| #description_board { |
| #description_board { |
| margin: 10px 0 0 0; |
| margin: 10px 0 0 0; |
| } |
| } |
| #description_board .generalinfo, #forumposts .generalinfo { |
| #description_board .generalinfo, #forumposts .generalinfo { |
| margin-top: 2px; |
| margin-top: 2px; |
| padding: 4px 4px 4px 12px; |
| padding: 4px 4px 4px 12px; |
| } |
| } |
| #description_board .generalinfo .listlevel2 { |
| #description_board .generalinfo .listlevel2 { |
| white-space: nowrap; |
| white-space: nowrap; |
| } |
| } |
| #description_board .generalinfo { |
| #description_board .generalinfo { |
| display: table; |
| display: table; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .topic_listing { |
| .topic_listing { |
| padding: 1px 0 0 0; |
| padding: 1px 0 0 0; |
| display: table; |
| display: table; |
| width: 100%; |
| width: 100%; |
| border-collapse: collapse; |
| border-collapse: collapse; |
| } |
| } |
| .topic_listing>li { |
| .topic_listing>li { |
| margin: 1px 0 0 0; |
| margin: 1px 0 0 0; |
| display: table-row; |
| display: table-row; |
| } |
| } |
| .topic_sorting>.topic_sorting_row, .topic_listing>.topic_sorting_row { |
| .topic_sorting>.topic_sorting_row, .topic_listing>.topic_sorting_row { |
| margin: 0; |
| margin: 0; |
| } |
| } |
| |
| |
| .topic_sorting_row>h3 { |
| .topic_sorting_row>h3 { |
| display: table-cell; |
| display: table-cell; |
| padding: 10px 12px 8px 12px; |
| padding: 10px 12px 8px 12px; |
| width: 100%; |
| width: 100%; |
| font-weight: bold; |
| font-weight: bold; |
| font-size: 1.071em; |
| font-size: 1.071em; |
| } |
| } |
| .topic_sorting_row>p { |
| .topic_sorting_row>p { |
| display: table-cell; |
| display: table-cell; |
| vertical-align: middle; |
| vertical-align: middle; |
| width: 2%; |
| width: 2%; |
| padding: 8px 8px 0 8px; |
| padding: 8px 8px 0 8px; |
| } |
| } |
| .sort_by_container { |
| .sort_by_container { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| float: right; |
| float: right; |
| vertical-align: top; |
| vertical-align: top; |
| } |
| } |
| .topic_info { |
| .topic_info { |
| display: table-cell; |
| display: table-cell; |
| vertical-align: top; |
| vertical-align: top; |
| width: 70%; |
| width: 70%; |
| padding: 7px 8px 6px 12px; |
| padding: 7px 8px 6px 12px; |
| } |
| } |
| .topic_icons { |
| .topic_icons { |
| float: left; |
| float: left; |
| text-align: center; |
| text-align: center; |
| min-width: 50px; |
| min-width: 50px; |
| padding: 6px 16px 0 0; |
| padding: 6px 16px 0 0; |
| position: relative; |
| position: relative; |
| } |
| } |
| .fred { |
| .fred { |
| position: absolute; |
| position: absolute; |
| left: 42%; |
| left: 42%; |
| top: 16px; |
| top: 16px; |
| } |
| } |
| .topic_name, .topic_starter { |
| .topic_name, .topic_starter { |
| margin: 0 0 0 50px; |
| margin: 0 0 0 50px; |
| } |
| } |
| .topic_name h4 { |
| .topic_name h4 { |
| line-height: 1.429em; |
| line-height: 1.429em; |
| display: inline-block; |
| display: inline-block; |
| padding-right: 30px; |
| padding-right: 30px; |
| } |
| } |
| .topic_name h4 a { |
| .topic_name h4 a { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| .topic_starter { |
| .topic_starter { |
| font-size: 0.929em; |
| font-size: 0.929em; |
| } |
| } |
| .topic_latest { |
| .topic_latest { |
| display: table-cell; |
| display: table-cell; |
| vertical-align: top; |
| vertical-align: top; |
| padding: 7px 4px 6px 4px; |
| padding: 7px 4px 6px 4px; |
| width: auto; |
| width: auto; |
| min-width: 36em; |
| min-width: 36em; |
| white-space: nowrap; |
| white-space: nowrap; |
| font-size: 0.929em; |
| font-size: 0.929em; |
| } |
| } |
| .topic_latest.relative { |
| .topic_latest.relative { |
| min-width: 30em; |
| min-width: 30em; |
| } |
| } |
| #ie8 .topic_latest.relative { |
| #ie8 .topic_latest.relative { |
| min-width: 36em; |
| min-width: 36em; |
| } |
| } |
| .board_lastpost, .topic_lastpost { |
| .board_lastpost, .topic_lastpost { |
| min-width: 21em; |
| min-width: 21em; |
| margin-left: 1em; |
| margin-left: 1em; |
| } |
| } |
| .topic_stats { |
| .topic_stats { |
| text-align: right; |
| text-align: right; |
| display: table-cell; |
| display: table-cell; |
| float: right; |
| float: right; |
| min-width: 14em; |
| min-width: 14em; |
| box-sizing: border-box; |
| box-sizing: border-box; |
| padding: 0 16px 0 16px; |
| padding: 0 16px 0 16px; |
| |
| line-height: 1.429em; |
| } |
| } |
| .topic_lastpost .img_last_post { |
| .topic_lastpost .img_last_post { |
| float: right; |
| float: right; |
| padding: 4px; |
| padding: 4px; |
| } |
| } |
| .topic_moderation, .topic_moderation_alt { |
| .topic_moderation, .topic_moderation_alt { |
| display: table-cell; |
| display: table-cell; |
| vertical-align: middle; |
| vertical-align: middle; |
| width: 2%; |
| width: 2%; |
| padding: 0 8px; |
| padding: 0 8px; |
| } |
| } |
| .topic_moderation_alt { |
| .topic_moderation_alt { |
| min-width: 56px; |
| min-width: 56px; |
| } |
| } |
| .topic_moderation_alt img { |
| .topic_moderation_alt img { |
| padding: 2px 2px 0 2px; |
| padding: 2px 2px 0 2px; |
| } |
| } |
| .topic_listing .warningbox { |
| .topic_listing .warningbox { |
| margin-bottom: 0; |
| margin-bottom: 0; |
| } |
| } |
| .qaction_row { |
| .qaction_row { |
| text-align: right; |
| text-align: right; |
| padding: 6px; |
| padding: 6px; |
| display: block; |
| display: block; |
| } |
| } |
| .basic_row, .sticky_row, .locked_row { |
| .basic_row, .sticky_row, .locked_row { |
| max-width: 100%; |
| max-width: 100%; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| |
| |
| /* Message index icons as sprites |
| /* Message index icons as sprites |
| ------------------------------------------------- */ |
| ------------------------------------------------- */ |
| .topicicon:before, |
| .topicicon:before, |
| .sticky_row .topic_info:before, .locked_row .topic_info:before, |
| .sticky_row .topic_info:before, .locked_row .topic_info:before, |
| .sticky_row .topic_details:before, .locked_row .topic_details:before, |
| .sticky_row .topic_details:before, .locked_row .topic_details:before, |
| .locked_row.sticky_row .topic_info:before { |
| .locked_row.sticky_row .topic_info:before { |
| background-image: url(../images/topic/topicicons.png); |
| background-image: url(../images/topic/topicicons.png); |
| background-repeat: no-repeat; |
| background-repeat: no-repeat; |
| content: ""; |
| content: ""; |
| display: inline-block; |
| display: inline-block; |
| height: 16px; |
| height: 16px; |
| vertical-align: middle; |
| vertical-align: middle; |
| width: 18px; |
| width: 18px; |
| } |
| } |
| .topicicon:before { |
| .topicicon:before { |
| height: 18px; |
| height: 18px; |
| } |
| } |
| /* Sprite icons for quick moderation, last post, sort etc */ |
| /* Sprite icons for quick moderation, last post, sort etc */ |
| .img_last_post:before {background-position: 0 0;} |
| .img_last_post:before {background-position: 0 0;} |
| .img_poll:before {background-position: 0 -19px;} |
| .img_poll:before {background-position: 0 -19px;} |
| .img_profile:before {background-position: 0 -37px} |
| .img_profile:before {background-position: 0 -37px} |
| .img_locked:before {background-position: 0 -55px;} |
| .img_locked:before {background-position: 0 -55px;} |
| .img_move:before {background-position: 0 -73px;} |
| .img_move:before {background-position: 0 -73px;} |
| .img_remove:before {background-position: 0 -91px;} |
| .img_remove:before {background-position: 0 -91px;} |
| .img_sticky:before {background-position: 0 -109px;} |
| .img_sticky:before {background-position: 0 -109px;} |
| .img_sortdown:before {background-position: 0 -127px;} |
| .img_sortdown:before {background-position: 0 -127px;} |
| .img_sortup:before {background-position: 0 -145px;} |
| .img_sortup:before {background-position: 0 -145px;} |
| .img_normal:before {background-position: 0 -163px;} |
| .img_normal:before {background-position: 0 -163px;} |
| .img_lockedsticky:before {background-position: 0 -181px;} |
| .img_lockedsticky:before {background-position: 0 -181px;} |
| /* Sprite Icons for the message icon, ? ! xx etc. */ |
| /* Sprite Icons for the message icon, ? ! xx etc. */ |
| .img_clip:before {background-position: -18px 0;} |
| .img_clip:before {background-position: -18px 0;} |
| .img_lamp:before {background-position: -18px -18px;} |
| .img_lamp:before {background-position: -18px -18px;} |
| .img_poll:before {background-position: -18px -36px} |
| .img_poll:before {background-position: -18px -36px} |
| .img_question:before {background-position: -18px -54px;} |
| .img_question:before {background-position: -18px -54px;} |
| .img_xx:before {background-position: -18px -72px;} |
| .img_xx:before {background-position: -18px -72px;} |
| .img_moved:before {background-position: -18px -90px;} |
| .img_moved:before {background-position: -18px -90px;} |
| .img_exclamation:before {background-position: -18px -108px;} |
| .img_exclamation:before {background-position: -18px -108px;} |
| .img_thumbup:before {background-position: -18px -126px;} |
| .img_thumbup:before {background-position: -18px -126px;} |
| .img_thumbdown:before {background-position: -18px -144px;} |
| .img_thumbdown:before {background-position: -18px -144px;} |
| /* sticky / locked icons for the upper right of the div */ |
| /* sticky / locked icons for the upper right of the div */ |
| .sticky_row .topic_info:before, .locked_row .topic_info:before, |
| .sticky_row .topic_info:before, .locked_row .topic_info:before, |
| .sticky_row .topic_details:before, .locked_row .topic_details:before, |
| .sticky_row .topic_details:before, .locked_row .topic_details:before, |
| .locked_row.sticky_row .topic_info:before { |
| .locked_row.sticky_row .topic_info:before { |
| float: right; |
| float: right; |
| margin-right: -16px; |
| margin-right: -16px; |
| } |
| } |
| .sticky_row .topic_info:before, .sticky_row .topic_details:before {background-position: 0 -108px;} |
| .sticky_row .topic_info:before, .sticky_row .topic_details:before {background-position: 0 -108px;} |
| .locked_row .topic_info:before, .locked_row .topic_details:before {background-position: 0 -54px;} |
| .locked_row .topic_info:before, .locked_row .topic_details:before {background-position: 0 -54px;} |
| .locked_row.sticky_row .topic_info:before{background-position: 0 -180px; width: 30px;} |
| .locked_row.sticky_row .topic_info:before{background-position: 0 -180px; width: 30px;} |
| |
| |
| /* @todo - Extra classes for search results, etc. See if I can clean them up. */ |
| /* @todo - Extra classes for search results, etc. See if I can clean them up. */ |
| |
| |
| |
| |
| /* Search results need some help as well */ |
| /* Search results need some help as well */ |
| /* @todo - Sort markup so this can call above classes. *//* |
| /* @todo - Sort markup so this can call above classes. *//* |
| .search_results_posts .lockedbg { |
| .search_results_posts .lockedbg { |
| background: #efefef url(../images/icons/quick_lock.png) no-repeat 95% 15px; |
| background: #efefef url(../images/icons/quick_lock.png) no-repeat 95% 15px; |
| } |
| } |
| .search_results_posts .stickybg, .search_results_posts .locked_stickybg { |
| .search_results_posts .stickybg, .search_results_posts .locked_stickybg { |
| background: #fffee2 url(../images/icons/quick_sticky_lock.png) no-repeat 95% 15px; |
| background: #fffee2 url(../images/icons/quick_sticky_lock.png) no-repeat 95% 15px; |
| }*/ |
| }*/ |
| |
| |
| #quick_mod_jump_to { |
| #quick_mod_jump_to { |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| #topic_icons { |
| #topic_icons { |
| float: left; |
| float: left; |
| margin-top: 10px; |
| margin-top: 10px; |
| padding: 8px 12px; |
| padding: 8px 12px; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| #topic_icons p { |
| #topic_icons p { |
| padding: 0 6px; |
| padding: 0 6px; |
| line-height: 2em; |
| line-height: 2em; |
| } |
| } |
| #message_index_jump_to { |
| #message_index_jump_to { |
| font-size: 1.143em; |
| font-size: 1.143em; |
| } |
| } |
| #message_index_jump_to .right_submit { |
| #message_index_jump_to .right_submit { |
| margin: 1px 0 0; |
| margin: 1px 0 0; |
| } |
| } |
| .jump_to_header { |
| .jump_to_header { |
| padding: 0 4px; |
| padding: 0 4px; |
| border: none; |
| border: none; |
| -moz-box-sizing: border-box; |
| -moz-box-sizing: border-box; |
| -webkit-box-sizing: border-box; |
| -webkit-box-sizing: border-box; |
| box-sizing: border-box; |
| box-sizing: border-box; |
| } |
| } |
| |
| |
| |
| |
| /* $TOPICS */ |
| /* $TOPICS */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* The display template (topic view). |
| /* The display template (topic view). |
| /* Events */ |
| /* Events */ |
| .linked_events { |
| .linked_events { |
| padding: 12px 0; |
| padding: 12px 0; |
| } |
| } |
| .edit_event { |
| .edit_event { |
| margin: 0 5px 0 0; |
| margin: 0 5px 0 0; |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| /* Poll question */ |
| /* Poll question */ |
| #poll { |
| #poll { |
| overflow: hidden; |
| overflow: hidden; |
| } |
| } |
| #poll_main ul { |
| #poll_main ul { |
| margin-top: 8px; |
| margin-top: 8px; |
| } |
| } |
| #poll .content { |
| #poll .content { |
| padding: 0 12px; |
| padding: 0 12px; |
| } |
| } |
| #pollquestion { |
| #pollquestion { |
| padding: 0 0 6px 25px; |
| padding: 0 0 6px 25px; |
| } |
| } |
| |
| |
| /* Poll vote options */ |
| /* Poll vote options */ |
| #poll_options .statsbar { |
| #poll_options .statsbar { |
| padding: 0; |
| padding: 0; |
| } |
| } |
| #poll_options .options { |
| #poll_options .options { |
| margin: 0 0 12px 0; |
| margin: 0 0 12px 0; |
| padding: 12px 30px 0 25px; |
| padding: 12px 30px 0 25px; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| #poll_options .options li:after { |
| #poll_options .options li:after { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| content: ""; |
| content: ""; |
| } |
| } |
| /* Poll results */ |
| /* Poll results */ |
| #poll_options .results { |
| #poll_options .results { |
| display: inline; |
| display: inline; |
| } |
| } |
| #poll_options li { |
| #poll_options li { |
| position: relative; |
| position: relative; |
| } |
| } |
| /* Absolute positioning stops these breaking the bars on narrow screens. */ |
| /* Absolute positioning stops these breaking the bars on narrow screens. */ |
| #poll_options .options .percentage { |
| #poll_options .options .percentage { |
| position: absolute; |
| position: absolute; |
| top: 0; |
| top: 0; |
| right: 0; |
| right: 0; |
| z-index: 2; |
| z-index: 2; |
| display: block; |
| display: block; |
| float: right; |
| float: right; |
| padding: 0 2px; |
| padding: 0 2px; |
| white-space: pre; |
| white-space: pre; |
| margin: 3px; |
| margin: 3px; |
| line-height: 1.2em; |
| line-height: 1.2em; |
| } |
| } |
| /* Poll notices */ |
| /* Poll notices */ |
| #poll_options p { |
| #poll_options p { |
| margin: 0 18px 2px 18px; |
| margin: 0 18px 2px 18px; |
| padding: 0 6px 6px 6px; |
| padding: 0 6px 6px 6px; |
| } |
| } |
| #pollmoderation { |
| #pollmoderation { |
| overflow: auto; |
| overflow: auto; |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| |
| |
| /* On to the posts */ |
| /* On to the posts */ |
| .forumposts { |
| .forumposts { |
| clear: both; |
| clear: both; |
| margin: 8px 0 0 0; |
| margin: 8px 0 0 0; |
| } |
| } |
| /* Topic information */ |
| /* Topic information */ |
| .views_text, .nextlinks { |
| .views_text, .nextlinks { |
| white-space: pre; |
| white-space: pre; |
| font-size: 0.786em; |
| font-size: 0.786em; |
| } |
| } |
| .nextlinks { |
| .nextlinks { |
| float: right; |
| float: right; |
| } |
| } |
| #whoisviewing, #redirectfrom { |
| #whoisviewing, #redirectfrom { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| padding: 4px 0 3px 0; |
| padding: 4px 0 3px 0; |
| } |
| } |
| #redirectfrom { |
| #redirectfrom { |
| display: inline-block; |
| display: inline-block; |
| } |
| } |
| /* Poster and postarea + moderation area underneath */ |
| /* Poster and postarea + moderation area underneath */ |
| .forumposts .windowbg, .forumposts .windowbg2, |
| .forumposts .windowbg, .forumposts .windowbg2, |
| .forumposts .approvebg, .forumposts .approvebg2, .core_posts { |
| .forumposts .approvebg, .forumposts .approvebg2, .core_posts { |
| overflow: visible; |
| overflow: visible; |
| margin: 4px 0 0 0; |
| margin: 4px 0 0 0; |
| } |
| } |
| /* @todo remove the div when div.windowbg and div.windowbg2 are sorted out */ |
| /* @todo remove the div when div.windowbg and div.windowbg2 are sorted out */ |
| div.core_posts { |
| div.core_posts { |
| padding: 0.2em 1em; |
| padding: 0.2em 1em; |
| } |
| } |
| |
| |
| /* Poster details and list of items */ |
| /* Poster details and list of items */ |
| .poster { |
| .poster { |
| display: table-cell; |
| display: table-cell; |
| vertical-align: top; |
| vertical-align: top; |
| width: 15em; |
| width: 15em; |
| word-wrap: break-word; |
| word-wrap: break-word; |
| word-break: break-all; |
| word-break: break-all; |
| -webkit-hyphens: auto; |
| -webkit-hyphens: auto; |
| -moz-hyphens: auto; |
| -moz-hyphens: auto; |
| -ms-hyphens: auto; |
| -ms-hyphens: auto; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| .poster.poster2 { |
| .poster.poster2 { |
| display: block; |
| display: block; |
| float: left; |
| float: left; |
| margin: 0; |
| margin: 0; |
| min-width: 0; |
| min-width: 0; |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| .poster .listlevel1, .poster.poster2 .listlevel1 { |
| .poster .listlevel1, .poster.poster2 .listlevel1 { |
| float: none; |
| float: none; |
| text-align: center; |
| text-align: center; |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| /* @todo - Add an h3 for a11y? Breaks Stoopidfish. Bleh. :P */ |
| /* @todo - Add an h3 for a11y? Breaks Stoopidfish. Bleh. :P */ |
| .poster .name { |
| .poster .name { |
| overflow: hidden; |
| overflow: hidden; |
| margin-top: -0.4em; |
| margin-top: -0.4em; |
| padding: 6px; |
| padding: 6px; |
| text-align: center; |
| text-align: center; |
| font-weight: bold; |
| font-weight: bold; |
| font-size: 1.357em; |
| font-size: 1.357em; |
| text-overflow: ellipsis; |
| text-overflow: ellipsis; |
| } |
| } |
| .poster.poster2 .name { |
| .poster.poster2 .name { |
| margin-top: 0; |
| margin-top: 0; |
| padding: 0 8px 0 0; |
| padding: 0 8px 0 0; |
| text-align: left; |
| text-align: left; |
| font-size: 1.143em; |
| font-size: 1.143em; |
| } |
| } |
| .poster .name { |
| .poster .name { |
| white-space: normal; |
| white-space: normal; |
| word-break: normal; |
| word-break: normal; |
| } |
| } |
| /* Drop menu for the poster info. */ |
| /* Drop menu for the poster info. */ |
| .poster .listlevel1.sfhover .menulevel2, .poster .listlevel1:hover .menulevel2 { |
| .poster .listlevel1.sfhover .menulevel2, .poster .listlevel1:hover .menulevel2 { |
| top: 95%; |
| top: 95%; |
| left: 0; |
| left: 0; |
| padding: 6px 1em 4px 1em; |
| padding: 6px 1em 4px 1em; |
| width: 16em; |
| width: 16em; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .poster .listlevel2 { |
| .poster .listlevel2 { |
| width: 14em; |
| width: 15em; |
| } |
| } |
| .poster .title { |
| .poster .title { |
| white-space: normal; |
| white-space: normal; |
| word-wrap: break-word; |
| word-wrap: break-word; |
| max-width: 14em; |
| max-width: 100%; |
| } |
| } |
| .poster .linklevel2, .poster .linklevel2:focus, |
| .poster .linklevel2, .poster .linklevel2:focus, |
| .poster .listlevel2:hover .linklevel2 { |
| .poster .listlevel2:hover .linklevel2 { |
| border: 1px solid transparent; |
| border: 1px solid transparent; |
| background: none; |
| background: none; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| .poster .listlevel2:hover .linklevel2:hover { |
| .poster .listlevel2:hover .linklevel2:hover { |
| text-decoration: underline; |
| text-decoration: underline; |
| } |
| } |
| .karma_allow>.linklevel2 { |
| .karma_allow>.linklevel2 { |
| display: inline-block; |
| display: inline-block; |
| } |
| } |
| .listlevel2>ol>li { |
| .listlevel2>ol>li { |
| display: table-cell; |
| display: table-cell; |
| } |
| } |
| .report_seperator { |
| .report_seperator { |
| margin: 6px 0 0 0; |
| margin: 6px 0 0 0; |
| height: 1px; |
| height: 1px; |
| } |
| } |
| /* Icon tweaks for several areas. */ |
| /* Icon tweaks for several areas. */ |
| .poster .icons>img, .poster .linklevel1>img, .poster .linklevel2>img { |
| .poster .icons>img, .poster .linklevel1>img, .poster .linklevel2>img { |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| .listlevel2>ol>li img, .listlevel2.warning img, .listlevel2.poster_ip img { |
| .listlevel2>ol>li img, .listlevel2.warning img, .listlevel2.poster_ip img { |
| padding: 0 4px; |
| padding: 0 4px; |
| } |
| } |
| .listlevel2.poster_ip .linklevel2 { |
| .listlevel2.poster_ip .linklevel2 { |
| display: inline; |
| display: inline; |
| } |
| } |
| .avatar { |
| .avatar { |
| width: auto; |
| width: auto; |
| height: auto; |
| height: auto; |
| max-width: 13em; |
| max-width: 13em; |
| max-height: 20em; |
| max-height: 20em; |
| } |
| } |
| /* The visible stuff below the avatar. */ |
| /* The visible stuff below the avatar. */ |
| .poster .membergroup { |
| .poster .membergroup { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| /* @todo - Save code by amalgamating common button background declarations. */ |
| /* @todo - Save code by amalgamating common button background declarations. */ |
| .poster_online .linklevel1 { |
| .poster_online .linklevel1 { |
| position: relative; |
| position: relative; |
| display: block; |
| display: block; |
| margin: 3px 1.5em; |
| margin: 3px 1.5em; |
| line-height: 2em; |
| line-height: 2em; |
| } |
| } |
| /* End nifty new flyout. */ |
| /* End nifty new flyout. */ |
| |
| |
| .poster { |
| .poster { |
| float: left; |
| float: left; |
| } |
| } |
| .post_wrapper { |
| .post_wrapper { |
| display: block; |
| display: block; |
| width: 100%; |
| width: 100%; |
| clear: both; |
| clear: both; |
| } |
| } |
| .postarea { |
| .postarea { |
| display: block; |
| display: block; |
| margin: 0 0 0 13em; |
| margin: 0 0 0 13em; |
| padding: 0 1em 0 1.5em; |
| padding: 0 1em 0 1.5em; |
| max-width: 100%; |
| max-width: 100%; |
| } |
| } |
| .postarea2 { |
| .postarea2 { |
| display: block; |
| display: block; |
| padding: 0 1em; |
| padding: 0 1em; |
| } |
| } |
| |
| |
| #topic_summary .postarea2 { |
| #topic_summary .postarea2 { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| .post_subject { |
| .post_subject { |
| display: block; |
| display: block; |
| float: right; |
| float: right; |
| overflow: hidden; |
| overflow: hidden; |
| max-width: 15em; |
| max-width: 15em; |
| text-overflow: ellipsis; |
| text-overflow: ellipsis; |
| white-space: pre; |
| white-space: pre; |
| } |
| } |
| .messageicon { |
| .messageicon { |
| float: left; |
| float: left; |
| margin: -2px 6px -6px 0; |
| margin: -2px 6px -6px 0; |
| } |
| } |
| .messageicon img { |
| .messageicon img { |
| padding: 0 3px 0 3px; |
| padding: 0 3px 0 3px; |
| } |
| } |
| .groupicon { |
| .groupicon { |
| float: left; |
| float: left; |
| margin: 2px 0 0 2px; |
| margin: 2px 0 0 2px; |
| } |
| } |
| .groupicon img { |
| .groupicon img { |
| padding: 0 3px 0 3px; |
| padding: 0 3px 0 3px; |
| } |
| } |
| .keyinfo { |
| .keyinfo { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| #topic_summary .keyinfo { |
| #topic_summary .keyinfo { |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| .keyinfo h5 { |
| .keyinfo h5 { |
| padding: 1px 0 5px 0; |
| padding: 1px 0 5px 0; |
| } |
| } |
| #topic_summary .keyinfo h5 { |
| #topic_summary .keyinfo h5 { |
| padding: 0; |
| padding: 0; |
| font-size: 1.143em; |
| font-size: 1.143em; |
| } |
| } |
| /* @todo - Move strong tag outside anchor. Will save css. */ |
| /* @todo - Move strong tag outside anchor. Will save css. */ |
| .keyinfo h5 a, .keyinfo h5 a strong { |
| .keyinfo h5 a, .keyinfo h5 a strong { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| .inner { |
| .inner { |
| margin: 0; |
| margin: 0; |
| padding: 7px 8px 2px 2px; |
| padding: 7px 8px 2px 2px; |
| min-height: 70px; |
| min-height: 70px; |
| word-wrap: break-word; |
| word-wrap: break-word; |
| -webkit-hyphens: auto; |
| -webkit-hyphens: auto; |
| -moz-hyphens: auto; |
| -moz-hyphens: auto; |
| -ms-hyphens: auto; |
| -ms-hyphens: auto; |
| } |
| } |
| #topic_summary .inner { |
| #topic_summary .inner { |
| clear: both; |
| clear: both; |
| } |
| } |
| .smiley { |
| .smiley { |
| vertical-align: bottom; |
| vertical-align: bottom; |
| } |
| } |
| /* All the signatures used in the forum. */ |
| /* All the signatures used in the forum. */ |
| .signature, .attachments, .custom_fields_above_signature { |
| .signature, .attachments, .custom_fields_above_signature { |
| overflow: auto; |
| overflow: auto; |
| padding: 8px 0; |
| padding: 8px 0; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| .attachments { |
| .attachments { |
| margin: 20px 0 0 0; |
| margin: 20px 0 0 0; |
| |
| clear: both; |
| } |
| } |
| .attachments .attachment { |
| .attachments .attachment { |
| padding: 6px 8px; |
| padding: 6px 8px; |
| display: inline-block; |
| display: inline-block; |
| min-width: 22%; |
| min-width: 22%; |
| } |
| } |
| .attachment_thumb { |
| .attachment_thumb { |
| margin: 0 auto; |
| margin: 0 auto; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| /* @todo - Look at deprecating this hr. */ |
| /* @todo - Look at deprecating this hr. */ |
| .attachments hr { |
| .attachments hr { |
| clear: both; |
| clear: both; |
| } |
| } |
| /* Separator of posts. More useful in the print stylesheet. */ |
| /* Separator of posts. More useful in the print stylesheet. */ |
| .forumposts .post_separator { |
| .forumposts .post_separator { |
| display: none; |
| display: none; |
| } |
| } |
| /* Used by video embed JS when autolinking video links */ |
| /* Used by video embed JS when autolinking video links */ |
| .elk_video { |
| .elk_video { |
| display: block; |
| display: block; |
| width: 640px; |
| width: 640px; |
| height: auto; |
| height: auto; |
| max-height: 480px; |
| max-height: 480px; |
| } |
| } |
| .elk_video a img, .elk_video embed { |
| .elk_video a img, .elk_video embed { |
| margin: 0 auto; |
| margin: 0 auto; |
| display: block; |
| display: block; |
| } |
| } |
| .elk_videoheader { |
| .elk_videoheader { |
| padding: 0 4px 0 6px; |
| padding: 0 4px 0 6px; |
| width: 630px; |
| width: 630px; |
| max-width: 98%; |
| max-width: 98%; |
| } |
| } |
| .elk_previewvideo { |
| .elk_previewvideo { |
| max-width: 640px; |
| max-width: 640px; |
| height: auto; |
| height: auto; |
| } |
| } |
| /* Basic stuff for the bottom of Display.template.php. */ |
| /* Basic stuff for the bottom of Display.template.php. */ |
| #moderationbuttons { |
| #moderationbuttons { |
| float: left; |
| float: left; |
| } |
| } |
| #moderationbuttons_strip { |
| #moderationbuttons_strip { |
| float: left; |
| float: left; |
| margin: 4px 0 4px -4px; |
| margin: 4px 0 4px -4px; |
| } |
| } |
| #moderationbuttons ul li { |
| #moderationbuttons ul li { |
| margin: 0; |
| margin: 0; |
| padding: 0 6px 4px 0; |
| padding: 0 6px 4px 0; |
| } |
| } |
| |
| |
| /* The jump to box */ |
| /* The jump to box */ |
| #display_jump_to { |
| #display_jump_to { |
| float: right; |
| float: right; |
| padding: 6px 5px 5px 0; |
| padding: 6px 5px 5px 0; |
| white-space: nowrap; |
| white-space: nowrap; |
| } |
| } |
| #display_jump_to input { |
| #display_jump_to input { |
| vertical-align: baseline; |
| vertical-align: bottom; |
| } |
| } |
| |
| |
| /* The quick reply area. */ |
| /* The quick reply area. */ |
| /* @todo - Markup and CSS could be tweaked here. */ |
| /* @todo - Markup and CSS could be tweaked here. */ |
| #quickreplybox { |
| #quickreplybox { |
| clear: both; |
| clear: both; |
| } |
| } |
| .editor_wrapper { |
| .editor_wrapper { |
| margin: 0 auto; |
| margin: 0 auto; |
| width: 60em; |
| width: 60em; |
| max-width: 97%; |
| max-width: 97%; |
| } |
| } |
| #quickReplyOptions form .quickreply { |
| #quickReplyOptions form .quickreply { |
| min-width: 100%; |
| min-width: 100%; |
| max-width: 100%; |
| max-width: 100%; |
| width: 635px; |
| width: 635px; |
| height: 100px; |
| height: 100px; |
| } |
| } |
| /* The send topic section. */ |
| /* The send topic section. */ |
| fieldset.send_topic { |
| fieldset.send_topic { |
| padding: 6px; |
| padding: 6px; |
| border: none; |
| border: none; |
| margin: 0; |
| margin: 0; |
| box-shadow: none; |
| box-shadow: none; |
| } |
| } |
| dl.send_topic { |
| dl.send_topic { |
| margin-bottom: 0; |
| margin-bottom: 0; |
| } |
| } |
| dl.send_mail dt { |
| dl.send_mail dt { |
| width: 35%; |
| width: 35%; |
| } |
| } |
| dl.send_mail dd { |
| dl.send_mail dd { |
| width: 64%; |
| width: 64%; |
| } |
| } |
| .requiredfield:before { |
| .requiredfield:before { |
| height: 0; |
| height: 0; |
| position: absolute; |
| position: absolute; |
| width: 0; |
| width: 0; |
| bottom: 90%; |
| bottom: 90%; |
| left: 5%; |
| left: 5%; |
| } |
| } |
| .requiredfield { |
| .requiredfield { |
| position: absolute; |
| position: absolute; |
| top: 20px; |
| top: 20px; |
| left: 5%; |
| left: 5%; |
| font-size: 90%; |
| font-size: 90%; |
| line-height: 1.1em; |
| line-height: 1.1em; |
| display: none; |
| display: none; |
| } |
| } |
| .popup_content .r_name, .popup_content .r_email, |
| .popup_content .r_name, .popup_content .r_email, |
| .popup_content .y_name, .popup_content .y_email { |
| .popup_content .y_name, .popup_content .y_email { |
| position: relative; |
| position: relative; |
| overflow: visible !important; |
| overflow: visible !important; |
| } |
| } |
| .popup_content dl.settings dt { |
| .popup_content dl.settings dt { |
| margin-bottom: 15px; |
| margin-bottom: 15px; |
| } |
| } |
| |
| |
| |
| |
| /* $EDITOR */ |
| /* $EDITOR */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* The main post editor section. */ |
| /* The main post editor section. */ |
| #preview_body { |
| #preview_body { |
| padding: 0.5em 1em; |
| padding: 0.5em 1em; |
| overflow: auto; |
| overflow: auto; |
| margin: 2px 0 0; |
| margin: 2px 0 0; |
| } |
| } |
| #postmodify #message{ |
| #postmodify #message{ |
| width: 100%; |
| width: 100%; |
| } |
| } |
| #postmodify .lastedit{ |
| #postmodify .lastedit{ |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| #post_header, .postbox { |
| #post_header, .postbox { |
| overflow: hidden; |
| overflow: hidden; |
| padding: 6px; |
| padding: 6px; |
| } |
| } |
| #post_header dt, .postbox dt { |
| #post_header dt, .postbox dt { |
| float: left; |
| float: left; |
| margin: 6px 0 0 0; |
| margin: 6px 0 0 0; |
| padding: 0; |
| padding: 0; |
| width: 15%; |
| width: 15%; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| #post_header dd, .postbox dd { |
| #post_header dd, .postbox dd { |
| float: left; |
| float: left; |
| margin: 4px 0; |
| margin: 4px 0; |
| padding: 0; |
| padding: 0; |
| width: 83%; |
| width: 83%; |
| } |
| } |
| #post_header img { |
| #post_header img { |
| vertical-align: middle; |
| vertical-align: middle; |
| padding: 0 0 2px 5px; |
| padding: 0 0 2px 5px; |
| } |
| } |
| ul.post_options { |
| ul.post_options { |
| overflow: auto; |
| overflow: auto; |
| margin: 0 0 0 12px; |
| margin: 0 0 0 12px; |
| } |
| } |
| ul.post_options li { |
| ul.post_options li { |
| float: left; |
| float: left; |
| margin: 2px 0; |
| margin: 2px 0; |
| width: 33%; |
| width: 33%; |
| } |
| } |
| #postAdditionalOptionsHeader, #postDraftOptionsHeader { |
| #postAdditionalOptionsHeader, #postDraftOptionsHeader { |
| margin: 1em 0 0 0; |
| margin: 1em 0 0 0; |
| } |
| } |
| #postAdditionalOptions, #postDraftOptions { |
| #postAdditionalOptions, #postDraftOptions { |
| margin: 0 0 1em 0; |
| margin: 0 0 1em 0; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| #postAdditionalOptionsNC { |
| #postAdditionalOptionsNC { |
| margin: 0 0 1em 0; |
| margin: 0 0 1em 0; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| .shortcuts { |
| .shortcuts { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| float: left; |
| float: left; |
| } |
| } |
| .shortcuts .lastedit { |
| .shortcuts .lastedit { |
| text-align: left; |
| text-align: left; |
| } |
| } |
| #mobile .shortcuts { |
| #mobile .shortcuts { |
| display: none; |
| display: none; |
| } |
| } |
| |
| |
| /* $DRAG-N-DROP */ |
| /* $DRAG-N-DROP */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| .drop_area { |
| .drop_area { |
| font-size: 1.643em; |
| font-size: 1.643em; |
| font-weight: normal; |
| font-weight: normal; |
| text-align: center; |
| text-align: center; |
| opacity: 0.6; |
| opacity: 0.6; |
| display: none; |
| display: none; |
| padding: 1em 0; |
| padding: 1em 0; |
| } |
| } |
| .drop_area_fileselect { |
| .drop_area_fileselect { |
| cursor: pointer; |
| cursor: pointer; |
| margin-left: -190px; |
| margin-left: -190px; |
| opacity: 0.0001; |
| opacity: 0.0001; |
| position: absolute; |
| position: absolute; |
| width: 220px; |
| width: 220px; |
| padding-left: 220px; |
| padding-left: 220px; |
| } |
| } |
| |
| |
| #postAttachment >dd.progress_tracker { |
| #postAttachment >dd.progress_tracker { |
| margin:0; |
| margin:0; |
| } |
| } |
| .progress_tracker { |
| .progress_tracker { |
| overflow: hidden; |
| overflow: hidden; |
| width: 97%; |
| width: 97%; |
| } |
| } |
| .statusbar { |
| .statusbar { |
| padding: 5px; |
| padding: 5px; |
| overflow: hidden; |
| overflow: hidden; |
| } |
| } |
| .info { |
| .info { |
| float: left; |
| float: left; |
| position: relative; |
| position: relative; |
| overflow: hidden; |
| overflow: hidden; |
| width: 60%; |
| width: 60%; |
| line-height: 1.375em; |
| line-height: 1.375em; |
| } |
| } |
| .progressBar { |
| .progressBar { |
| width: 20%; |
| width: 20%; |
| border-radius: 5px; |
| border-radius: 5px; |
| float: left; |
| float: left; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| .abort, .remove { |
| .abort, .remove { |
| float: right; |
| float: right; |
| overflow: hidden; |
| overflow: hidden; |
| font-size: 1em; |
| font-size: 1em; |
| padding: 4px 6px; |
| padding: 4px 6px; |
| } |
| } |
| .drop_attachmnts_error { |
| .drop_attachmnts_error { |
| padding: 10px 0; |
| padding: 10px 0; |
| overflow: hidden; |
| overflow: hidden; |
| width: 97%; |
| width: 97%; |
| } |
| } |
| |
| |
| #postMoreOptions, #postAttachment, #postAttachment2 { |
| #postMoreOptions, #postAttachment, #postAttachment2 { |
| margin: -1px 0 0 0; |
| margin: -1px 0 0 0; |
| padding: 10px; |
| padding: 10px; |
| } |
| } |
| #postAttachment, #postAttachment2 { |
| #postAttachment, #postAttachment2 { |
| overflow: hidden; |
| overflow: hidden; |
| } |
| } |
| #postAttachment dd, #postAttachment2 dd { |
| #postAttachment dd, #postAttachment2 dd { |
| margin: 4px 12px; |
| margin: 4px 12px; |
| } |
| } |
| #postAttachment dd { |
| #postAttachment dd { |
| float: left; |
| float: left; |
| width: 45%; |
| width: 45%; |
| } |
| } |
| #postAttachment dt, #postAttachment2 dt { |
| #postAttachment dt, #postAttachment2 dt { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| .attachmenterrors { |
| .attachmenterrors { |
| padding: 0 1em; |
| padding: 0 1em; |
| } |
| } |
| .draftautosave { |
| .draftautosave { |
| font-size: 0.857em; |
| font-size: 0.857em; |
| text-align: right; |
| text-align: right; |
| height: 1.5em; |
| height: 1.5em; |
| overflow: hidden; |
| overflow: hidden; |
| } |
| } |
| #postDraftOptions .settings dd, #postDraftOptions .settings dt{ |
| #postDraftOptions .settings dd, #postDraftOptions .settings dt{ |
| margin: 0; |
| margin: 0; |
| padding: 5px 10px; |
| padding: 5px 10px; |
| width: 60%; |
| width: 60%; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| #postDraftOptions .settings dd{ |
| #postDraftOptions .settings dd{ |
| width: 40%; |
| width: 40%; |
| } |
| } |
| #postDraftOptions .settings dd:nth-child(2), #postDraftOptions .settings dt:first-child{ |
| #postDraftOptions .settings dd:nth-child(2), #postDraftOptions .settings dt:first-child{ |
| border-top: none; |
| border-top: none; |
| } |
| } |
| #postDraftOptions .settings strong{ |
| #postDraftOptions .settings strong{ |
| font-size: 1.143em; |
| font-size: 1.143em; |
| } |
| } |
| .post_verification { |
| .post_verification { |
| margin-top: 6px; |
| margin-top: 6px; |
| } |
| } |
| .post_verification #verification_control { |
| .post_verification #verification_control { |
| margin: 4px 0 4px 12px; |
| margin: 4px 0 4px 12px; |
| } |
| } |
| .verification_control_valid { |
| .verification_control_valid { |
| display: none; |
| display: none; |
| } |
| } |
| .verification_control .smalltext { |
| .verification_control .smalltext { |
| margin: 4px 0 8px 0; |
| margin: 4px 0 8px 0; |
| } |
| } |
| |
| |
| /* The event editor section. */ |
| /* The event editor section. */ |
| #event_main, #poll_options, #poll_main { |
| #event_main, #poll_options, #poll_main { |
| margin-bottom: 0.5em; |
| margin-bottom: 0.5em; |
| } |
| } |
| #event_main .roundframe { |
| #event_main .roundframe { |
| overflow: auto; |
| overflow: auto; |
| padding: 12px 12%; |
| padding: 12px 12%; |
| } |
| } |
| #event_main fieldset { |
| #event_main fieldset { |
| clear: both; |
| clear: both; |
| } |
| } |
| #event_main #datepicker, #event_main #caption_evtitle { |
| #event_main #datepicker, #event_main #caption_evtitle { |
| display: inline-block; |
| display: inline-block; |
| padding-left: 1em; |
| padding-left: 1em; |
| padding-top: 0.4em; |
| padding-top: 0.4em; |
| } |
| } |
| #event_main #evtitle { |
| #event_main #evtitle { |
| margin-top: 0.5em; |
| margin-top: 0.5em; |
| } |
| } |
| #event_main .event_options { |
| #event_main .event_options { |
| overflow: hidden; |
| overflow: hidden; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| #event_main .event_options { |
| #event_main .event_options { |
| margin: 0; |
| margin: 0; |
| padding: 1em 0.5em 0.5em 1em; |
| padding: 1em 0.5em 0.5em 1em; |
| } |
| } |
| #event_main .event_options li { |
| #event_main .event_options li { |
| padding-top: 0.5em; |
| padding-top: 0.5em; |
| padding-bottom: 0.5em; |
| padding-bottom: 0.5em; |
| } |
| } |
| #event_main select, .event_options li select, |
| #event_main select, .event_options li select, |
| #event_main ul.event_options li .input_check { |
| #event_main ul.event_options li .input_check { |
| margin: 0 12px 0 0; |
| margin: 0 12px 0 0; |
| } |
| } |
| #datepicker { |
| #datepicker { |
| white-space: nowrap; |
| white-space: nowrap; |
| } |
| } |
| |
| |
| /* The poll editor section. */ |
| /* The poll editor section. */ |
| #edit_poll { |
| #edit_poll { |
| overflow: hidden; |
| overflow: hidden; |
| } |
| } |
| #poll_main, #poll_options, #poll_reset { |
| #poll_main, #poll_options, #poll_reset { |
| clear: both; |
| clear: both; |
| overflow: hidden; |
| overflow: hidden; |
| padding: 6px; |
| padding: 6px; |
| } |
| } |
| #poll_main #question { |
| #poll_main #question { |
| margin-left: 2em; |
| margin-left: 2em; |
| } |
| } |
| #poll_main .poll_main li { |
| #poll_main .poll_main li { |
| padding-left: 12px; |
| padding-left: 12px; |
| } |
| } |
| #poll_main .poll_main input { |
| #poll_main .poll_main input { |
| margin-left: 12px; |
| margin-left: 12px; |
| } |
| } |
| #poll_main .poll_main, dl.poll_options { |
| #poll_main .poll_main, dl.poll_options { |
| overflow: hidden; |
| overflow: hidden; |
| padding: 0 0 8px 8px; |
| padding: 0 0 8px 8px; |
| } |
| } |
| #poll_main .poll_main li { |
| #poll_main .poll_main li { |
| margin: 2px 0; |
| margin: 2px 0; |
| } |
| } |
| #poll_options .poll_options dt { |
| #poll_options .poll_options dt { |
| padding: 0 0 0 12px; |
| padding: 0 0 0 12px; |
| width: 33%; |
| width: 33%; |
| } |
| } |
| #poll_options .poll_options dd { |
| #poll_options .poll_options dd { |
| width: 65%; |
| width: 65%; |
| } |
| } |
| #poll_options .poll_options dd input { |
| #poll_options .poll_options dd input { |
| margin-left: 0; |
| margin-left: 0; |
| } |
| } |
| |
| |
| |
| |
| /* $MODERATE */ |
| /* $MODERATE */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* The move topic section. */ |
| /* The move topic section. */ |
| #move_topic dl { |
| #move_topic dl { |
| margin-bottom: 0; |
| margin-bottom: 0; |
| } |
| } |
| #move_topic dl.settings dt { |
| #move_topic dl.settings dt { |
| width: 40%; |
| width: 40%; |
| } |
| } |
| #move_topic dl.settings dd { |
| #move_topic dl.settings dd { |
| width: 59%; |
| width: 59%; |
| } |
| } |
| .split_topics, .move_topic { |
| .move_topic { |
| margin: auto; |
| margin: auto; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .split_topics fieldset, .move_topic fieldset { |
| .move_topic fieldset { |
| padding: 6px; |
| padding: 6px; |
| } |
| } |
| |
| |
| /* The report topic section. */ |
| /* The report topic section. */ |
| #report_topic dl { |
| #report_topic dl { |
| margin-bottom: 0; |
| margin-bottom: 0; |
| } |
| } |
| #report_topic dl.settings dt { |
| #report_topic dl.settings dt { |
| width: 20%; |
| width: 20%; |
| } |
| } |
| #report_topic dl.settings dd { |
| #report_topic dl.settings dd { |
| width: 79%; |
| width: 79%; |
| } |
| } |
| #report_comment { |
| #report_comment { |
| width: 75%; |
| width: 75%; |
| height: 10em; |
| height: 10em; |
| padding: 5px; |
| padding: 5px; |
| } |
| } |
| |
| |
| /* The split topic section. */ |
| /* The split topic section. */ |
| #selected, #not_selected { |
| #selected, #not_selected { |
| width: 49%; |
| width: 49%; |
| } |
| } |
| .split_messages .windowbg, .split_messages .windowbg2 { |
| .split_messages .windowbg, .split_messages .windowbg2 { |
| margin: 1px; |
| margin: 1px; |
| } |
| } |
| .split_messages .split_icon { |
| .split_messages .split_icon { |
| padding: 0 6px; |
| padding: 0 6px; |
| } |
| } |
| .split_messages .post { |
| .split_messages .post { |
| padding: 12px 0 0 0; |
| padding: 12px 0 0 0; |
| } |
| } |
| |
| |
| /* The merge topic section. */ |
| /* The merge topic section. */ |
| dl.merge_topic dt { |
| dl.merge_topic dt { |
| width: 25%; |
| width: 25%; |
| } |
| } |
| dl.merge_topic dd { |
| dl.merge_topic dd { |
| width: 74%; |
| width: 74%; |
| } |
| } |
| .merge_options { |
| .merge_options { |
| clear: both; |
| clear: both; |
| padding: 0.5em; |
| padding: 0.5em; |
| } |
| } |
| .custom_subject { |
| .custom_subject { |
| margin: 6px 0; |
| margin: 6px 0; |
| } |
| } |
| |
| |
| |
| |
| /* Styles for the $TABS */ |
| /* Styles for the $TABS */ |
| /* We can't control what jQueryui pollutes the DOM with, so deal with it */ |
| /* We can't control what jQueryui pollutes the DOM with, so deal with it */ |
| /* Styles for the profile summary tabs, or any jQuery ui tabs */ |
| /* Styles for the profile summary tabs, or any jQuery ui tabs */ |
| /* ---------------------------------------------------------- */ |
| /* ---------------------------------------------------------- */ |
| .ui-tabs .ui-tabs-nav { |
| .ui-tabs .ui-tabs-nav { |
| list-style: none; |
| list-style: none; |
| position: relative; |
| position: relative; |
| padding: 0; |
| padding: 0; |
| margin: 0; |
| margin: 0; |
| } |
| } |
| .ui-tabs .ui-tabs-nav li { |
| .ui-tabs .ui-tabs-nav li { |
| position: relative; |
| position: relative; |
| float: left; |
| float: left; |
| margin: 0 3px -1px 0; |
| margin: 0 3px -1px 0; |
| font-size: 0.929em; |
| font-size: 0.929em; |
| line-height: 2.077em; |
| line-height: 2.077em; |
| } |
| } |
| .ui-tabs .ui-tabs-nav li a { |
| .ui-tabs .ui-tabs-nav li a { |
| display: block; |
| display: block; |
| padding: 0 7px; |
| padding: 0 7px; |
| outline: none; |
| outline: none; |
| text-decoration: none; |
| text-decoration: none; |
| } |
| } |
| .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav .ui-state-disabled a, .ui-tabs .ui-tabs-nav .ui-state-processing a { |
| .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav .ui-state-disabled a, .ui-tabs .ui-tabs-nav .ui-state-processing a { |
| cursor: default; |
| cursor: default; |
| } |
| } |
| .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { |
| .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { |
| cursor: pointer; |
| cursor: pointer; |
| } |
| } |
| .ui-tabs .ui-tabs-hide { |
| .ui-tabs .ui-tabs-hide { |
| display: none; |
| display: none; |
| } |
| } |
| .ui-tabs .ui-tabs-nav .ui-state-active a, .ui-tabs .ui-tabs-nav .ui-state-active { |
| .ui-tabs .ui-tabs-nav .ui-state-active a, .ui-tabs .ui-tabs-nav .ui-state-active { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| /* $PROFILE */ |
| /* $PROFILE */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| .ui-tabs .ui-tabs-panel { |
| .ui-tabs .ui-tabs-panel { |
| clear: both; |
| clear: both; |
| padding-top: 8px; |
| padding-top: 8px; |
| } |
| } |
| #profilecenter, #unwatched_topics, #profile_attachments { |
| #profilecenter, #unwatched_topics, #profile_attachments { |
| margin: 12px 0 0 0; |
| margin: 12px 0 0 0; |
| padding: 8px 8px 16px 8px; |
| padding: 8px 8px 16px 8px; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| /* @todo remove the div when div.windowbg and div.windowbg2 are sorted out */ |
| /* @todo remove the div when div.windowbg and div.windowbg2 are sorted out */ |
| #profilecenter div.core_posts { |
| #profilecenter div.core_posts { |
| padding: 0.2em 1em; |
| padding: 0.2em 1em; |
| } |
| } |
| #profilecenter .windowbg, #profilecenter .windowbg2, |
| #profilecenter .windowbg, #profilecenter .windowbg2, |
| #profile_attachments .windowbg, #profile_attachments .windowbg2, |
| #profile_attachments .windowbg, #profile_attachments .windowbg2, |
| #unwatched_topics .windowbg, #unwatched_topics .windowbg2 { |
| #unwatched_topics .windowbg, #unwatched_topics .windowbg2 { |
| overflow: visible; |
| overflow: visible; |
| padding: 0 0 4px; |
| padding: 0 0 4px; |
| } |
| } |
| .profileblock { |
| .profileblock { |
| padding: 4px 8px; |
| padding: 4px 8px; |
| margin-top: 4px; |
| margin-top: 4px; |
| word-wrap: break-word; |
| word-wrap: break-word; |
| -webkit-hyphens: auto; |
| -webkit-hyphens: auto; |
| -moz-hyphens: auto; |
| -moz-hyphens: auto; |
| -ms-hyphens: auto; |
| -ms-hyphens: auto; |
| } |
| } |
| .profileblock .icon { |
| .profileblock .icon { |
| vertical-align: bottom; |
| vertical-align: bottom; |
| } |
| } |
| .profile_content { |
| .profile_content { |
| overflow: auto; |
| overflow: auto; |
| padding: 0 8px; |
| padding: 0 8px; |
| } |
| } |
| .profileblock_left { |
| .profileblock_left { |
| width: 49%; |
| width: 49%; |
| float: left; |
| float: left; |
| margin: 0 0 4px 4px; |
| margin: 0 0 4px 4px; |
| } |
| } |
| .profileblock_left h3, .profileblock_right h3 { |
| .profileblock_left h3, .profileblock_right h3 { |
| margin-bottom: .8em; |
| margin-bottom: .8em; |
| } |
| } |
| .profileblock_right { |
| .profileblock_right { |
| width: 49%; |
| width: 49%; |
| float: right; |
| float: right; |
| margin: 0 4px 4px 0; |
| margin: 0 4px 4px 0; |
| } |
| } |
| .profileblock ul li { |
| .profileblock ul li { |
| display: block; |
| display: block; |
| float: left; |
| float: left; |
| margin-right: 5px; |
| margin-right: 5px; |
| } |
| } |
| |
| |
| .profile_attachments { |
| .profile_attachments { |
| border: 0; |
| border: 0; |
| border-spacing: 1em; |
| border-spacing: 1em; |
| width: 95%; |
| width: 95%; |
| table-layout: fixed; |
| table-layout: fixed; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| margin: 0 auto; |
| margin: 0 auto; |
| } |
| } |
| .profile_attachments td, .profile_attachments th { |
| .profile_attachments td, .profile_attachments th { |
| padding: 5px 4px; |
| padding: 5px 4px; |
| vertical-align: top; |
| vertical-align: top; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| |
| |
| .profile_attachment a img { |
| .profile_attachment a img { |
| max-width: 120px; |
| max-width: 120px; |
| max-height: 120px; |
| max-height: 120px; |
| } |
| } |
| .vcard .avatar { |
| .vcard .avatar { |
| max-width: 40px; |
| max-width: 40px; |
| max-height: 40px; |
| max-height: 40px; |
| } |
| } |
| .attach_title { |
| .attach_title { |
| display: block; |
| display: block; |
| margin-bottom: 4px; |
| margin-bottom: 4px; |
| overflow: hidden; |
| overflow: hidden; |
| max-width: 100%; |
| max-width: 100%; |
| text-overflow: ellipsis; |
| text-overflow: ellipsis; |
| white-space: pre; |
| white-space: pre; |
| } |
| } |
| /* The basic user info on the left */ |
| /* The basic user info on the left */ |
| #basicinfo { |
| #basicinfo { |
| float: left; |
| float: left; |
| width: 30%; |
| width: 30%; |
| } |
| } |
| #basicinfo .windowbg .content { |
| #basicinfo .windowbg .content { |
| padding-left: 30px; |
| padding-left: 30px; |
| } |
| } |
| .profileblock .cf_icon { |
| .profileblock .cf_icon { |
| display: block; |
| display: block; |
| float: left; |
| float: left; |
| margin: 4px 5px 0 0; |
| margin: 4px 5px 0 0; |
| } |
| } |
| #detailedinfo { |
| #detailedinfo { |
| float: right; |
| float: right; |
| width: 70%; |
| width: 70%; |
| margin-top: 0; |
| margin-top: 0; |
| word-wrap: break-word; |
| word-wrap: break-word; |
| -webkit-hyphens: auto; |
| -webkit-hyphens: auto; |
| -moz-hyphens: auto; |
| -moz-hyphens: auto; |
| -ms-hyphens: auto; |
| -ms-hyphens: auto; |
| } |
| } |
| #basicinfo h4 { |
| #basicinfo h4 { |
| overflow: hidden; |
| overflow: hidden; |
| white-space: pre-wrap; |
| white-space: pre-wrap; |
| font-weight: 100; |
| font-weight: 100; |
| font-size: 1.429em; |
| font-size: 1.429em; |
| padding-right: 2px; |
| padding-right: 2px; |
| } |
| } |
| #basicinfo h4 .position { |
| #basicinfo h4 .position { |
| display: block; |
| display: block; |
| font-weight: 100; |
| font-weight: 100; |
| font-size: 0.786em; |
| font-size: 0.786em; |
| } |
| } |
| #basicinfo .avatar { |
| #basicinfo .avatar { |
| display: block; |
| display: block; |
| margin: 10px 0 0 0; |
| margin: 10px 0 0 0; |
| } |
| } |
| #basicinfo #userstatus { |
| #basicinfo #userstatus { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| margin-top: 6px; |
| margin-top: 6px; |
| } |
| } |
| #basicinfo #userstatus img { |
| #basicinfo #userstatus img { |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| #detailedinfo dl, #tracking dl, .profileblock dl { |
| #detailedinfo dl, #tracking dl, .profileblock dl { |
| clear: right; |
| clear: right; |
| overflow: auto; |
| overflow: auto; |
| margin: 0 0 18px 0; |
| margin: 0 0 18px 0; |
| padding: 0 0 15px 0; |
| padding: 0 0 15px 0; |
| } |
| } |
| #detailedinfo dt, #tracking dt, .profileblock dt { |
| #detailedinfo dt, #tracking dt, .profileblock dt { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| margin: 0 0 3px 0; |
| margin: 0 0 3px 0; |
| padding: 0; |
| padding: 0; |
| width: 35%; |
| width: 35%; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| #detailedinfo dd, #tracking dd, .profileblock dd { |
| #detailedinfo dd, #tracking dd, .profileblock dd { |
| float: left; |
| float: left; |
| margin: 0 0 3px 0; |
| margin: 0 0 3px 0; |
| padding: 0; |
| padding: 0; |
| width: 65%; |
| width: 65%; |
| } |
| } |
| |
| .profileblock_signature dd { |
| |
| width: auto; |
| |
| word-wrap: break-word; |
| |
| } |
| |
| |
| #personal_picture { |
| #personal_picture { |
| display: block; |
| display: block; |
| margin-bottom: 4px; |
| margin-bottom: 4px; |
| } |
| } |
| #avatar_server_stored div { |
| #avatar_server_stored div { |
| float: left; |
| float: left; |
| padding-right: 5px; |
| padding-right: 5px; |
| } |
| } |
| #avatar_upload { |
| #avatar_upload { |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| #main_admsection #basicinfo, #main_admsection #detailedinfo { |
| #main_admsection #basicinfo, #main_admsection #detailedinfo { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| #main_admsection #basicinfo h4 { |
| #main_admsection #basicinfo h4 { |
| float: left; |
| float: left; |
| width: 35%; |
| width: 35%; |
| } |
| } |
| #main_admsection #basicinfo .avatar { |
| #main_admsection #basicinfo .avatar { |
| float: right; |
| float: right; |
| vertical-align: top; |
| vertical-align: top; |
| } |
| } |
| #main_admsection #basicinfo ul { |
| #main_admsection #basicinfo ul { |
| clear: left; |
| clear: left; |
| } |
| } |
| #main_admsection #basicinfo #userstatus { |
| #main_admsection #basicinfo #userstatus { |
| clear: left; |
| clear: left; |
| } |
| } |
| #main_admsection #basicinfo #infolinks { |
| #main_admsection #basicinfo #infolinks { |
| display: none; |
| display: none; |
| clear: both; |
| clear: both; |
| } |
| } |
| |
| |
| /* Profile statistics */ |
| /* Profile statistics */ |
| #generalstats .content dt { |
| #generalstats .content dt { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| margin: 0 0 3px 0; |
| margin: 0 0 3px 0; |
| padding: 0; |
| padding: 0; |
| width: 50%; |
| width: 50%; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| #generalstats .content dd { |
| #generalstats .content dd { |
| float: left; |
| float: left; |
| margin: 0 0 3px 0; |
| margin: 0 0 3px 0; |
| padding: 0; |
| padding: 0; |
| width: 50%; |
| width: 50%; |
| } |
| } |
| |
| |
| #show_attachments th { |
| #show_attachments th { |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .activity_stats { |
| .activity_stats { |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| .activity_stats li { |
| .activity_stats li { |
| float: left; |
| float: left; |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| width: 4.166%; |
| width: 4.166%; |
| } |
| } |
| .activity_stats li span { |
| .activity_stats li span { |
| display: block; |
| display: block; |
| text-align: center; |
| text-align: center; |
| font-size: 0.786em; |
| font-size: 0.786em; |
| padding-right: 0.5em; |
| padding-right: 0.5em; |
| } |
| } |
| .activity_stats .last span { |
| .activity_stats .last span { |
| border-right: none; |
| border-right: none; |
| } |
| } |
| .activity_stats li .bar { |
| .activity_stats li .bar { |
| margin: 0 auto; |
| margin: 0 auto; |
| max-width: 15px; |
| max-width: 15px; |
| width: 50%; |
| width: 50%; |
| } |
| } |
| .activity_stats li .bar span { |
| .activity_stats li .bar span { |
| position: absolute; |
| position: absolute; |
| top: -1555em; |
| top: -1555em; |
| left: -1555em; |
| left: -1555em; |
| } |
| } |
| |
| |
| /* Most popular boards by posts and activity */ |
| /* Most popular boards by posts and activity */ |
| /* @todo - Use box-sizing and 50% width for better stability. */ |
| /* @todo - Use box-sizing and 50% width for better stability. */ |
| #popularposts { |
| #popularposts { |
| float: left; |
| float: left; |
| width: 49.5%; |
| width: 49.5%; |
| } |
| } |
| #popularactivity { |
| #popularactivity { |
| float: right; |
| float: right; |
| width: 49.5%; |
| width: 49.5%; |
| } |
| } |
| |
| |
| #popularposts div.content dt, #popularactivity div.content dt { |
| #popularposts div.content dt, #popularactivity div.content dt { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| margin: 0 0 3px 0; |
| margin: 0 0 3px 0; |
| padding: 0; |
| padding: 0; |
| width: 65%; |
| width: 65%; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| #popularposts div.content dd, #popularactivity div.content dd { |
| #popularposts div.content dd, #popularactivity div.content dd { |
| float: left; |
| float: left; |
| margin: 0 0 3px 0; |
| margin: 0 0 3px 0; |
| padding: 0; |
| padding: 0; |
| width: 35%; |
| width: 35%; |
| } |
| } |
| |
| |
| .profile_pie { |
| .profile_pie { |
| float: left; |
| float: left; |
| margin: 0 12px 0 0; |
| margin: 0 12px 0 0; |
| padding: 0; |
| padding: 0; |
| width: 20px; |
| width: 20px; |
| height: 20px; |
| height: 20px; |
| text-indent: -1555em; |
| text-indent: -1555em; |
| /* Image will need changing to match new theme.*/ |
| /* Image will need changing to match new theme.*/ |
| background: url(../images/stats_pie.png); |
| background: url(../images/stats_pie.png); |
| } |
| } |
| |
| |
| /* @todo - Buddy section stuff. */ |
| /* @todo - Buddy section stuff. */ |
| .add_buddy .roundframe, .add_buddy .title_bar { |
| .add_buddy .roundframe, .add_buddy .title_bar { |
| margin-top: 5px; |
| margin-top: 5px; |
| border: none; |
| border: none; |
| background: none; |
| background: none; |
| } |
| } |
| |
| |
| /* View posts */ |
| /* View posts */ |
| .topic .time { |
| .topic .time { |
| float: right; |
| float: right; |
| } |
| } |
| .counter { |
| .counter { |
| float: right; |
| float: right; |
| padding: 6px; |
| padding: 6px; |
| font-weight: bold; |
| font-weight: bold; |
| font-size: 2em; |
| font-size: 2em; |
| } |
| } |
| .topic_details { |
| .topic_details { |
| padding: 0 4px 4px 4px; |
| padding: 0 4px 4px 4px; |
| } |
| } |
| .topic h4 { |
| .topic h4 { |
| margin: 3px 0; |
| margin: 3px 0; |
| } |
| } |
| .topic .post { |
| .topic .post { |
| margin: 0 12px; |
| margin: 0 12px; |
| min-height: 80px; |
| min-height: 80px; |
| height: auto; |
| height: auto; |
| height: 80px; |
| height: 80px; |
| } |
| } |
| .topic .mod_icons { |
| .topic .mod_icons { |
| margin-right: 12px; |
| margin-right: 12px; |
| text-align: right; |
| text-align: right; |
| } |
| } |
| |
| |
| #tracking div.content dl { |
| #tracking div.content dl { |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| border-bottom: 0; |
| border-bottom: 0; |
| } |
| } |
| |
| |
| #creator dl { |
| #creator dl { |
| margin: 0; |
| margin: 0; |
| } |
| } |
| #creator dt { |
| #creator dt { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| margin: 0 0 10px 0; |
| margin: 0 0 10px 0; |
| width: 40%; |
| width: 40%; |
| } |
| } |
| #creator dd { |
| #creator dd { |
| float: right; |
| float: right; |
| overflow: auto; |
| overflow: auto; |
| margin: 0 0 10px 2px; |
| margin: 0 0 10px 2px; |
| width: 55%; |
| width: 55%; |
| min-height: 2em; |
| min-height: 2em; |
| padding-bottom: 1px; |
| padding-bottom: 1px; |
| } |
| } |
| .centericon { |
| .centericon { |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| .ignoreboards { |
| .ignoreboards { |
| margin: 0 2%; |
| margin: 0 2%; |
| padding: 0; |
| padding: 0; |
| width: 45%; |
| width: 45%; |
| } |
| } |
| .ignoreboards a { |
| .ignoreboards a { |
| padding: 1px 0; |
| padding: 1px 0; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| .ignoreboards ul { |
| .ignoreboards ul { |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| .ignoreboards li { |
| .ignoreboards li { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| } |
| } |
| .ignoreboards li.category { |
| .ignoreboards li.category { |
| margin: 8px 0 0 0; |
| margin: 8px 0 0 0; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .ignoreboards li ul { |
| .ignoreboards li ul { |
| margin: 2px 0 0 0; |
| margin: 2px 0 0 0; |
| } |
| } |
| .ignoreboards li.category ul .board { |
| .ignoreboards li.category ul .board { |
| width: 93%; |
| width: 93%; |
| } |
| } |
| |
| |
| #theme_settings { |
| #theme_settings { |
| overflow: auto; |
| overflow: auto; |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| #theme_settings li { |
| #theme_settings li { |
| margin: 10px 0; |
| margin: 10px 0; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| |
| |
| /* Paid Subscriptions */ |
| /* Paid Subscriptions */ |
| #paid_subscription { |
| #paid_subscription { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| #paid_subscription dl.settings { |
| #paid_subscription dl.settings { |
| margin-bottom: 0; |
| margin-bottom: 0; |
| } |
| } |
| #paid_subscription dl.settings dd, #paid_subscription dl.settings dt { |
| #paid_subscription dl.settings dd, #paid_subscription dl.settings dt { |
| margin-bottom: 4px; |
| margin-bottom: 4px; |
| } |
| } |
| |
| |
| |
| |
| /* Pick theme */ |
| /* Pick theme */ |
| #pick_theme { |
| #pick_theme { |
| float: left; |
| float: left; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| |
| |
| /*Issue a warning*/ |
| /*Issue a warning*/ |
| #warn_body { |
| #warn_body { |
| width: 80%; |
| width: 80%; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| #warning_text { |
| #warning_text { |
| position: absolute; |
| position: absolute; |
| z-index: 2; |
| z-index: 2; |
| padding-top: 1pt; |
| padding-top: 1pt; |
| width: 100%; |
| width: 100%; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| #new_template_link a { |
| #new_template_link a { |
| margin-bottom: 2px; |
| margin-bottom: 2px; |
| } |
| } |
| #warndiv { |
| #warndiv { |
| margin: 0 0 1em 5%; |
| margin: 0 0 1em 5%; |
| } |
| } |
| #slider-range-min { |
| #slider-range-min { |
| width: 90%; |
| width: 90%; |
| margin-top: 1em; |
| margin-top: 1em; |
| } |
| } |
| |
| |
| /* $PERSONAL */ |
| /* $PERSONAL */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| #personal_messages .labels { |
| #personal_messages .labels { |
| padding: 11px 0 0; |
| padding: 11px 0 0; |
| } |
| } |
| #personal_messages .signature { |
| #personal_messages .signature { |
| overflow: visible; |
| overflow: visible; |
| } |
| } |
| #personal_messages .capacity_bar { |
| #personal_messages .capacity_bar { |
| display: block; |
| display: block; |
| margin: 6px 0 0 12px; |
| margin: 6px 0 0 12px; |
| width: 10em; |
| width: 10em; |
| height: 12px; |
| height: 12px; |
| } |
| } |
| #personal_messages .capacity_bar span { |
| #personal_messages .capacity_bar span { |
| display: block; |
| display: block; |
| height: 12px; |
| height: 12px; |
| } |
| } |
| #personal_messages .reportlinks { |
| #personal_messages .reportlinks { |
| padding: 6px 1.286em; |
| padding: 6px 1.286em; |
| } |
| } |
| .pm_icon, .pm_quickmod { |
| .pm_icon, .pm_quickmod { |
| width: 4%; |
| width: 4%; |
| } |
| } |
| .pm_date { |
| .pm_date { |
| width: 22%; |
| width: 22%; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .pm_subject { |
| .pm_subject { |
| width: 46%; |
| width: 46%; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .pm_from { |
| .pm_from { |
| text-align: left; |
| text-align: left; |
| } |
| } |
| #searchLabelsExpand li { |
| #searchLabelsExpand li { |
| padding: 4px 6px; |
| padding: 4px 6px; |
| } |
| } |
| #manrules div.righttext { |
| #manrules div.righttext { |
| padding: 4px 1px; |
| padding: 4px 1px; |
| } |
| } |
| .addrules dt.floatleft { |
| .addrules dt.floatleft { |
| padding: 0 15px 6px 15px; |
| padding: 0 15px 6px 15px; |
| width: 15em; |
| width: 15em; |
| } |
| } |
| #addrule fieldset { |
| #addrule fieldset { |
| clear: both; |
| clear: both; |
| padding: 0.5em; |
| padding: 0.5em; |
| } |
| } |
| #to_item_list_container div, #bcc_item_list_container div { |
| #to_item_list_container div, #bcc_item_list_container div { |
| float: left; |
| float: left; |
| margin-right: 10px; |
| margin-right: 10px; |
| } |
| } |
| div.labels { |
| div.labels { |
| display: block; |
| display: block; |
| text-align: right; |
| text-align: right; |
| } |
| } |
| .label_pms { |
| .label_pms { |
| float: right; |
| float: right; |
| margin-top: 5px; |
| margin-top: 5px; |
| } |
| } |
| .label_pms li { |
| .label_pms li { |
| display: inline-block; |
| display: inline-block; |
| vertical-align: top; |
| vertical-align: top; |
| margin-left: 0.5em; |
| margin-left: 0.5em; |
| } |
| } |
| |
| |
| |
| |
| /* $CALENDAR */ |
| /* $CALENDAR */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| #calendar { |
| #calendar { |
| text-align: center; |
| text-align: center; |
| } |
| } |
| #month_grid { |
| #month_grid { |
| float: left; |
| float: left; |
| padding: 0 15px 0 0; |
| padding: 0 15px 0 0; |
| width: 215px; |
| width: 215px; |
| } |
| } |
| #main_grid { |
| #main_grid { |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| #month_grid .category_header { |
| #month_grid .category_header { |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| #main_grid .category_header { |
| #main_grid .category_header { |
| font-size: 1.357em; |
| font-size: 1.357em; |
| } |
| } |
| .previous_month, .next_month { |
| .previous_month, .next_month { |
| float: left; |
| float: left; |
| display: block; |
| display: block; |
| margin: -0.1em 0 0 0; |
| margin: -0.1em 0 0 0; |
| font-size: 0.6em; |
| font-size: 0.6em; |
| } |
| } |
| .next_month { |
| .next_month { |
| float: right; |
| float: right; |
| } |
| } |
| .calendar_table { |
| .calendar_table { |
| width: 100%; |
| width: 100%; |
| border-spacing: 1px; |
| border-spacing: 1px; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| .calendar_table th, .calendar_table td { |
| .calendar_table th, .calendar_table td { |
| padding: 2px 0; |
| padding: 2px 0; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| #month_grid .calendar_table { |
| #month_grid .calendar_table { |
| margin-bottom: 12px; |
| margin-bottom: 12px; |
| } |
| } |
| #month_grid .table_head { |
| #month_grid .table_head { |
| font-size: 0.929em; |
| font-size: 0.929em; |
| } |
| } |
| #main_grid .days { |
| #main_grid .days { |
| padding: 4px; |
| padding: 4px; |
| width: 14%; |
| width: 14%; |
| } |
| } |
| #main_grid .windowbg.days { |
| #main_grid .windowbg.days { |
| height: 100px; |
| height: 100px; |
| } |
| } |
| #main_grid .weeks { |
| #main_grid .weeks { |
| font-weight: bold; |
| font-weight: bold; |
| font-size: 1.786em; |
| font-size: 1.786em; |
| } |
| } |
| #main_grid .weeks a:hover { |
| #main_grid .weeks a:hover { |
| text-decoration: none; |
| text-decoration: none; |
| } |
| } |
| #main_grid .days { |
| #main_grid .days { |
| vertical-align: top; |
| vertical-align: top; |
| } |
| } |
| .weeklist { |
| .weeklist { |
| text-align: left; |
| text-align: left; |
| padding: 2px 0; |
| padding: 2px 0; |
| } |
| } |
| .weeklist>li { |
| .weeklist>li { |
| margin: 2px 0; |
| margin: 2px 0; |
| overflow: hidden; |
| overflow: hidden; |
| } |
| } |
| .weeklist h4 { |
| .weeklist h4 { |
| float: left; |
| float: left; |
| padding: 10px; |
| padding: 10px; |
| width: 10em; |
| width: 10em; |
| font-size: 1.143em; |
| font-size: 1.143em; |
| } |
| } |
| /* Use the old one true layout trick here. */ |
| /* Use the old one true layout trick here. */ |
| .weeklist .windowbg2, .weeklist .calendar_today { |
| .weeklist .windowbg2, .weeklist .calendar_today { |
| margin: 0 0 -95px 11.5em; |
| margin: 0 0 -95px 11.5em; |
| padding: 8px 8px 100px 8px; |
| padding: 8px 8px 100px 8px; |
| } |
| } |
| /* Add a background that fits with the calendar. */ |
| |
| #calendar_navigation { |
| #calendar_navigation { |
| padding: 12px 0; |
| padding: 12px 0; |
| } |
| } |
| /* Cheat and match this to the submit button. */ |
| /* Cheat and match this to the submit button. */ |
| #calendar_navigation .buttonlist { |
| #calendar_navigation .buttonlist { |
| padding: 0 6px; |
| padding: 0 6px; |
| } |
| } |
| /* See, I told you there was wombatz here. */ |
| /* See, I told you there was wombatz here. */ |
| /* |
| /* |
| ,.--""""--.._ |
| ,.--""""--.._ |
| ." .' `-. |
| ." .' `-. |
| ; ; ; |
| ; ; ; |
| ' ; ) |
| ' ; ) |
| / ' . ; |
| / ' . ; |
| / ; `. `; |
| / ; `. `; |
| ,.' : . : ) |
| ,.' : . : ) |
| ;|\' : `./|) \ ;/ |
| ;|\' : `./|) \ ;/ |
| ;| \" -,- "-./ |; ).; |
| ;| \" -,- "-./ |; ).; |
| /\/ \/ ); |
| /\/ \/ ); |
| : _ \ ; |
| : _ \ ; |
| : \0\_ _ ; ) |
| : \0\_ _ ; ) |
| `. /o/ ; / |
| `. /o/ ; / |
| ! : : ,/ ; |
| ! : : ,/ ; |
| (`. : _ : ,/"" ; |
| (`. : _ : ,/"" ; |
| \\\`"^" ` : ; |
| \\\`"^" ` : ; |
| ( ) |
| ( ) |
| akg //// |
| akg //// |
| */ |
| */ |
| |
| |
| |
| |
| /* MENTIONS */ |
| /* MENTIONS */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| .mentionavatar .avatar { |
| .mentionavatar .avatar { |
| display: block; |
| display: block; |
| max-width: 60px; |
| max-width: 60px; |
| max-height: 60px; |
| max-height: 60px; |
| } |
| } |
| .mentionavatar { |
| .mentionavatar { |
| min-width: 60px; |
| min-width: 60px; |
| min-height: 60px; |
| min-height: 60px; |
| } |
| } |
| |
| |
| /* $STATISTICS */ |
| /* $STATISTICS */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| .statistics { |
| .statistics { |
| margin: 3px 0; |
| margin: 3px 0; |
| } |
| } |
| .statistics .category_header { |
| .statistics .category_header { |
| width: 49%; |
| width: 49%; |
| margin: 0 0.5% 0 50.5%; |
| margin: 0 0.5% 0 50.5%; |
| padding-top: 1px; |
| padding-top: 1px; |
| font-size: 1.214em; |
| font-size: 1.214em; |
| } |
| } |
| #top_row .category_header { |
| #top_row .category_header { |
| width: 99%; |
| width: 99%; |
| margin: 0 0.5%; |
| margin: 0 0.5%; |
| } |
| } |
| .statistics .category_header.floatleft { |
| .statistics .category_header.floatleft { |
| margin: 0 0.5%; |
| margin: 0 0.5%; |
| } |
| } |
| .statistics .flow_hidden, #forum_history .flow_hidden { |
| .statistics .flow_hidden, #forum_history .flow_hidden { |
| margin: 2px 0 0 0; |
| margin: 2px 0 0 0; |
| } |
| } |
| .stats { |
| .stats { |
| overflow: hidden; |
| overflow: hidden; |
| padding: 0 16px; |
| padding: 0 16px; |
| width: 50%; |
| width: 50%; |
| margin: 12px 0 12px 50%; |
| margin: 12px 0 12px 50%; |
| } |
| } |
| .stats.floatleft { |
| .stats.floatleft { |
| clear: left; |
| clear: left; |
| margin: 12px 0; |
| margin: 12px 0; |
| } |
| } |
| .stats dt { |
| .stats dt { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| margin: 0 2% 4px 0; |
| margin: 0 2% 4px 0; |
| padding: 0; |
| padding: 0; |
| width: 48%; |
| width: 48%; |
| font-size: 1em; |
| font-size: 1em; |
| line-height: 1.5em; |
| line-height: 1.5em; |
| } |
| } |
| #top_row .stats dd, .statsbar { |
| #top_row .stats dd, .statsbar { |
| position: relative; |
| position: relative; |
| float: right; |
| float: right; |
| margin: 0 0 4px 0; |
| margin: 0 0 4px 0; |
| padding: 0 4px 0 0; |
| padding: 0 4px 0 0; |
| min-height: 1.5em; |
| min-height: 1.5em; |
| width: 50%; |
| width: 50%; |
| } |
| } |
| .statsbar .bar { |
| .statsbar .bar { |
| display: block; |
| display: block; |
| float: left; |
| float: left; |
| margin: 0 4px 0 0; |
| margin: 0 4px 0 0; |
| font-size: 1em; |
| font-size: 1em; |
| height: 1.5em; |
| height: 1.5em; |
| } |
| } |
| /* Absolute positioning stops these breaking the bars on narrow screens. */ |
| /* Absolute positioning stops these breaking the bars on narrow screens. */ |
| .statsbar .righttext { |
| .statsbar .righttext { |
| position: absolute; |
| position: absolute; |
| top: 0; |
| top: 0; |
| right: 0; |
| right: 0; |
| z-index: 2; |
| z-index: 2; |
| padding: 0 4px; |
| padding: 0 4px; |
| line-height: 1.75em; |
| line-height: 1.75em; |
| font-size: 0.857em; |
| font-size: 0.857em; |
| } |
| } |
| #stats { |
| #stats { |
| margin: 6px 0 16px 0; |
| margin: 6px 0 16px 0; |
| } |
| } |
| #stats th, #stats td { |
| #stats th, #stats td { |
| width: 15%; |
| width: 15%; |
| padding: 4px 12px; |
| padding: 4px 12px; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| #stats .history_head { |
| #stats .history_head { |
| border-top: none; |
| border-top: none; |
| } |
| } |
| #stats .lefttext { |
| #stats .lefttext { |
| width: 25%; |
| width: 25%; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| #stats .stats_month { |
| #stats .stats_month { |
| padding: 4px 8px 4px 30px; |
| padding: 4px 8px 4px 30px; |
| } |
| } |
| #stats .stats_day { |
| #stats .stats_day { |
| padding: 4px 8px 4px 60px; |
| padding: 4px 8px 4px 60px; |
| } |
| } |
| |
| |
| |
| |
| /* $HELP */ |
| /* $HELP */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* Styles for the help section. */ |
| /* Styles for the help section. */ |
| #help_container { |
| #help_container { |
| overflow: auto; |
| overflow: auto; |
| margin: 0 0 0 0; |
| margin: 0 0 0 0; |
| padding: 0 0 8px 0; |
| padding: 0 0 8px 0; |
| } |
| } |
| #helpmain { |
| #helpmain { |
| overflow: auto; |
| overflow: auto; |
| margin: 12px 0 0 0; |
| margin: 12px 0 0 0; |
| padding: 8px 20px 12px 20px; |
| padding: 8px 20px 12px 20px; |
| } |
| } |
| #helpmain p { |
| #helpmain p { |
| margin: 10px 0; |
| margin: 10px 0; |
| } |
| } |
| #helpmain ul { |
| #helpmain ul { |
| margin: 0 0 0 25px; |
| margin: 0 0 0 25px; |
| line-height: 2em; |
| line-height: 2em; |
| } |
| } |
| #helpmain ul li{ |
| #helpmain ul li{ |
| list-style-type: disc; |
| list-style-type: disc; |
| } |
| } |
| #helpmain ul li a { |
| #helpmain ul li a { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| |
| |
| /* Generally, those [?] icons. This makes your cursor a help icon. */ |
| /* Generally, those [?] icons. This makes your cursor a help icon. */ |
| .help { |
| .help { |
| cursor: help; |
| cursor: help; |
| } |
| } |
| .help .icon, .hdicon.help { |
| .help .icon, .hdicon.help { |
| margin: 0; |
| margin: 0; |
| opacity: 0.8; |
| opacity: 0.8; |
| cursor: help; |
| cursor: help; |
| } |
| } |
| .hdicon.help { |
| .hdicon.help { |
| vertical-align: top; |
| vertical-align: top; |
| } |
| } |
| .hdicon.help:before { |
| .hdicon.help:before { |
| margin: 2px 0 0; |
| margin: 2px 0 0; |
| } |
| } |
| .help .icon:hover, .hdicon.help:hover { |
| .help .icon:hover, .hdicon.help:hover { |
| opacity: 1; |
| opacity: 1; |
| } |
| } |
| a.help .icon { |
| a.help .icon { |
| padding: 4px 0 0; |
| padding: 4px 0 0; |
| } |
| } |
| |
| |
| /* Styles for the tooltips. */ |
| /* Styles for the tooltips. */ |
| .tooltip { |
| .tooltip { |
| position: absolute; |
| position: absolute; |
| left: -9999px; |
| left: -9999px; |
| z-index: 999; |
| z-index: 999; |
| padding: 6px 9px; |
| padding: 6px 9px; |
| max-width: 350px; |
| max-width: 350px; |
| word-wrap: break-word; |
| word-wrap: break-word; |
| } |
| } |
| |
| |
| /* What's this? @todo - Deprecated? */ |
| /* What's this? @todo - Deprecated? */ |
| #help_popup { |
| #help_popup { |
| padding: 12px; |
| padding: 12px; |
| } |
| } |
| |
| |
| /* The darkened background for help pop-ups. */ |
| /* The help pop-ups. */ |
| .popup_container { |
| .popup_container { |
| position: fixed; |
| position: fixed; |
| top: 0; |
| top: 0; |
| left: 0; |
| left: 0; |
| z-index: 100; |
| z-index: 100; |
| display: none; |
| display: none; |
| width: 100%; |
| width: 100%; |
| height: 100%; |
| height: 100%; |
| } |
| } |
| |
| |
| /* The actual pop-up wrapper. */ |
| /* The actual pop-up wrapper. */ |
| .popup_container .popup_window { |
| .popup_container .popup_window { |
| margin: 12% auto; |
| margin: 12% auto; |
| width: 480px; |
| width: 480px; |
| font-size: 1em; |
| font-size: 1em; |
| } |
| } |
| |
| |
| /* What it says. ;) */ |
| /* What it says. ;) */ |
| .popup_heading { |
| .popup_heading { |
| padding: 0 0 6px 0; |
| padding: 0 0 6px 0; |
| font-weight: bold; |
| font-weight: bold; |
| font-size: 1.071em; |
| font-size: 1.071em; |
| line-height: 2em; |
| line-height: 2em; |
| } |
| } |
| |
| |
| /* The hide icon (red cross). */ |
| /* The hide icon (red cross). */ |
| .popup_heading .hide_popup { |
| .popup_heading .hide_popup { |
| float: right; |
| float: right; |
| width: 16px; |
| width: 16px; |
| height: 2em; |
| height: 2em; |
| background: url(../images/buttons/delete.png) 0 50% no-repeat; |
| background: url(../images/buttons/delete.png) 0 50% no-repeat; |
| } |
| } |
| |
| |
| /* The text content, hopefully helpful. */ |
| /* The text content, hopefully helpful. */ |
| .popup_content { |
| .popup_content { |
| overflow: auto; |
| overflow: auto; |
| padding: 10px; |
| padding: 10px; |
| max-height: 22em; |
| max-height: 22em; |
| } |
| } |
| |
| |
| /* Some styles used in help entries (language strings) */ |
| /* Some styles used in help entries (language strings) */ |
| .enablePostHTML { |
| .enablePostHTML { |
| margin-bottom: 0; |
| margin-bottom: 0; |
| } |
| } |
| .custom_mask { |
| .custom_mask { |
| margin: 0 2em; |
| margin: 0 2em; |
| } |
| } |
| |
| |
| /* $SEARCH */ |
| /* $SEARCH */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* The basic search section. */ |
| /* The basic search section. */ |
| #simple_search, #advanced_search { |
| #simple_search, #advanced_search { |
| margin: 4px 0 0 0; |
| margin: 4px 0 0 0; |
| padding: 8px 0; |
| padding: 8px 0; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| #search_error { |
| #search_error { |
| padding: 4px 12px; |
| padding: 4px 12px; |
| font-style: italic; |
| font-style: italic; |
| } |
| } |
| #search_term_input { |
| #search_term_input { |
| margin: 0 0 10px; |
| margin: 0 0 10px; |
| font-size: 1.071em; |
| font-size: 1.071em; |
| } |
| } |
| #search_term_input .button_submit { |
| #search_term_input .button_submit { |
| margin: 0 0 2px; |
| margin: 0 0 2px; |
| } |
| } |
| |
| |
| /* The advanced search section. */ |
| /* The advanced search section. */ |
| #search_options { |
| #search_options { |
| overflow: hidden; |
| overflow: hidden; |
| margin: 0 auto; |
| margin: 0 auto; |
| padding-top: 12px; |
| padding-top: 12px; |
| width: 600px; |
| width: 600px; |
| } |
| } |
| |
| |
| #advanced_search dt { |
| #advanced_search dt { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| padding: 5px 4px 0 4px; |
| padding: 5px 4px 0 4px; |
| width: 35%; |
| width: 35%; |
| text-align: right; |
| text-align: right; |
| } |
| } |
| #advanced_search dd { |
| #advanced_search dd { |
| float: left; |
| float: left; |
| padding: 3px 2px; |
| padding: 3px 2px; |
| width: 65%; |
| width: 65%; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| |
| |
| #pick_boards .submitbutton { |
| #pick_boards .submitbutton { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| |
| |
| |
| |
| /* The search results page. |
| /* The search results page. |
| /* The search results page. @todo - Duplicated in the .table_grid code? */ |
| /* The search results page. @todo - Duplicated in the .table_grid code? */ |
| /* @todo - Search results in a table? I'm sure that's deprecated years ago. */ |
| /* @todo - Search results in a table? I'm sure that's deprecated years ago. */ |
| .topic_table td blockquote, .topic_table td .quoteheader { |
| .topic_table td blockquote, .topic_table td .quoteheader { |
| margin: 6px; |
| margin: 6px; |
| } |
| } |
| .search_results_posts { |
| .search_results_posts { |
| overflow: hidden; |
| overflow: hidden; |
| |
| padding: 0.2em 1em; |
| } |
| } |
| .search_results_posts .buttons { |
| .search_results_posts .buttons { |
| padding: 5px 12px 0 0; |
| padding: 5px 12px 0 0; |
| } |
| } |
| .compact_view .topic_details { |
| .compact_view .topic_details { |
| border-bottom: 0px; |
| border-bottom: 0; |
| } |
| } |
| .search_results_posts .topic_details { |
| .search_results_posts .topic_details { |
| position: relative; |
| position: relative; |
| margin: 0.2em 1em 0px; |
| margin: 0.2em 1em 0; |
| |
| border-bottom: 0; |
| } |
| } |
| .search_results_posts .quickbuttons { |
| .search_results_posts .quickbuttons { |
| margin-left: 1em; |
| margin-left: 1em; |
| margin-right: 1em; |
| margin-right: 1em; |
| } |
| } |
| .search_results_posts .topic_body { |
| .search_results_posts .topic_body { |
| margin: 0px 1em 0px; |
| margin: 0 1em 0; |
| padding-bottom: 12px; |
| padding-bottom: 12px; |
| padding-top: 12px; |
| padding-top: 12px; |
| } |
| } |
| .search_results_posts .quick_mod { |
| .search_results_posts .quick_mod { |
| position: absolute; |
| position: absolute; |
| right: 0px; |
| right: 0; |
| top: 10%; |
| top: 10%; |
| } |
| } |
| .search_results_posts .counter { |
| .search_results_posts .counter { |
| padding: 6px 1.5em; |
| padding: 6px 0 6px 1.5em; |
| } |
| } |
| .compact_view .content { |
| .compact_view .content { |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| #topicForm .pagesection, |
| #topicForm .pagesection, #topicForm .flow_auto { |
| #topicForm .flow_auto { |
| |
| display: inline-block; |
| display: inline-block; |
| } |
| } |
| #topicForm:after { |
| #topicForm:after { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| content: ""; |
| content: ""; |
| } |
| } |
| |
| |
| /* $MEMBERLIST */ |
| /* $MEMBERLIST */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| .mlist, .whos_online { |
| .mlist, .whos_online { |
| display: table; |
| display: table; |
| width: 100%; |
| width: 100%; |
| border-collapse: collapse; |
| border-collapse: collapse; |
| } |
| } |
| .mlist li, .whos_online dt, .whos_online dd { |
| .mlist li, .whos_online dt, .whos_online dd { |
| display: table-row; |
| display: table-row; |
| } |
| } |
| .mlist li div, .whos_online dt div, .whos_online dd div { |
| .mlist li div, .whos_online dt div, .whos_online dd div { |
| display: table-cell; |
| display: table-cell; |
| padding: 5px 8px; |
| padding: 5px 8px; |
| } |
| } |
| .letter_row { |
| .letter_row { |
| height: 3em; |
| height: 3em; |
| line-height: 3em; |
| line-height: 3em; |
| vertical-align: bottom; |
| vertical-align: bottom; |
| } |
| } |
| .letter_row>h3 { |
| .letter_row>h3 { |
| line-height: 2em; |
| line-height: 2em; |
| text-transform: uppercase; |
| text-transform: uppercase; |
| font-weight: bold; |
| font-weight: bold; |
| position: relative; |
| position: relative; |
| top: 12px; |
| top: 12px; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| .mlist_header { |
| .mlist_header { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| .whos_online dt { |
| .whos_online dt { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| dl.no_members { |
| dl.no_members { |
| display: none; |
| display: none; |
| } |
| } |
| .online_member { |
| .online_member { |
| min-width: 40%; |
| min-width: 40%; |
| } |
| } |
| .track_ip:before { |
| .track_ip:before { |
| content: "("; |
| content: "("; |
| } |
| } |
| .track_ip:after { |
| .track_ip:after { |
| content: ")"; |
| content: ")"; |
| } |
| } |
| #memberlist { |
| #memberlist { |
| margin: 6px 0 0 0; |
| margin: 6px 0 0 0; |
| } |
| } |
| #memberlist>.content { |
| #memberlist>.content { |
| padding: 12px 0; |
| padding: 12px 0; |
| } |
| } |
| #memberlist .status { |
| #memberlist .status { |
| width: 60px; |
| width: 60px; |
| } |
| } |
| #memberlist .selected { |
| #memberlist .selected { |
| width: auto; |
| width: auto; |
| white-space: nowrap |
| white-space: nowrap |
| } |
| } |
| #memberlist_search, #memberlist>.content>.submitbutton { |
| #memberlist_search, #memberlist>.content>.submitbutton { |
| margin: 0 auto; |
| margin: 0 auto; |
| width: 32em; |
| width: 32em; |
| } |
| } |
| #memberlist_search>dt, #memberlist_search>dd { |
| #memberlist_search>dt, #memberlist_search>dd { |
| width: 12em; |
| width: 12em; |
| } |
| } |
| #memberlist_search>dd { |
| #memberlist_search>dd { |
| width: 20em; |
| width: 20em; |
| } |
| } |
| #memberlist_search .input_check { |
| #memberlist_search .input_check { |
| margin: 4px 0 0 0; |
| margin: 4px 0 0 0; |
| } |
| } |
| #memberlist_search .input_text { |
| #memberlist_search .input_text { |
| margin: 0 0 12px 0; |
| margin: 0 0 12px 0; |
| overflow: hidden; |
| overflow: hidden; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| #mlsearch { |
| #mlsearch { |
| padding-top: 2px; |
| padding-top: 2px; |
| } |
| } |
| #mlsearch_options { |
| #mlsearch_options { |
| position: absolute; |
| position: absolute; |
| display: none; |
| display: none; |
| padding: 0.5em; |
| padding: 0.5em; |
| } |
| } |
| #mlsearch_options.nojs { |
| #mlsearch_options.nojs { |
| display: none; |
| display: none; |
| } |
| } |
| #mlsearch_options.nojs li:nth-child(odd) { |
| #mlsearch_options.nojs li:nth-child(odd) { |
| float: left; |
| float: left; |
| max-width: 25em; |
| max-width: 25em; |
| } |
| } |
| #mlsearch_options.nojs li:nth-child(even) { |
| #mlsearch_options.nojs li:nth-child(even) { |
| float: right; |
| float: right; |
| } |
| } |
| #mlsearch_options .mlsearch_option .input_check { |
| #mlsearch_options .mlsearch_option .input_check { |
| margin: 0 0 0 0.5em; |
| margin: 0 0 0 0.5em; |
| float: right; |
| float: right; |
| } |
| } |
| #mlsearch_options .mlsearch_option { |
| #mlsearch_options .mlsearch_option { |
| padding: 0.2em 0; |
| padding: 0.2em 0; |
| } |
| } |
| |
| |
| |
| |
| /* $LOGIN */ |
| /* $LOGIN */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* Styles for the login areas. */ |
| /* Styles for the login areas. */ |
| /* @todo - Width would be better in em. */ |
| /* @todo - Width would be better in em. */ |
| .login { |
| .login { |
| margin: 0 auto; |
| margin: 0 auto; |
| max-width: 540px; |
| max-width: 540px; |
| } |
| } |
| .login dl { |
| .login dl { |
| clear: right; |
| clear: right; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| .login dt, .login dd { |
| .login dt, .login dd { |
| margin: 0 0 5px 0; |
| margin: 0 0 5px 0; |
| padding: 1px; |
| padding: 1px; |
| width: 44%; |
| width: 44%; |
| } |
| } |
| .login dt { |
| .login dt { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| text-align: right; |
| text-align: right; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| .login dd { |
| .login dd { |
| float: right; |
| float: right; |
| width: 54%; |
| width: 54%; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| .login dl:nth-of-type(2) dt { |
| .login dl:nth-of-type(2) dt { |
| padding-top: 3px; |
| padding-top: 3px; |
| } |
| } |
| .login dl:nth-of-type(2) dd img { |
| .login dl:nth-of-type(2) dd img { |
| vertical-align: top; |
| vertical-align: top; |
| } |
| } |
| .login p { |
| .login p { |
| text-align: center; |
| text-align: center; |
| } |
| } |
| |
| |
| /* Additional register fields. */ |
| /* Additional register fields. */ |
| .register_form { |
| .register_form { |
| clear: right; |
| clear: right; |
| margin: 0; |
| margin: 0; |
| } |
| } |
| .register_form dt { |
| .register_form dt { |
| float: left; |
| float: left; |
| clear: both; |
| clear: both; |
| margin: 6px 0 0 0; |
| margin: 6px 0 0 0; |
| width: 50%; |
| width: 50%; |
| font-weight: normal; |
| font-weight: normal; |
| } |
| } |
| .register_form dt span { |
| .register_form dt span { |
| display: block; |
| display: block; |
| } |
| } |
| .register_form dd { |
| .register_form dd { |
| float: left; |
| float: left; |
| margin: 6px 0 0 0; |
| margin: 6px 0 0 0; |
| width: 49%; |
| width: 49%; |
| } |
| } |
| .register_form img { |
| .register_form img { |
| vertical-align: middle; |
| vertical-align: middle; |
| } |
| } |
| #confirm_buttons { |
| #confirm_buttons { |
| padding: 12px 0; |
| padding: 12px 0; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| #confirm_buttons .button_submit { |
| #confirm_buttons .button_submit { |
| white-space: normal; |
| white-space: normal; |
| } |
| } |
| .coppa_contact { |
| .coppa_contact { |
| margin-left: 5ex; |
| margin-left: 5ex; |
| padding: 4px; |
| padding: 4px; |
| width: 32ex; |
| width: 32ex; |
| } |
| } |
| #agreement_box { |
| #agreement_box { |
| overflow-y: scroll; |
| overflow-y: scroll; |
| height: 180px; |
| height: 180px; |
| padding: 8px; |
| padding: 8px; |
| text-align: justify; |
| text-align: justify; |
| border: 1px solid; |
| border: 1px solid; |
| margin-bottom: 2em; |
| margin-bottom: 2em; |
| } |
| } |
| |
| |
| /* Styles for maintenance mode. */ |
| /* Styles for maintenance mode. */ |
| #maintenance_mode { |
| #maintenance_mode { |
| min-width: 520px; |
| min-width: 520px; |
| width: 75%; |
| width: 75%; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| #maintenance_mode .floatleft { |
| #maintenance_mode .floatleft { |
| margin-right: 12px; |
| margin-right: 12px; |
| } |
| } |
| |
| |
| /* Common for all admin sections. */ |
| /* Common for all admin sections. */ |
| /* The admin logon form */ |
| /* The admin logon form */ |
| #admin_content { |
| #admin_content { |
| clear: both; |
| clear: both; |
| padding-top: 8px; |
| padding-top: 8px; |
| } |
| } |
| /* Custom profile fields like to play with us some times. */ |
| /* Custom profile fields like to play with us some times. */ |
| #admin_content .custom_field { |
| #admin_content .custom_field { |
| margin-bottom: 15px; |
| margin-bottom: 15px; |
| } |
| } |
| #admin_login { |
| #admin_login { |
| padding: 12px; |
| padding: 12px; |
| } |
| } |
| #admin_login img { |
| #admin_login img { |
| vertical-align: middle; |
| vertical-align: middle; |
| padding: 2px 2px 4px; |
| padding: 2px 2px 4px; |
| } |
| } |
| |
| |
| /* $BOXES */ |
| /* $BOXES */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| |
| |
| /* Lotsa boxes. */ |
| /* Lotsa boxes. */ |
| .description, .information, .warningbox, .successbox, .infobox, .errorbox { |
| .description, .information, .warningbox, .successbox, .infobox, .errorbox { |
| margin: 0 0 12px 0; |
| margin: 0 0 12px 0; |
| padding: 6px 12px; |
| padding: 6px 12px; |
| border: 1px solid #ccc; |
| |
| background: #fff; |
| |
| font-size: 0.929em; |
| font-size: 0.929em; |
| } |
| } |
| /* Information boxes. */ |
| |
| .information { |
| |
| background: #f0f6f0; |
| |
| } |
| |
| .information p { |
| .information p { |
| padding: 12px; |
| padding: 12px; |
| } |
| } |
| /* More little boxes on a hillside. */ |
| /* More little boxes on a hillside. */ |
| .warningbox, .successbox, .infobox, .errorbox { |
| .warningbox, .successbox, .infobox, .errorbox { |
| padding-left: 35px; |
| padding-left: 35px; |
| } |
| } |
| .errorbox { |
| .errorbox { |
| margin-bottom: 12px; |
| margin-bottom: 12px; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| |
| |
| /* Styles for (fatal) errors. */ |
| /* Styles for (fatal) errors. */ |
| #fatal_error { |
| #fatal_error { |
| margin: auto; |
| margin: auto; |
| padding-bottom: 1em; |
| padding-bottom: 1em; |
| width: 80%; |
| width: 80%; |
| } |
| } |
| .errorbox h3 { |
| .errorbox h3 { |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| text-decoration: underline; |
| text-decoration: underline; |
| font-size: 1.071em; |
| font-size: 1.071em; |
| } |
| } |
| .errorbox .listlevel1, |
| .errorbox .listlevel1, |
| .warningbox .listlevel1 { |
| .warningbox .listlevel1 { |
| float: none; |
| float: none; |
| padding-left: 1em; |
| padding-left: 1em; |
| line-height: 1.75em; |
| line-height: 1.75em; |
| } |
| } |
| .errorbox .alert { |
| .errorbox .alert { |
| float: left; |
| float: left; |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| width: 12px; |
| width: 12px; |
| font-size: 1.5em; |
| font-size: 1.5em; |
| } |
| } |
| .errorbox .smalltext { |
| .errorbox .smalltext { |
| display: block; |
| display: block; |
| padding-left: 1em; |
| padding-left: 1em; |
| } |
| } |
| .ban_cannot_post { |
| .ban_cannot_post { |
| margin: 2ex; |
| margin: 2ex; |
| padding: 2ex; |
| padding: 2ex; |
| border: 2px dashed; |
| border: 2px dashed; |
| } |
| } |
| |
| |
| |
| |
| /* $PROGRESS */ |
| /* $PROGRESS */ |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| /* Styles for the progress bar */ |
| /* Styles for the progress bar */ |
| /* @todo - Height in pt? WTF? */ |
| /* @todo - Height in pt? WTF? */ |
| .progress_bar { |
| .progress_bar { |
| position: relative; |
| position: relative; |
| margin: 20px auto 0 auto; |
| margin: 20px auto 0 auto; |
| padding: 3px; |
| padding: 3px; |
| width: 80%; |
| width: 80%; |
| height: 15pt; |
| height: 15pt; |
| } |
| } |
| .progress_bar .full_bar { |
| .progress_bar .full_bar { |
| position: absolute; |
| position: absolute; |
| z-index: 2; |
| z-index: 2; |
| padding-top: 1pt; |
| padding-top: 1pt; |
| width: 100%; |
| width: 100%; |
| text-align: center; |
| text-align: center; |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| .progress_bar .green_percent { |
| .progress_bar .green_percent { |
| z-index: 1; |
| z-index: 1; |
| height: 15pt; |
| height: 15pt; |
| } |
| } |
| .progress_bar .blue_percent { |
| .progress_bar .blue_percent { |
| z-index: 1; |
| z-index: 1; |
| height: 15pt; |
| height: 15pt; |
| } |
| } |
| .loading { |
| .loading { |
| width: 35px; |
| width: 35px; |
| height: 35px; |
| height: 35px; |
| } |
| } |
| |
| |
| /* floating error box */ |
| /* floating error box */ |
| /* currently used by like functionality */ |
| /* currently used by like functionality */ |
| .floating_error { |
| .floating_error { |
| position: fixed; |
| position: fixed; |
| width: 50%; |
| width: 50%; |
| margin: 0; |
| margin: 0; |
| padding: 10px 0 0; |
| padding: 10px 0 0; |
| text-align: center; |
| text-align: center; |
| z-index: 102; |
| z-index: 102; |
| } |
| } |
| |
| |
| .floating_error .error_heading { |
| .floating_error .error_heading { |
| margin: 0; |
| margin: 0; |
| padding: 5px 10px 0; |
| padding: 5px 10px 0; |
| } |
| } |
| |
| |
| .floating_error .error_msg { |
| .floating_error .error_msg { |
| margin: 10px auto 15px; |
| margin: 10px auto 15px; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| |
| |
| .floating_error .error_btn { |
| .floating_error .error_btn { |
| padding: 10px; |
| padding: 10px; |
| position: relative; |
| position: relative; |
| margin: 0; |
| margin: 0; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| |
| |
| |
| |
| |
| |
| /* $MEDIA */ |
| /* $MEDIA */ |
| /* Experimental media queries. |
| /* Experimental media queries. |
| /* ------------------------------------------------------- */ |
| /* ------------------------------------------------------- */ |
| /* NOTE: |
| /* NOTE: |
| /* When setting break points for media queries, don't set them in pixels. |
| /* When setting break points for media queries, don't set them in pixels. |
| /* Use em instead. |
| /* Use em instead. |
| /* Why? Because the point of re-stacking/dropping content is to fit it all |
| /* Why? Because the point of re-stacking/dropping content is to fit it all |
| /* in the available space. This is dependent not just on width in pixels, |
| /* in the available space. This is dependent not just on width in pixels, |
| /* but also on the user-selected text size that is set in the browser. |
| /* but also on the user-selected text size that is set in the browser. |
| /* |
| /* |
| /* If, for whatever reason (eyesight, pixel pitch, workstation arrangement, etc.) |
| /* If, for whatever reason (eyesight, pixel pitch, workstation arrangement, etc.) |
| /* a user requires text 50% larger than theme default, then their screen is |
| /* a user requires text 50% larger than theme default, then their screen is |
| /* effectively a lot smaller than its nominal resolution would indicate. |
| /* effectively a lot smaller than its nominal resolution would indicate. |
| /* If the break points are set in em, suddenly the media queries become equally |
| /* If the break points are set in em, suddenly the media queries become equally |
| /* responsive for all users, without any extra code being required. |
| /* responsive for all users, without any extra code being required. |
| /* |
| /* |
| /* Testing em break points is just as easy as testing pixels, |
| /* Testing em break points is just as easy as testing pixels, |
| /* and it will make more people happier. This is cool. :) |
| /* and it will make more people happier. This is cool. :) |
| /* |
| /* |
| /* Of course, having comments to map em to px for each query is a good idea too. |
| /* Of course, having comments to map em to px for each query is a good idea too. |
| |
| |
| /* Styles for print media. |
| /* Styles for print media. |
| ------------------------------------------------------- */ |
| ------------------------------------------------------- */ |
| @media print { |
| @media print { |
| #headerarea |
| #headerarea |
| { |
| { |
| display: none; |
| display: none; |
| } |
| } |
| } |
| } |
| |
| |
| /* @todo - WIP - Still needs more elements and stuff. */ |
| /* @todo - WIP - Still needs more elements and stuff. */ |
| |
| |
| /* Not sure how fussy we should get here, |
| /* Not sure how fussy we should get here, |
| /* given that there is supposed to be a separate phone theme. |
| /* given that there is supposed to be a separate phone theme. |
| /* Am currently inclined to think that just having break points that correlate |
| /* Am currently inclined to think that just having break points that correlate |
| /* to 1024, 800 and 480 at standard font size is probably adequate. */ |
| /* to 1024, 800 and 480 at standard font size is probably adequate. */ |
| /* using 100% = 1 em ~= 16px ~= 14pt for our em sizing .. 64em*16px = 1024 etc. */ |
| /* using 100% = 1 em ~= 16px ~= 14pt for our em sizing .. 64em*16px = 1024 etc. */ |
| |
| |
| /* This one does 1024 screens at default font size. */ |
| /* This one does 1024 screens at default font size. */ |
| @media screen and (max-width: 64em) { |
| @media screen and (max-width: 64em) { |
| .topic_latest { |
| .topic_latest { |
| min-width: 20em; |
| min-width: 20em; |
| } |
| } |
| .topic_latest.relative { |
| .topic_latest.relative { |
| min-width: 15em; |
| min-width: 15em; |
| } |
| } |
| .board_latest { |
| .board_latest { |
| min-width: 22em; |
| min-width: 22em; |
| width: 40%; |
| width: 40%; |
| } |
| } |
| .lastpost_link { |
| .lastpost_link { |
| display: block; |
| display: block; |
| } |
| } |
| .board_stats, .topic_stats { |
| .board_stats, .topic_stats { |
| display: none; |
| display: none; |
| } |
| } |
| .bbc_img, .elk_video { |
| .bbc_img, .elk_video { |
| max-width: 100%; |
| max-width: 100%; |
| } |
| } |
| .elk_previewvideo { |
| .elk_previewvideo { |
| max-width: 100%; |
| max-width: 100%; |
| } |
| } |
| |
| .profile_attachments { |
| |
| margin: 0 0.5em; |
| |
| width: auto; |
| |
| text-align: center; |
| |
| } |
| |
| .profile_attachments tr { |
| |
| display: inline; |
| |
| } |
| |
| .profile_attachments .profile_attachment { |
| |
| display: inline-block; |
| |
| width: 129px; |
| |
| height: 149px; |
| |
| margin: 5px; |
| |
| } |
| } |
| } |
| /* This one does 800 screens at default font size. */ |
| /* This one does 800 screens at default font size. */ |
| @media screen and (max-width: 50em) { |
| @media screen and (max-width: 50em) { |
| #logobox img { |
| #logobox img { |
| max-width: 95%; |
| max-width: 95%; |
| } |
| } |
| .topic_latest { |
| .topic_latest { |
| min-width: 15em; |
| min-width: 15em; |
| display: block; |
| display: block; |
| } |
| } |
| .board_avatar { |
| .board_avatar { |
| display: none; |
| display: none; |
| } |
| } |
| #main_menu .linklevel1 { |
| #main_menu .linklevel1 { |
| margin-right: 5px; |
| margin-right: 5px; |
| box-shadow: none; |
| box-shadow: none; |
| border: 1px solid transparent; |
| border: 1px solid transparent; |
| } |
| } |
| #main_menu .linklevel1, #main_menu .linklevel1 a { |
| #main_menu .linklevel1, #main_menu .linklevel1 a { |
| margin: 0; |
| margin: 0; |
| padding: 0; |
| padding: 0; |
| } |
| } |
| #main_menu .linklevel1>.pm_indicator { |
| #main_menu .linklevel1>.pm_indicator { |
| display: none; |
| display: none; |
| } |
| } |
| .button_title, .topic_moderation_alt { |
| .button_title, .topic_moderation_alt { |
| display: none; |
| display: none; |
| } |
| } |
| .topic_moderation { |
| .topic_moderation { |
| display: inline-block; |
| display: inline-block; |
| float: right; |
| float: right; |
| width: auto; |
| width: auto; |
| } |
| } |
| #collapse_button { |
| #collapse_button { |
| display: none; |
| display: none; |
| } |
| } |
| .wrapper { |
| .wrapper { |
| min-width: 98%; |
| min-width: 98%; |
| } |
| } |
| .linktree { |
| .linktree { |
| max-width: 95%; |
| max-width: 95%; |
| white-space: nowrap; |
| white-space: nowrap; |
| text-overflow: ellipsis; |
| text-overflow: ellipsis; |
| } |
| } |
| .topic_lastpost { |
| .topic_lastpost { |
| min-width: 18em; |
| min-width: 18em; |
| } |
| } |
| .topic_latest.relative .topic_lastpost { |
| .topic_latest.relative .topic_lastpost { |
| min-width: 16em; |
| min-width: 16em; |
| } |
| } |
| .board_row { |
| .board_row { |
| min-width: 20em; |
| min-width: 20em; |
| } |
| } |
| .board_name { |
| .board_name { |
| margin: 12px 0 0 56px; |
| margin: 12px 0 0 56px; |
| } |
| } |
| .board_lastposter { |
| .board_lastposter { |
| display: block; |
| display: block; |
| } |
| } |
| .board_lastpost, .board_latest { |
| .board_lastpost, .board_latest { |
| min-width: 14em; |
| min-width: 14em; |
| } |
| } |
| .board_name:after { |
| .board_name:after { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| content: ""; |
| content: ""; |
| } |
| } |
| .board_info .board_description, .board_info .moderators, .childboards { |
| .board_info .board_description, .board_info .moderators, .childboards { |
| margin: 0 0 0 8px; |
| margin: 0 0 0 8px; |
| } |
| } |
| /* Playing silly buggers with a sidebar menu option for narrow screens. */ |
| /* Playing silly buggers with a sidebar menu option for narrow screens. */ |
| #main_container { |
| #main_container { |
| position: relative; |
| position: relative; |
| padding: 0 0 0 12px; |
| padding: 0 0 0 12px; |
| } |
| } |
| #menu_sidebar { |
| #menu_sidebar { |
| position: absolute; |
| position: absolute; |
| left: -0.8em; |
| left: -0.8em; |
| width: 6px; |
| width: 6px; |
| min-height: 500px; |
| min-height: 500px; |
| z-index: 90; |
| z-index: 90; |
| } |
| } |
| #menu_sidebar ul, #menu_sidebar .category_header { |
| #menu_sidebar ul, #menu_sidebar .category_header { |
| display: none; |
| display: none; |
| } |
| } |
| #menu_sidebar:hover { |
| #menu_sidebar:hover { |
| width: 200px; |
| width: 200px; |
| padding: 0.8em 1em 1em 0.6em; |
| padding: 0.8em 1em 1em 0.6em; |
| } |
| } |
| #menu_sidebar:hover ul, #menu_sidebar:hover .category_header { |
| #menu_sidebar:hover ul, #menu_sidebar:hover .category_header { |
| display: block; |
| display: block; |
| } |
| } |
| /* End playing silly buggers. */ |
| /* End playing silly buggers. */ |
| #top_section_notice { |
| #top_section_notice { |
| min-width: 250px; |
| min-width: 250px; |
| } |
| } |
| #password_login select { |
| #password_login select { |
| display: none; |
| display: none; |
| } |
| } |
| .poster { |
| .poster { |
| width: 7em; |
| width: 7em; |
| } |
| } |
| .poster .poster_online { |
| .poster .poster_online { |
| display: none; |
| display: none; |
| } |
| } |
| .postarea { |
| .postarea { |
| margin: 0 0 0 6em; |
| margin: 0 0 0 6em; |
| } |
| } |
| .avatar { |
| .avatar { |
| max-width: 7em; |
| max-width: 7em; |
| } |
| } |
| .poster_avatar a { |
| .poster_avatar a { |
| padding: 0; |
| padding: 0; |
| } |
| } |
| .quickbuttons .modified { |
| .quickbuttons .modified { |
| display: block; |
| display: block; |
| width: 100%; |
| width: 100%; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| #forumposts .views_text { |
| #forumposts .views_text { |
| display: none; |
| display: none; |
| } |
| } |
| #forumposts .nextlinks { |
| #forumposts .nextlinks { |
| width: 100%; |
| width: 100%; |
| text-align: right; |
| text-align: right; |
| white-space: normal; |
| white-space: normal; |
| } |
| } |
| #search_options { |
| #search_options { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .ignoreboards { |
| .ignoreboards { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .ignoreboards.floatright { |
| .ignoreboards.floatright { |
| float: none; |
| float: none; |
| } |
| } |
| /* our stats page */ |
| /* our stats page */ |
| .statistics .category_header { |
| .statistics .category_header { |
| width: 100%; |
| width: 100%; |
| box-sizing: border-box; |
| box-sizing: border-box; |
| margin: 0; |
| margin: 0; |
| } |
| } |
| .stats { |
| .stats { |
| width: 100%; |
| width: 100%; |
| box-sizing: border-box; |
| box-sizing: border-box; |
| float: none; |
| float: none; |
| margin: 0; |
| margin: 0; |
| } |
| } |
| .stats dt { |
| .stats dt { |
| font-weight: bold; |
| font-weight: bold; |
| } |
| } |
| #list_mentions .listaction { |
| #list_mentions .listaction { |
| display: none; |
| display: none; |
| } |
| } |
| .mlist li div:nth-child(n+6), .mlist li .email { |
| .mlist li div:nth-child(n+6), .mlist li .email { |
| display: none; |
| display: none; |
| } |
| } |
| .mlist li div.posts { |
| .mlist li div.posts { |
| display: table-cell; |
| display: table-cell; |
| } |
| } |
| .sticky_row .topic_info:before, .locked_row .topic_info:before, .locked_row.sticky_row .topic_info:before { |
| .sticky_row .topic_info:before, .locked_row .topic_info:before, .locked_row.sticky_row .topic_info:before { |
| margin-right: -18px; |
| margin-right: -18px; |
| } |
| } |
| .topic_name, .topic_starter { |
| .topic_name, .topic_starter { |
| margin-right: 18px; |
| margin-right: 18px; |
| } |
| } |
| |
| #ic_recentposts, #ps_recentposts, #ps_recenttopics { |
| |
| font-size: 1em; |
| |
| } |
| } |
| } |
| /* This one does 540 and smaller screens at default font size. */ |
| /* This one does 540 and smaller screens at default font size. */ |
| @media screen and (max-width: 33.750em) { |
| @media screen and (max-width: 33.750em) { |
| select, .input_text, .input_password { |
| select, .input_text, .input_password { |
| max-width: 12em; |
| max-width: 12em; |
| } |
| } |
| dt, dd, dd label, .login dt, #advanced_search dt { |
| dt, dd, dd label, .login dt, #advanced_search dt { |
| display: block; |
| display: block; |
| width: 90% !important; |
| width: 90% !important; |
| text-align: left; |
| text-align: left; |
| } |
| } |
| dd { |
| dd { |
| padding-left: 8% !important; |
| padding-left: 8% !important; |
| } |
| } |
| dd input, dd select, dd textarea { |
| dd input, dd select, dd textarea { |
| width: 90% !important; |
| width: 90% !important; |
| max-width: 90% !important; |
| max-width: 90% !important; |
| } |
| } |
| dd .input_check, dd .input_radio { |
| dd .input_check, dd .input_radio { |
| display: inline !important; |
| display: inline !important; |
| width: auto !important; |
| width: auto !important; |
| } |
| } |
| #search_options { |
| #search_options { |
| width: 100%; |
| width: 100%; |
| } |
| } |
| #posting_icons, .table_list .stats, .table_list .lastpost, .table_grid .lastpost { |
| #posting_icons, .table_list .stats, .table_list .lastpost, .table_grid .lastpost { |
| display: none; |
| display: none; |
| } |
| } |
| #wrapper, .frame { |
| #wrapper, .frame { |
| width: 100%; |
| width: 100%; |
| min-width: 300px; |
| min-width: 300px; |
| } |
| } |
| #main_content_section { |
| #main_content_section { |
| padding: 1px 2px 16px 3px; |
| padding: 1px 2px 16px 3px; |
| } |
| } |
| #search_form .input_text { |
| #search_form .input_text { |
| width: 7em; |
| width: 7em; |
| } |
| } |
| .post { |
| .post { |
| margin: 0 0 0 5px; |
| margin: 0 0 0 5px; |
| } |
| } |
| .frame { |
| .frame { |
| min-width: 100%; |
| min-width: 100%; |
| } |
| } |
| .topic_info { |
| .topic_info { |
| display: block; |
| display: block; |
| width: 95%; |
| width: 95%; |
| padding: 8px; |
| padding: 8px; |
| } |
| } |
| .locked_row, .sticky_row, .basic_row,.topic_listing, .topic_listing>li { |
| .locked_row, .sticky_row, .basic_row,.topic_listing, .topic_listing>li { |
| display: block; |
| display: block; |
| } |
| } |
| .sticky_row .topic_info:before, .locked_row .topic_info:before, .locked_row.sticky_row .topic_info:before { |
| .sticky_row .topic_info:before, .locked_row .topic_info:before, .locked_row.sticky_row .topic_info:before { |
| margin-right: 0; |
| margin-right: 0; |
| } |
| } |
| .topic_icons, .topic_moderation { |
| .topic_icons, .topic_moderation { |
| display: none; |
| display: none; |
| } |
| } |
| .topic_latest { |
| .topic_latest { |
| display: block; |
| display: block; |
| padding: 5px; |
| padding: 5px; |
| width: 97%; |
| width: 97%; |
| } |
| } |
| ul.buttonlist:before { |
| ul.buttonlist:before { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| content: ""; |
| content: ""; |
| } |
| } |
| .pagelinks { |
| .pagelinks { |
| height: 30px; |
| height: 30px; |
| /* Necessary for some browsers to keep the pages all on the same line */ |
| /* Necessary for some browsers to keep the pages all on the same line */ |
| min-width: 100%; |
| min-width: 100%; |
| } |
| } |
| .quickbuttons { |
| .quickbuttons { |
| white-space: nowrap; |
| white-space: nowrap; |
| } |
| } |
| .pagesection .buttonlist { |
| .pagesection .buttonlist { |
| float: none; |
| float: none; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| #whoisviewing { |
| #whoisviewing { |
| display: none; |
| display: none; |
| } |
| } |
| .pagesection .buttonlist li { |
| .pagesection .buttonlist li { |
| white-space: nowrap; |
| white-space: nowrap; |
| margin-bottom: 4px; |
| margin-bottom: 4px; |
| } |
| } |
| .topic_name, .topic_starter { |
| .topic_name, .topic_starter { |
| margin: 0; |
| margin: 0; |
| } |
| } |
| .topic_starter { |
| .topic_starter { |
| margin-top: 5px; |
| margin-top: 5px; |
| } |
| } |
| .topic_name h4 { |
| .topic_name h4 { |
| display: block; |
| display: block; |
| font-size: 1.357em; |
| font-size: 1.357em; |
| } |
| } |
| .topic_name h4 a { |
| .topic_name h4 a { |
| word-wrap: break-word; |
| word-wrap: break-word; |
| } |
| } |
| #wrapper { |
| #wrapper { |
| padding-left: 2px; |
| padding-left: 2px; |
| padding-right: 2px; |
| padding-right: 2px; |
| } |
| } |
| #gobottom, #gotop { |
| #gobottom, #gotop { |
| padding-right: 0.25em; |
| padding-right: 0.25em; |
| } |
| } |
| #message_index_jump_to { |
| #message_index_jump_to { |
| display: block; |
| display: block; |
| float: none; |
| float: none; |
| } |
| } |
| #news, #logobox, .rightheader #logobox, #top_section_notice { |
| #news, #logobox, .rightheader #logobox, #top_section_notice { |
| display: none; |
| display: none; |
| } |
| } |
| .avatar { |
| .avatar { |
| max-width: 40px; |
| max-width: 40px; |
| max-height: 40px; |
| max-height: 40px; |
| } |
| } |
| .postarea { |
| .postarea { |
| display: block; |
| display: block; |
| margin: 0; |
| margin: 0; |
| } |
| } |
| #forumposts .windowbg { |
| #forumposts .windowbg { |
| padding: 5px; |
| padding: 5px; |
| } |
| } |
| #forumposts h2 img { |
| #forumposts h2 img { |
| display: none; |
| display: none; |
| } |
| } |
| .keyinfo h5 { |
| .keyinfo h5 { |
| padding: 3px; |
| padding: 3px; |
| } |
| } |
| h2 .views_text, h2 .nextlinks { |
| h2 .views_text, h2 .nextlinks { |
| display: block; |
| display: block; |
| float: none; |
| float: none; |
| line-height: 1.4em; |
| line-height: 1.4em; |
| } |
| } |
| .modified { |
| .modified { |
| display: none; |
| display: none; |
| } |
| } |
| .board_row { |
| .board_row { |
| margin-top:3px; |
| margin-top:3px; |
| padding: 15px 0; |
| padding: 15px 0; |
| } |
| } |
| .board_info .board_description, .board_info .moderators { |
| .board_info .board_description, .board_info .moderators { |
| display: none; |
| display: none; |
| } |
| } |
| .childboard_row { |
| .childboard_row { |
| padding: 0 0 0 35px; |
| padding: 0 0 0 35px; |
| } |
| } |
| .childboards { |
| .childboards { |
| margin: 0 5px; |
| margin: 0 5px; |
| } |
| } |
| .childboards li { |
| .childboards li { |
| display: block; |
| display: block; |
| font-size: 1.2em; |
| font-size: 1.2em; |
| } |
| } |
| .childboards li:nth-child(n+2):before { |
| .childboards li:nth-child(n+2):before { |
| content: " - "; |
| content: " - "; |
| } |
| } |
| .board_info, .board_latest { |
| .board_info, .board_latest { |
| width: 100%; |
| width: 100%; |
| display: block; |
| display: block; |
| box-sizing: border-box; |
| box-sizing: border-box; |
| margin-bottom: 2px; |
| margin-bottom: 2px; |
| } |
| } |
| .board_latest { |
| .board_latest { |
| margin: 0 0 0 35px; |
| margin: 0 0 0 35px; |
| padding: 0 8px; |
| padding: 0 8px; |
| width: 90%; |
| width: 90%; |
| max-width: 90%; |
| max-width: 90%; |
| min-width: 90%; |
| min-width: 90%; |
| } |
| } |
| .board_lastpost, .topic_lastpost { |
| .board_lastpost, .topic_lastpost { |
| min-width: 18em; |
| min-width: 18em; |
| } |
| } |
| .board_lastpost { |
| .board_lastpost { |
| padding-top: 6px; |
| padding-top: 6px; |
| margin: 3px; |
| margin: 3px; |
| } |
| } |
| .board_info h3 a { |
| .board_info h3 a { |
| font-size: 1.357em; |
| font-size: 1.357em; |
| word-wrap: break-word; |
| word-wrap: break-word; |
| } |
| } |
| .board_name { |
| .board_name { |
| margin: 0 0 0 35px; |
| margin: 0 0 0 35px; |
| } |
| } |
| .board_info:after { |
| .board_info:after { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| content: ""; |
| content: ""; |
| } |
| } |
| .topic_listing>li { |
| .topic_listing>li { |
| margin-bottom: 5px; |
| margin-bottom: 5px; |
| } |
| } |
| .icon_anchor { |
| .icon_anchor { |
| min-width: 0; |
| min-width: 0; |
| } |
| } |
| .lastpost_link, .board_lastposter { |
| .lastpost_link, .board_lastposter { |
| font-size: 1.071em; |
| font-size: 1.071em; |
| display: inline; |
| display: inline; |
| } |
| } |
| .recentboard, .recentposter { |
| .recentboard, .recentposter { |
| display: none; |
| display: none; |
| } |
| } |
| .lastpost_link, .board_lastposter, .board_lasttime { |
| .lastpost_link, .board_lastposter, .board_lasttime { |
| white-space: normal; |
| white-space: normal; |
| } |
| } |
| #basicinfo, #detailedinfo { |
| #basicinfo, #detailedinfo { |
| float: none; |
| float: none; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .views_text, .nextlinks { |
| .views_text, .nextlinks { |
| display: none !important; |
| display: none !important; |
| } |
| } |
| #gotop, #gobottom { |
| #gotop, #gobottom { |
| bottom: 0%; |
| bottom: 0; |
| padding: 0.2em 0.1em; |
| padding: 0.2em 0.1em; |
| height: 1em; |
| height: 1em; |
| width: 1.2em; |
| width: 1.2em; |
| top: auto; |
| top: auto; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| #gotop { |
| #gotop { |
| margin-left: 1.45em; |
| margin-left: 1.45em; |
| } |
| } |
| .admin_menu li { |
| .admin_menu li { |
| float: left; |
| float: left; |
| display: block; |
| display: block; |
| width: 48%; |
| width: 48%; |
| } |
| } |
| #main_menu { |
| #main_menu { |
| clear: left; |
| clear: left; |
| } |
| } |
| .listlevel2:hover .menulevel3, .listlevel2.sfhover .menulevel3 { |
| .listlevel2:hover .menulevel3, .listlevel2.sfhover .menulevel3 { |
| left: -4px; |
| left: -4px; |
| } |
| } |
| .listlevel2, .listlevel3 { |
| .listlevel2, .listlevel3 { |
| max-width: 10em !important; |
| max-width: 10em !important; |
| } |
| } |
| .menulevel2 { |
| .menulevel2 { |
| max-width: 11em; |
| max-width: 11em; |
| } |
| } |
| .menulevel3 { |
| .menulevel3 { |
| display: none !important; |
| display: none !important; |
| } |
| } |
| #main_menu li ul li, .admin_menu li ul li { |
| #main_menu li ul li, .admin_menu li ul li { |
| float: left; |
| float: left; |
| display: block; |
| display: block; |
| width: 100%; |
| width: 100%; |
| } |
| } |
| .generalinfo { |
| .generalinfo { |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| ul.poster { |
| ul.poster { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| .poster { |
| .poster { |
| float: none; |
| float: none; |
| width: auto; |
| width: auto; |
| } |
| } |
| .poster .name { |
| .poster .name { |
| white-space: nowrap; |
| white-space: nowrap; |
| } |
| } |
| .poster .listlevel1 { |
| .poster .listlevel1 { |
| float: left; |
| float: left; |
| display: inline-block; |
| display: inline-block; |
| } |
| } |
| .poster li.membergroup { |
| .poster li.membergroup { |
| display: none; |
| display: none; |
| } |
| } |
| .poster li.avatar { |
| .poster li.avatar { |
| float: left; |
| float: left; |
| } |
| } |
| .poster .subsections { |
| .poster .subsections { |
| max-width: 200px; |
| max-width: 200px; |
| max-height: 1.5em; |
| max-height: 1.5em; |
| float: right; |
| float: right; |
| text-align: right; |
| text-align: right; |
| } |
| } |
| .poster .membergroup { |
| .poster .membergroup { |
| float: right; |
| float: right; |
| } |
| } |
| .poster .title, .poster .poster_online, .icons img { |
| .poster .title, .poster .poster_online, .icons img { |
| display: none; |
| display: none; |
| } |
| } |
| .poster:after, .posterarea:before { |
| .poster:after, .posterarea:before { |
| display: block; |
| display: block; |
| clear: both; |
| clear: both; |
| content: ""; |
| content: ""; |
| padding-bottom: 3px; |
| padding-bottom: 3px; |
| } |
| } |
| .postarea, .forumtitle { |
| .postarea, .forumtitle { |
| padding: 2px; |
| padding: 2px; |
| } |
| } |
| .linktree .board_moderators { |
| .linktree .board_moderators { |
| display: none; |
| display: none; |
| } |
| } |
| .statsbar .bar { |
| .statsbar .bar { |
| max-width: 12em; |
| max-width: 12em; |
| } |
| } |
| .signature { |
| .signature { |
| display: none; |
| display: none; |
| } |
| } |
| .forumposts .windowbg, .forumposts .windowbg2 { |
| .forumposts .windowbg, .forumposts .windowbg2 { |
| margin-bottom: 6px; |
| margin-bottom: 6px; |
| } |
| } |
| #moderationbuttons, a.linklevel1.button_strip_notify, |
| #moderationbuttons, a.linklevel1.button_strip_notify, |
| a.linklevel1.button_strip_print, a.linklevel1.button_strip_send, .inline_mod_check, |
| a.linklevel1.button_strip_print, a.linklevel1.button_strip_send, .inline_mod_check, |
| a.linklevel1.quotetonew_button, a.linklevel1.button_strip_post_poll, |
| a.linklevel1.quotetonew_button, a.linklevel1.button_strip_post_poll, |
| a.linklevel1.post_options, .keyinfo .post_subject, li.listlevel1.quickmod_select_all, |
| a.linklevel1.post_options, .keyinfo .post_subject, li.listlevel1.quickmod_select_all, |
| #collapse_button, p.inline.membergroups { |
| #collapse_button, p.inline.membergroups { |
| display: none !important; |
| display: none !important; |
| } |
| } |
| #display_jump_to { |
| #display_jump_to { |
| float: none; |
| float: none; |
| } |
| } |
| #button_profile .avatar { |
| #button_profile .avatar { |
| display: none; |
| display: none; |
| } |
| } |
| .quickbuttons { |
| .quickbuttons { |
| margin: 8px 8px 6px 3px; |
| margin: 8px 8px 6px 3px; |
| } |
| } |
| #search_form { |
| #search_form { |
| float: none; |
| float: none; |
| text-align: center; |
| text-align: center; |
| } |
| } |
| #search_jump_to, .search_controls { |
| #search_jump_to, .search_controls { |
| display: none; |
| display: none; |
| } |
| } |
| .small_pagelinks, .sort_by_container { |
| .small_pagelinks, .sort_by_container { |
| display: none; |
| display: none; |
| } |
| } |
| .profileblock_left, .profileblock_right { |
| .profileblock_left, .profileblock_right { |
| float: none; |
| float: none; |
| width: 100%; |
| width: 100%; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| .profile_attachments { |
| |
| |
| .profile_attachments .profile_attachment { |
| display: none; |
| width: 100px; |
| |
| } |
| |
| .profile_attachment a img { |
| |
| max-width: 100px; |
| |
| max-height: 100px; |
| } |
| } |
| .pagesection div.floatright { |
| .pagesection div.floatright { |
| float: none; |
| float: none; |
| display: block; |
| display: block; |
| } |
| } |
| .pm_icon, .pm_quickmod, .label_pms { |
| .pm_icon, .pm_quickmod, .label_pms { |
| display: none; |
| display: none; |
| } |
| } |
| .popup_window { |
| .popup_window { |
| width: 95%; |
| width: 95%; |
| } |
| } |
| .poster .menulevel2 { |
| .poster .menulevel2 { |
| float: right; |
| float: right; |
| } |
| } |
| .poster .listlevel1:hover .menulevel2, .poster .listlevel1.sfhover .menulevel2 { |
| .poster .listlevel1:hover .menulevel2, .poster .listlevel1.sfhover .menulevel2 { |
| left: auto; |
| left: auto; |
| right: 0; |
| right: 0; |
| } |
| } |
| .poster .listlevel2 { |
| .poster .listlevel2 { |
| max-width: 8em; |
| max-width: 8em; |
| width: 8em; |
| width: 8em; |
| } |
| } |
| .bbc_table_container { |
| .bbc_table_container { |
| max-width: 100%; |
| max-width: 100%; |
| overflow: auto; |
| overflow: auto; |
| } |
| } |
| .pm_from { |
| .pm_from { |
| text-align: left; |
| text-align: left; |
| max-width: 6em; |
| max-width: 6em; |
| word-wrap: break-word; |
| word-wrap: break-word; |
| } |
| } |
| #month_grid { |
| #month_grid { |
| display: none; |
| display: none; |
| } |
| } |
| #warning_level { |
| #warning_level { |
| max-width: 5em !important; |
| max-width: 5em !important; |
| } |
| } |
| /* mentions */ |
| /* mentions */ |
| .mentionavatar .avatar { |
| .mentionavatar .avatar { |
| max-width: 40px; |
| max-width: 40px; |
| max-height: 40px; |
| max-height: 40px; |
| } |
| } |
| #list_mentions thead, .mention_log_time { |
| #list_mentions thead, .mention_log_time { |
| display: none; |
| display: none; |
| } |
| } |
| ul.navigate_section li:not(:first-child):not(:last-child) a { |
| ul.navigate_section li:not(:first-child):not(:last-child) a { |
| width: 3em; |
| width: 3em; |
| display: block; |
| display: block; |
| white-space: nowrap; |
| white-space: nowrap; |
| overflow: hidden; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| text-overflow: ellipsis; |
| } |
| } |
| .mlist li .website, .mlist li .date_registered { |
| .mlist li .website, .mlist li .date_registered { |
| display: none; |
| display: none; |
| } |
| } |
| .whos_online dt { |
| .whos_online dt { |
| display: none; |
| display: none; |
| } |
| } |
| .whos online dd, .whos_online dd div { |
| .whos online dd, .whos_online dd div { |
| display: block; |
| display: block; |
| } |
| } |
| } |
| } |
| /* This one does 480px screens at default font size. */ |
| /* This one does 480px screens at default font size. */ |
| @media screen and (max-width: 30em) { |
| @media screen and (max-width: 30em) { |
| #button_admin { |
| #button_admin { |
| display: none; |
| display: none; |
| } |
| } |
| .quickbuttons .modified { |
| .quickbuttons .modified { |
| display: none; |
| display: none; |
| } |
| } |
| .mlist li div.posts { |
| .mlist li div.posts { |
| display: none; |
| display: none; |
| } |
| } |
| .shortcuts { |
| .shortcuts { |
| display: none; |
| display: none; |
| } |
| } |
| } |
| } |
| |
| |