Advertisement
rccharles

asc combined version 0.61

Mar 11th, 2017
529
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 28.70 KB | None | 0 0
  1. /*
  2.  
  3.     Custom Cascading Style Sheet for Apple Support Communities board system introduced
  4.  
  5.     in 2014-06
  6.  
  7.  
  8.  
  9.     Copyright 2014 Hiroto,  et. al.
  10.  
  11.  
  12.  
  13.     GNU General Public License
  14.  
  15.  
  16.     This program is free software: you can redistribute it and/or modify
  17.  
  18.     it under the terms of the GNU General Public License as published by
  19.  
  20.     the Free Software Foundation,  version 3
  21.  
  22.  
  23.     This program is distributed in the hope that it will be useful,
  24.  
  25.     but WITHOUT ANY WARRANTY; without even the implied warranty of
  26.  
  27.     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  28.  
  29.     GNU General Public License for more details.
  30.  
  31.  
  32.     For a copy of the GNU General Public License
  33.  
  34.     see <http://www.gnu.org/licenses/>.
  35.  
  36.  
  37.  
  38.  
  39.  
  40.     Change Log for Version 0.6:
  41.  
  42.     -- Fold versions 0.43 and 0.50 into this version.
  43.  
  44.     -- Add GNU General Public License
  45.  
  46.     -- Add media tag to select on screen size.
  47.  
  48.     -- Scroll large code listings
  49.  
  50.     -- Change color highlights unread posts
  51.  
  52.     -- Fix size of thread content display.
  53.  
  54.     Change Log for Version 0.61:
  55.  
  56.     -- Narrow text for printing listing of this file
  57.  
  58.     -- Delete "added in" comments about versioning.  Seems obvious to me without.
  59.  
  60.     -- More fixing of width of content display size of large window.
  61.  
  62.     -- Delete @-moz-document special case adjustment for max-width
  63.  
  64.     -- Size adjust for thread content and reply for large screens
  65.  
  66.     -- Reduce the amount of duplicate code
  67.  
  68.  
  69.  
  70.  
  71. */
  72.  
  73.  
  74. @-moz-document
  75.  
  76.     domain(discussions.apple.com),
  77.  
  78.     domain(discussionsjapan.apple.com),
  79.  
  80.     domain(discussionskorea.apple.com)
  81.  
  82. {
  83.  
  84. /* Common css for small and large windows */
  85.  
  86.  
  87. /* Scroll code listings.  set max-height of syntax highlighted code in thread
  88.  
  89.     content browser   v0.6 */
  90.  
  91. .jive-rendered-content .dp-highlighter {
  92.  
  93.      max-height: 500px !important;
  94.  
  95.      overflow: auto !important;
  96.  
  97. }                                                                              
  98.  
  99. /* Scroll code listings. set max-heiht of pre code (visible when javascript is disabled)
  100.  
  101.     v0.6 */
  102.  
  103. .jive-rendered-content pre {
  104.  
  105.      max-height: 500px !important;
  106.  
  107.      overflow: auto !important;
  108.  
  109. }  
  110.  
  111.                                                                          
  112.  
  113. /* highlights in dark blue unread posts when logged in.  v0.6
  114.  
  115.  
  116.     All your posts
  117.  
  118.     https://discussions.apple.com/content?filterID=participated~objecttype~objecttype[thread]
  119.  
  120.  
  121.  
  122.     Discussions you authored
  123.  
  124.     https://discussions.apple.com/content?filterID=contentstatus[published]~objecttype~objecttype[thread]
  125.  
  126.  
  127.  
  128.     To see the dicussions you have read and not read in a community
  129.  
  130.     The suffix to use for any ASC forum, placed after the basic link to any forum, it's
  131.  
  132.     /content?filterID=contentstatus[published]~objecttype~objecttype[thread]
  133.  
  134.  
  135.  
  136.     for iPhone community this would be:
  137.  
  138.     https://discussions.apple.com/community/iphone/using_iphone/content?filterID=contentstatus[published]~objecttype~objecttype[thread]
  139.  
  140.  
  141.  
  142. */
  143.  
  144. .j-td-title strong {color:#191970 !important; font-weight: normal !important;}
  145.  
  146.  
  147.     /* Combine duplicate code here.  v 0.61 */
  148.  
  149.  
  150.  
  151.     /* ---------------------------------------------------------------------------------
  152.  
  153.         BODY
  154.  
  155.     */
  156.  
  157.     body.j-body-welome,                /* Welcome */
  158.  
  159.     body.j-body-place,                /* Community */
  160.  
  161.     body.j-body-yourwork,            /* Content */
  162.  
  163.     body.j-body-home,                /* Activity */
  164.  
  165.     body.j-body-yourconnections,    /* People */
  166.  
  167.     body.j-body-preferences,        /* Preferences */
  168.  
  169.     body.jive-body-content,            /* Thread */
  170.  
  171.     body.jive-body-search,            /* Search */
  172.  
  173.     body.jive-view-profile            /* Profile */
  174.  
  175.     {                                                                         /* v0.43 */
  176.  
  177.         background: white !important;   /* Effectively overrides most of the body color.
  178.  
  179.                                           These are more specific.  */
  180.  
  181.     }
  182.  
  183.  
  184.  
  185.  
  186.     /* ---------------------------------------------------------------------------------
  187.  
  188.         TEXT
  189.  
  190.     */
  191.  
  192.     /* line spacing */
  193.  
  194.     .jive-content { line-height: 1.25 !important; }
  195.  
  196.  
  197.  
  198.  
  199.     /* ---------------------------------------------------------------------------------
  200.  
  201.         ASC HEADER AREA
  202.  
  203.     */
  204.  
  205.     #j-header,
  206.  
  207.     #j-compact-header,
  208.  
  209.     #j-footer { width: 100% !important; }
  210.  
  211.  
  212.  
  213.     /* navigation header (Apple Support Communities ...) */
  214.  
  215.     #j-header-wrap {
  216.  
  217.         padding: 0px 40px !important;
  218.  
  219.         margin: 0px 0px 15px !important;
  220.  
  221.     }
  222.  
  223.     #j-globalNav-bg {
  224.  
  225.         padding: 0pX !important;
  226.  
  227.         margin: 0px !important;
  228.  
  229.     }
  230.  
  231.     #j-satNav { overflow: visible !important; }
  232.  
  233.     #jive-breadcrumb { right: 40px !important; }
  234.  
  235.  
  236.     /* ---------------------------------------------------------------------------------
  237.  
  238.         THREAD LIST BROWSER - list of discussions in a Community
  239.  
  240.     */
  241.  
  242.  
  243.  
  244.     /* show author name in 'Latest activity' column in detailed list view of threads */
  245.  
  246.     td.j-td-date > span { display : inherit !important; }
  247.  
  248.  
  249.     /* main section */
  250.  
  251.     #j-main { padding: 0px !important; }
  252.  
  253.  
  254.     /* table cell title */
  255.  
  256.     .jive-table td.jive-table-cell-title { padding: 5px !important; }
  257.  
  258.      
  259.  
  260.     /* thread list view column widths */                                        /* v0.43 */
  261.  
  262.     .j-browse-details .j-td-title { max-width: none !important; }
  263.  
  264.     .j-browse-details .j-td-date {
  265.  
  266.         width: auto !important;
  267.  
  268.         max-width: 20% !important;
  269.  
  270.     }
  271.  
  272.     /* threads list view table tr td  */
  273.  
  274.     .j-browse-details-tbody tr td { padding: 5px !important; }
  275.  
  276.  
  277.     /* communities list view table tr td */
  278.  
  279.     .jive-communities-listing table tr td { padding: 5px !important; }
  280.  
  281.  
  282.  
  283.     /* thumbnails view width */
  284.  
  285.     .j-browse-content .j-thumb-view,
  286.  
  287.     .j-browse-places .j-browse-thumbnails,
  288.  
  289.     .j-browse-people .j-browse-thumbnails { width: 100% !important; }
  290.  
  291.  
  292.  
  293.     /* thumbnail view list item margin */                                        /* v0.43 */
  294.  
  295.     .j-browse-content .j-thumb-view > li,
  296.  
  297.     .j-browse-places .j-browse-thumbnails > li { margin-right: 20px !important; }
  298.  
  299.  
  300.     /* social actions row */
  301.  
  302.     .apple-social-actions-wrapper { margin-right: 0px !important; }
  303.  
  304.     .j-thread .j-social-actions { margin-right: 40px !important; }
  305.  
  306.  
  307.     /* apple header, subheader row ("Find helpful contents..." etc )    fixed in v0.43 */
  308.  
  309.     #apple-full-subheader,
  310.  
  311.     #apple-activity-subheader {
  312.  
  313.         padding: 0px 40px 15px !important;
  314.  
  315.         margin-bottom: 15px !important;
  316.  
  317.     }
  318.  
  319.     #apple-full-header h2,
  320.  
  321.     #apple-activity-header h2 { padding: 0px 40px !important; }
  322.  
  323.  
  324.     /* page header */
  325.  
  326.     .j-body-place #jive-body > header.j-page-header {
  327.  
  328.         margin-left: 40px !important;
  329.  
  330.         margin-right: 40px !important;
  331.  
  332.         width: auto !important;
  333.  
  334.     }
  335.  
  336.  
  337.  
  338.     /* browser filter row */
  339.  
  340.     #j-browse-filters { margin-bottom: 5px !important; }
  341.  
  342.  
  343.     /* browser controls row */
  344.  
  345.     .j-type-row { margin-bottom: 0px !important; }
  346.  
  347.  
  348.     /* browser controls content types (All Contents|User Tips|Discussions) width */
  349.  
  350.     #js-browse-controls .j-type-row .j-content-types { width: 90% !important; }
  351.  
  352.  
  353.  
  354.     /* browser controls view toggle (Thumbnails|Details) width */
  355.  
  356.     #js-browse-controls #j-item-view-toggle {
  357.  
  358.         width: 10% !important;
  359.  
  360.         display: table !important;
  361.  
  362.     }
  363.  
  364.  
  365.     /* content filter row (All|Open|Answered|Threads) */
  366.  
  367.     .j-content-filter {
  368.  
  369.         background: white !important;
  370.  
  371.         margin-bottom: 10px !important;
  372.  
  373.     }
  374.  
  375.  
  376.  
  377.     /* container canvas */
  378.  
  379.     .j-contained {
  380.  
  381.         margin-left: 40px !important;
  382.  
  383.         margin-right: 40px !important;
  384.  
  385.     }
  386.  
  387.  
  388.     /* category filter bar */
  389.  
  390.     .jive-content-filter {
  391.  
  392.         left: 0px !important;
  393.  
  394.         width: 80% !important;
  395.  
  396.     }
  397.  
  398.     .touchcarousel-wrapper { width: 100% !important; }
  399.  
  400.     .touchcarousel .tc-paging-container { width: 90% !important; }                /* v0.41 */
  401.  
  402.  
  403.     /* more search results available */
  404.  
  405.     #j-more-search-results-available { padding: 10px !important; }
  406.  
  407.  
  408.  
  409.     /* misc */
  410.  
  411.     .jive-widget { margin-bottom: 10px !important; }
  412.  
  413.     .j-column { margin-bottom: 10px !important; }
  414.  
  415.  
  416.     /* ---------------------------------------------------------------------------------
  417.  
  418.         THREAD CONTENT BROWSER - Displays the contents of the posts.
  419.  
  420.     */
  421.  
  422.     /* thread header */
  423.  
  424.     .apple-thread-header {
  425.  
  426.         width: auto !important;  /* v0.6 no more*/
  427.  
  428.         margin-bottom: 10px !important;
  429.  
  430.         margin-left: 40px !important;
  431.  
  432.     }
  433.  
  434.  
  435.  
  436.     /* thread original post */
  437.  
  438.     .j-thread .jive-content { margin: 0px 40px 0px 140px !important; }
  439.  
  440.  
  441.  
  442.     /* thread replies ul */
  443.  
  444.     ul.jive-discussion-replies.jive-discussion-indent-0 { margin: 0px !important; }
  445.  
  446.  
  447.  
  448.     /* thread reply li */
  449.  
  450.     .jive-discussion-replies li.reply { margin-top: 15px !important; }
  451.  
  452.  
  453.     /* thread view indent */
  454.  
  455.     .jive-discussion-indent-1 li.reply { padding-left: 15px !important; }
  456.  
  457.  
  458.  
  459.     /* thread info */
  460.  
  461.     .jive-thread-info {
  462.  
  463.         padding: 10px 40px !important;
  464.  
  465.         margin: 0px !important;
  466.  
  467.     }
  468.  
  469.  
  470.  
  471.     /* thread answer rollup */
  472.  
  473.     .j-answer-rollup { margin: 30px 0px !important; }
  474.  
  475.  
  476.  
  477.     /* thread post header (poster, date, response to) */
  478.  
  479.     .j-thread-post > header {
  480.  
  481.         padding: 10px 20px 0px 20px !important;
  482.  
  483.         margin-bottom: 12px !important;
  484.  
  485.     }
  486.  
  487.  
  488.  
  489.     /* thread post section (message body) */
  490.  
  491.     .j-thread-post section {
  492.  
  493.         padding: 0px 20px !important;
  494.  
  495.         margin-bottom: 6px !important;
  496.  
  497.     }
  498.  
  499.  
  500.  
  501.     /* thread post footer (Like|Reply etc) */
  502.  
  503.     .j-thread-post footer { padding: 0px 15px !important; }
  504.  
  505.     .j-thread-post footer > ul { padding: 2px !important; }
  506.  
  507.     .j-thread-post footer > .acclaim-container { margin: 5px 0px !important; }
  508.  
  509.  
  510.     /* thread rendered content. The text in the orginal post and replies.  */
  511.  
  512.     .jive-rendered-content {
  513.  
  514.         padding-bottom: 4px !important;
  515.  
  516.     }
  517.  
  518.  
  519.  
  520.     /* thread rendered content quote & pre */
  521.  
  522.     .jive-rendered-content .jive-quote,
  523.  
  524.     .jive-rendered-content .jive-pre {
  525.  
  526.         margin: 5px 15px !important;
  527.  
  528.     }
  529.  
  530.  
  531.     /* thread reply footer (Return to Community|Go to original post) */
  532.  
  533.     #jive-thread-reply-footer {    margin-top: 10px !important; }
  534.  
  535.  
  536.  
  537.     /* more like this links, incomming links */
  538.  
  539.     #apple-related-threads { margin: 0px 40px !important; }
  540.  
  541.     #apple-related-threads .j-box { margin-bottom: 0px !important; }
  542.  
  543.     .j-icon-list li { padding: 3px 0px 3px 22px !important; }
  544.  
  545.  
  546.     /* ---------------------------------------------------------------------------------
  547.  
  548.         INLINE EDITOR
  549.  
  550.     */
  551.  
  552.     /* editor */
  553.  
  554.     .jive-discussion-replies li.addReply { margin: 50px 40px 0px !important; }
  555.  
  556.  
  557.     /* ---------------------------------------------------------------------------------
  558.  
  559.         ADVANCED EDITOR
  560.  
  561.     */
  562.  
  563.     /* content area */
  564.  
  565.     .j-thread .jive-content.jive-create-thread,
  566.  
  567.     .jive-body-formpage-document .jive-content.doc-page {
  568.  
  569.         margin: 0px 40px !important;
  570.  
  571.         padding: 0px !important;
  572.  
  573.     }
  574.  
  575.  
  576.     /* header */
  577.  
  578.     .j-thread .jive-content.jive-create-thread h2,
  579.  
  580.     .jive-body-formpage-document .jive-content.doc-page h2 { padding: 0px !important; }
  581.  
  582.  
  583.     /* editor panel */
  584.  
  585.     .j-thread .jive-content.jive-create-thread #jive-compose-title,
  586.  
  587.     .j-thread .jive-content.jive-create-thread .jive-editor-panel.jive-large-editor-panel,
  588.  
  589.     .jive-body-formpage-document .jive-content.doc-page #jive-compose-title,
  590.  
  591.     .jive-body-formpage-document .jive-content.doc-page .jive-editor-panel.jive-large-editor-panel { margin: 0px !important; }
  592.  
  593.  
  594.     /* line height in editor */
  595.  
  596.     body.tiny_mce_content { line-height: inherit !important; }
  597.  
  598.  
  599.     /* replying to */
  600.  
  601.     .jive-body-formpage-comment .jive-thread-message { margin: 0px !important; }
  602.  
  603.  
  604.     /* buttons (Reply|Cancel) */
  605.  
  606.     .j-publishbar,
  607.  
  608.     .jive-body-formpage .jive-composebuttons { margin: 20px 40px 0px !important; }
  609.  
  610.  
  611.  
  612.  
  613.     /* ---------------------------------------------------------------------------------
  614.  
  615.         SEARCH RESULTS
  616.  
  617.     */
  618.  
  619.     /* search result entry */
  620.  
  621.     .j-search-results-main-container .j-search-result
  622.  
  623.         { padding: 10px !important; }    /* v0.43 */
  624.  
  625.  
  626.     /* ---------------------------------------------------------------------------------
  627.  
  628.         DOC (USER TIP)
  629.  
  630.     */                                                                            /* v0.43 */
  631.  
  632.     /* user tip canvas */
  633.  
  634.     .jive-body-content.j-doc .j-column-wrap-l { margin: 0px 40px !important; }
  635.  
  636.  
  637.     /* ---------------------------------------------------------------------------------
  638.  
  639.         PROFILE
  640.  
  641.     */                                                                            /* v0.43 */
  642.  
  643.     /* header & navigation bar (Bio|Activity|Content|Communities) */
  644.  
  645.     .j-view-profile .j-page-header { padding: 10px 40px !important; }
  646.  
  647.     .j-bigtab-nav { margin: 10px 40px !important; }
  648.  
  649.  
  650.  
  651.     /* Bio */
  652.  
  653.     .j-layout-l .j-column-wrap-l { width: 100% !important; }
  654.  
  655.  
  656.     /* Communities (places) sidebar ui blue marker adjustment
  657.  
  658.         (according to the sidebar width changed to 166px from 180px for selector:
  659.  
  660.         .j-layout-sl.j-browse-places .j-column-s in PLACES section)  */
  661.  
  662.     .j-view-profile .j-second-nav ul > li.active  { width: 156px !important; }
  663.  
  664.  
  665.  
  666. /* Wide screen browser
  667.  
  668.     ===================
  669.  
  670.  
  671.  
  672.     This rule set will be fine for normal to wide window whose width is ca. 1265px or greater.
  673.  
  674.     However, it will not be beneficial to very narrow window of 700-900px in width.
  675.  
  676. */
  677.  
  678.  
  679. @media all and (min-width: 1265px)                                                /* v0.6 */
  680.  
  681.   {
  682.  
  683.        /* ---------------------------------------------------------------------------------
  684.  
  685.         BODY
  686.  
  687.     */
  688.  
  689.  
  690.  
  691.     body {
  692.  
  693.         background: white;
  694.  
  695.         min-width: 0px !important;
  696.  
  697.     }
  698.  
  699.     #body-apple {
  700.  
  701.         width: 100% !important;
  702.  
  703.         min-width: 0px !important;
  704.  
  705.     }
  706.  
  707.  
  708.     /* ---------------------------------------------------------------------------------
  709.  
  710.         ASC TOP PAGE
  711.  
  712.     */
  713.  
  714.     #jive-widgetframe-body_5780758 > .content-large,    /* discussions.apple.com */
  715.  
  716.     #jive-widgetframe-body_188974  > .content-large,    /* discussionsjapan.apple.com */
  717.  
  718.                                                         /* v0.42 */
  719.  
  720.     #jive-widgetframe-body_20835   > .content-large        /* discussionskorea.apple.com */
  721.  
  722.                                                         /* v0.42 */
  723.  
  724.     {                                                    /* added parent id in v0.41 */
  725.  
  726.         text-align: center !important;
  727.  
  728.         overflow-x: auto !important;
  729.  
  730.         overflow-y: hidden !important;
  731.  
  732.     }
  733.  
  734.     .apple-communities {
  735.  
  736.         display: inline-block !important;
  737.  
  738.         width: 1120px !important;
  739.  
  740.         text-align: left !important;
  741.  
  742.     }
  743.  
  744.  
  745.     /* ---------------------------------------------------------------------------------
  746.  
  747.         THREAD LIST BROWSER - list of discussions in a Community
  748.  
  749.     */
  750.  
  751.  
  752.     /* ------------------
  753.  
  754.         When uncommented, hide Like and Bookmark columns in thread list view.
  755.  
  756.     */                                                                /* v0.43 (optional) */
  757.  
  758.     /* ~~~~~~~~~~~~~~~~~~~~ (currently commented out) ~~~>
  759.  
  760.     .j-browse-details .j-td-likes,
  761.  
  762.     .j-browse-details .j-td-bookmarks { display: none !important; }
  763.  
  764.     .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th,
  765.  
  766.     .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th + th
  767.  
  768.         { display: none !important; }
  769.  
  770.     .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th + th + th
  771.  
  772.         { display: table-cell !important; }
  773.  
  774.     <~~~~~~~~~~~~~~~~~~~~  */
  775.  
  776.  
  777.  
  778.  
  779.     /* ------------------
  780.  
  781.         Treatment for narrow window
  782.  
  783.         Method 1 (minimum optimisation)
  784.  
  785.  
  786.         Adjust thread list table's shift and margin to maximize its width.
  787.  
  788.     */                                                                                /* v0.43 */
  789.  
  790.     .j-layout-sl.j-browse-content .j-column-wrap-l { margin-left: -166px !important; }
  791.  
  792.     .j-layout-sl.j-browse-content .j-column-l      { margin-left: 166px !important; }
  793.  
  794.     .j-layout-sl.j-browse-content .j-column-s      { width: 166px !important; }
  795.  
  796.     /* ------------------ */
  797.  
  798.  
  799.     /* ------------------
  800.  
  801.         Swap left-right positions of thread list table and sidebar ui (filters & actions)
  802.  
  803.     */                                                                                /* fixed in v0.43 */
  804.  
  805.     /* let thread list table float left */
  806.  
  807.     .j-layout-sl.j-browse-content .j-column-wrap-l,
  808.  
  809.     .j-layout-sl.j-browse-places .j-column-wrap-l { float: left !important; }
  810.  
  811.  
  812.     /* let sidebar ui float right */
  813.  
  814.     .j-layout-sl.j-browse-content .j-column-s,
  815.  
  816.     .j-layout-sl.j-browse-places .j-column-s { float: right !important; }
  817.  
  818.     /* ------------------ */
  819.  
  820.  
  821.     /* ---------------------------------------------------------------------------------
  822.  
  823.         THREAD CONTENT BROWSER - Displays the contents of the posts.
  824.  
  825.     */
  826.  
  827.  
  828.  
  829.     /*
  830.  
  831.       Put the brakes on infinite expansion of text.  Sets how wide the text display area in a
  832.  
  833.       window can get. Eventhou the window maybe large, folks find it easier to read
  834.  
  835.       the words when the text area is smaller.
  836.  
  837.     */
  838.  
  839.     /* Original post.  Includes answering post if present */
  840.  
  841.     /* posts in thread */
  842.  
  843.     /* Types of replies */
  844.  
  845.     #jive-thread-messages-container,
  846.  
  847.     /* Advanced reply */
  848.  
  849.     #jive-body {
  850.  
  851.         max-width: 1100px !important;    /* v0.61 */
  852.  
  853.      }
  854.  
  855.  
  856.  
  857.  
  858.     /* ------------------
  859.  
  860.         Treatment for narrow window
  861.  
  862.         Method 1 (minimum optimisation)
  863.  
  864.  
  865.         Adjust community list table's shift and margin to maximize its width.
  866.  
  867.     */                                                                            /* v0.43 */
  868.  
  869.     .j-layout-sl.j-browse-places .j-column-wrap-l { margin-left: -166px !important; }
  870.  
  871.     .j-layout-sl.j-browse-places .j-column-l      { margin-left: 166px !important; }
  872.  
  873.     .j-layout-sl.j-browse-places .j-column-l      { padding-left: 0px !important; }
  874.  
  875.     .j-layout-sl.j-browse-places .j-column-s      { width: 166px !important; }
  876.  
  877.     /* ------------------ */
  878.  
  879.  
  880.  
  881.     /* ---------------------------------------------------------------------------------
  882.  
  883.         ACTIVITY STREAM
  884.  
  885.     */
  886.  
  887.     /* activity entry */
  888.  
  889.     .j-act-entry { padding: 5px 0px 10px 100px !important; }
  890.  
  891.  
  892.     /* activity title */
  893.  
  894.     .j-body-home .j-act-title { padding: 5px 0px 5px 24px !important; }
  895.  
  896.  
  897.     /* activity body & comment */                                                /* v0.43 */
  898.  
  899.     .j-body-home .j-act-init { padding: 5px 0px 10px 100px !important; }
  900.  
  901.     .apple-activity-comments-wrapper { margin-left: 0px !important; }
  902.  
  903.  
  904.     /* Like list */
  905.  
  906.     .j-act-grouped .j-act-g-item { padding: 3px !important; }
  907.  
  908.  
  909.  
  910.     /* -----------------------------------------------------------------------------------
  911.  
  912.        PLACES
  913.  
  914.     */                                                                            /* v0.43 */
  915.  
  916.     /* latest activity column */
  917.  
  918.     .j-browse-details .j-td-activity { max-width: 650px !important; }
  919.  
  920.  
  921. } /* end of media for wide screen */
  922.  
  923.  
  924.  
  925.   @media all and (max-width: 1265px)                                             /* v0.6 */
  926.  
  927.   {
  928.  
  929.     /* styles for small screens ( narrow browsers window )
  930.  
  931.        ========================
  932.  
  933.    
  934.  
  935.        Narrow is basically the same as the above wide screen browser except that this lets
  936.  
  937.        the sidebar column (filter column) in list view be pushed down or up in layout flow
  938.  
  939.        to make room for the main column (table column) when the window is not wide enough.
  940.  
  941.        It is done by setting margin-left and padding-left of main column to 0 and setting
  942.  
  943.        max-width of main column, which is currently 1019px.  Consequently, if window width
  944.  
  945.        is less than 1265px (= 40 (margin-left) + 1019 (main column) + 166 (sidebar colum)
  946.  
  947.        + 40 (margin-right)), sidebar column is pushed down or up according to document
  948.  
  949.        tree order. This rule set is intended to be useful for normal to narrow window
  950.  
  951.        whose width is in range ca. 700-1400px. It can be used for wider window as well but
  952.  
  953.        there's no point to set the max-width of main column in order to move sidebar
  954.  
  955.        column when the window is wide enough.
  956.  
  957.    
  958.  
  959.        custom styles for Apple Support Communities board system introduced in 2014-06
  960.  
  961.        (v 0.5)
  962.  
  963.     */
  964.  
  965.        
  966.  
  967.     /* -----------------------------------------------------------------------------------
  968.  
  969.         BODY
  970.  
  971.     */
  972.  
  973.  
  974.     body {
  975.  
  976.         background: white;
  977.  
  978.         min-width: 0px !important;
  979.  
  980.     }
  981.  
  982.     #body-apple {
  983.  
  984.         width: 100% !important;
  985.  
  986.         min-width: 0px !important;
  987.  
  988.     }
  989.  
  990.  
  991.  
  992.  
  993.     /* -----------------------------------------------------------------------------------
  994.  
  995.         ASC TOP PAGE
  996.  
  997.     */
  998.  
  999.     #jive-widgetframe-body_5780758 > .content-large,    /* discussions.apple.com */
  1000.  
  1001.     #jive-widgetframe-body_188974  > .content-large,    /* discussionsjapan.apple.com v0.42 */
  1002.  
  1003.     #jive-widgetframe-body_20835   > .content-large        /* discussionskorea.apple.com v0.42 */
  1004.  
  1005.     {                                                    /* added parent id in v0.41 */
  1006.  
  1007.         text-align: center !important;
  1008.  
  1009.         overflow-x: auto !important;
  1010.  
  1011.         overflow-y: hidden !important;
  1012.  
  1013.     }
  1014.  
  1015.     .apple-communities {
  1016.  
  1017.         display: inline-block !important;
  1018.  
  1019.         width: 1120px !important;
  1020.  
  1021.         text-align: left !important;
  1022.  
  1023.     }
  1024.  
  1025.  
  1026.     /* -----------------------------------------------------------------------------------
  1027.  
  1028.         THREAD LIST BROWSER
  1029.  
  1030.     */
  1031.  
  1032.  
  1033.  
  1034.     /* ------------------
  1035.  
  1036.         Hide Like and Bookmark columns in thread list view.
  1037.  
  1038.     */                                                                            /* v0.43 */
  1039.  
  1040.     /* ------------------ display in small screen        changed 0.6 */
  1041.  
  1042.     .j-browse-details .j-td-likes,
  1043.  
  1044.     .j-browse-details .j-td-bookmarks { display: none !important; }
  1045.  
  1046.     .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th,
  1047.  
  1048.     .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th + th
  1049.  
  1050.         { display: none !important; }
  1051.  
  1052.     .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th + th + th
  1053.  
  1054.         { display: table-cell !important; }
  1055.  
  1056.     /* ------------------ */
  1057.  
  1058.  
  1059.  
  1060.  
  1061.     /* ------------------
  1062.  
  1063.         Treatment for narrow window
  1064.  
  1065.         Method 1 (minimum optimisation)
  1066.  
  1067.  
  1068.         Adjust thread list table's shift and margin to maximize its width.
  1069.  
  1070.     */                                                                            /* v0.43 */
  1071.  
  1072.     /* ------------------ (currently commented out)
  1073.  
  1074.     .j-layout-sl.j-browse-content .j-column-wrap-l { margin-left: -166px !important; }
  1075.  
  1076.     .j-layout-sl.j-browse-content .j-column-l      { margin-left: 166px !important; }
  1077.  
  1078.     .j-layout-sl.j-browse-content .j-column-s      { width: 166px !important; }
  1079.  
  1080.     ------------------ */
  1081.  
  1082.     /* ------------------
  1083.  
  1084.         Treatment for narrow window
  1085.  
  1086.         Method 2 (more beneficial to narrow window but has disadvantage for wide window)
  1087.  
  1088.      
  1089.  
  1090.         Let thread list table have full width but not exceed 1019px to make room for sidebar
  1091.  
  1092.         ui (filters & actions).  If window is wide enough (>=1265px), sidebar ui is displayed
  1093.  
  1094.         next to thread list table, otherwise it is displayed below or above it (depending
  1095.  
  1096.         upon its document tree order).
  1097.  
  1098.      
  1099.  
  1100.         * sidebar width (constant)    = 166px
  1101.  
  1102.         * thread table max width      = 1019px
  1103.  
  1104.         * canvas margin-left          = 40px
  1105.  
  1106.         * canvas margin-right         = 40px
  1107.  
  1108.         ---------------------------------------
  1109.  
  1110.         * total                       = 1265px
  1111.  
  1112.     */                                                                          /* v0.5 */
  1113.  
  1114.     /* ------------------ (currently active) */
  1115.  
  1116.     .j-layout-sl.j-browse-content .j-column-wrap-l { max-width: 1019px !important; }
  1117.  
  1118.     .j-layout-sl.j-browse-content .j-column-wrap-l { margin-left: 0px !important; }
  1119.  
  1120.     .j-layout-sl.j-browse-content .j-column-l      { margin-left: 0px !important; }
  1121.  
  1122.     .j-layout-sl.j-browse-content .j-column-s      { width: 166px !important; }
  1123.  
  1124.     /* ------------------ */
  1125.  
  1126.  
  1127.     /* ------------------
  1128.  
  1129.         Swap left-right positions of thread list table and sidebar ui (filters & actions)
  1130.  
  1131.     */                                                                    /* fixed in v0.43 */
  1132.  
  1133.     /* let thread list table float left */
  1134.  
  1135.     .j-layout-sl.j-browse-content .j-column-wrap-l,
  1136.  
  1137.     .j-layout-sl.j-browse-places .j-column-wrap-l { float: left !important; }
  1138.  
  1139.  
  1140.     /* let sidebar ui float right */
  1141.  
  1142.     .j-layout-sl.j-browse-content .j-column-s,
  1143.  
  1144.     .j-layout-sl.j-browse-places .j-column-s { float: right !important; }
  1145.  
  1146.     /* ------------------ */
  1147.  
  1148.  
  1149.     /* -----------------------------------------------------------------------------------
  1150.  
  1151.         THREAD CONTENT BROWSER - Displays the contents of the posts.
  1152.  
  1153.     */
  1154.  
  1155.  
  1156.  
  1157.     /* -----------------------------------------------------------------------------------
  1158.  
  1159.         ACTIVITY STREAM
  1160.  
  1161.     */
  1162.  
  1163.     /* activity entry */
  1164.  
  1165.     .j-act-entry { padding: 5px 0px 10px 100px !important; }
  1166.  
  1167.  
  1168.     /* activity title */
  1169.  
  1170.     .j-body-home .j-act-title { padding: 5px 0px 5px 24px !important; }
  1171.  
  1172.  
  1173.     /* activity body & comment */                                                /* v0.43 */
  1174.  
  1175.     .j-body-home .j-act-init,
  1176.  
  1177.     .j-view-profile .j-act-init { padding: 5px 0px 10px 100px !important; }
  1178.  
  1179.     .apple-activity-comments-wrapper { margin-left: 0px !important; }
  1180.  
  1181.  
  1182.     /* Like list */
  1183.  
  1184.     .j-act-grouped .j-act-g-item { padding: 3px !important; }
  1185.  
  1186.  
  1187.  
  1188.  
  1189.  
  1190.  
  1191.  
  1192.     /* -----------------------------------------------------------------------------------
  1193.  
  1194.         PLACES
  1195.  
  1196.     */                                                                         /* v0.43 */
  1197.  
  1198.     /* latest activity column */
  1199.  
  1200.     .j-browse-details .j-td-activity { max-width: 650px !important; }
  1201.  
  1202.  
  1203.     /* ------------------
  1204.  
  1205.         Treatment for narrow window
  1206.  
  1207.         Method 1 (minimum optimisation)
  1208.  
  1209.  
  1210.         Adjust community list table's shift and margin to maximize its width.
  1211.  
  1212.     */                                                                            /* v0.43 */
  1213.  
  1214.     /* ------------------ (currently commented out)
  1215.  
  1216.     .j-layout-sl.j-browse-places .j-column-wrap-l { margin-left: -166px !important; }
  1217.  
  1218.     .j-layout-sl.j-browse-places .j-column-l      { margin-left: 166px !important; }
  1219.  
  1220.     .j-layout-sl.j-browse-places .j-column-s      { width: 166px !important; }
  1221.  
  1222.     ------------------ */
  1223.  
  1224.     /* ------------------
  1225.  
  1226.         Treatment for narrow window
  1227.  
  1228.         Method 2 (more beneficial to narrow window but has disadvantage for wide window)
  1229.  
  1230.      
  1231.  
  1232.         Let community list table have full width but not exceed 1019px to make room for
  1233.  
  1234.         sidebar ui (filters & actions).  If window is wide enough (>=1265px), sidebar ui
  1235.  
  1236.         is displayed next to community list table, otherwise it is displayed below or above
  1237.  
  1238.         it (depending upon its document tree order).
  1239.  
  1240.      
  1241.  
  1242.         * sidebar width (constant)    = 166px
  1243.  
  1244.         * community table max width   = 1019px
  1245.  
  1246.         * canvas margin-left          = 40px
  1247.  
  1248.         * canvas margin-right         = 40px
  1249.  
  1250.         ---------------------------------------
  1251.  
  1252.         * total                       = 1265px
  1253.  
  1254.     */                                                                            /* v0.5 */
  1255.  
  1256.     /* ------------------ (currently active) */
  1257.  
  1258.     .j-layout-sl.j-browse-places .j-column-wrap-l { max-width: 1019px !important; }
  1259.  
  1260.     .j-layout-sl.j-browse-places .j-column-wrap-l { margin-left: 0px !important; }
  1261.  
  1262.     .j-layout-sl.j-browse-places .j-column-l      { margin-left: 0px !important; }
  1263.  
  1264.     .j-layout-sl.j-browse-places .j-column-l      { padding-left: 0px !important; }
  1265.  
  1266.     .j-layout-sl.j-browse-places .j-column-s      { width: 166px !important; }
  1267.  
  1268.     /* ------------------ */
  1269.  
  1270.  
  1271.   }  /* end of media for narrow browsers. */
  1272.  
  1273.  
  1274. } /* @-moz-document */
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement