Advertisement
rccharles

ASC may 2016 look beta-i update

Jun 19th, 2016
384
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 67.96 KB | None | 0 0
  1. /*
  2.     custom styles for Apple Support Communities board system introduced in 2016-06
  3.  
  4.     Copyright 2014, 2016 Hiroto,  et. al.      
  5.      
  6.     GNU General Public License      
  7.      
  8.     This program is free software: you can redistribute it and/or modify      
  9.     it under the terms of the GNU General Public License as published by      
  10.     the Free Software Foundation,  version 3      
  11.      
  12.     This program is distributed in the hope that it will be useful,      
  13.     but WITHOUT ANY WARRANTY; without even the implied warranty of      
  14.     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the      
  15.     GNU General Public License for more details.      
  16.      
  17.     For a copy of the GNU General Public License      
  18.     see <http://www.gnu.org/licenses/>.        
  19.      
  20.     For more information on how to install this css and what the css does, see:      
  21.     https://discussions.apple.com/docs/DOC-7501      
  22.  
  23.     v0.2 by rccharles
  24.         - scrolling of large code blocks "advanced >> plain"
  25.         - reformat buttons
  26.         - nav list to horizontal for small windows
  27.         - option to sink legalistic bombblast.
  28.             Look for .~.~.~.~.~.~.~. then uncomment the three lines following
  29.         - expanded the display of posts in a discussion to view all posts.  Thanks turingtest2
  30.         - colored backgrounds for posts
  31.        
  32.     issues:
  33.         - reply button isn't indented correctly.
  34.    
  35.     v0.11
  36.         - introduced @media rules in THREAD LIST BROWSER and PLACES sections:
  37.             @media all and ( max-width: X ) rule
  38.             @media all and ( min-width: Y ) rule
  39.        
  40.         - added, refined and fixed rules in various sections, which include but not limited to
  41.             BODY
  42.                 - changed #body-apple {width: 100%} to {width: auto}, which is essential to
  43.                   prevent horizontal scroller from appearing in narrow window environment.
  44.             TEXT > font
  45.                 - added rules to use fine local font in lieu of illegible remote font
  46.             ASC TOP PAGE
  47.                 - added rules on 'search or ask a question', 'featured topics' etc
  48.             COMMUNITIES CATEGORIES OVERVIEW
  49.                 - new section
  50.             THREAD LIST BROWSER > community overview
  51.                 - added and refined rules (treating filter ui layout)
  52.             PROFILE > content
  53.                 - new subsection (treating browser control ui layout)
  54.             BLOG
  55.                 - new section
  56.             UNAUTHORIZED
  57.                 - new section
  58.  
  59.     v0.10d
  60.         - draft
  61.  
  62.     written by Hiroto, 2016-06
  63. */
  64. @-moz-document
  65.     domain(communities.apple.com),  /* Português & Spanish */
  66.     domain(discussions.apple.com),
  67.     domain(discussionsjapan.apple.com),
  68.     domain(discussionskorea.apple.com),
  69.     domain(discussionschinese.apple.com)
  70. {
  71.     /* ------------------------------------------------------------------------------------------------
  72.         BODY
  73.     */
  74.     body.j-body-welome,             /* Welcome */
  75.     body.j-body-place,              /* Community */
  76.     body.j-body-yourwork,           /* Content */
  77.     body.j-body-home,               /* Activity */
  78.     body.j-body-yourconnections,    /* People */
  79.     body.j-body-preferences,        /* Preferences */
  80.     body.jive-body-content,         /* Thread */
  81.     body.jive-body-search,          /* Search */
  82.     body.jive-view-profile          /* Profile */
  83.     {                                                                              
  84.         background: white  !important;
  85.     }
  86.     body {
  87.         min-width: 0px !important;
  88.     }
  89.    
  90.     /* Note: #body-apple is a div the covers the whole document.  So, it overrides the body tag. */
  91.     #body-apple {
  92.         width: auto !important;
  93.         min-width: 0px !important;
  94.         background: #f2f2f2  !important;
  95.     }
  96.     #globalheader { display: none !important; }                                    
  97.     #global-nav-wrapper {display: none !important; }                                
  98.     #globalfooter,
  99.     #globaldisclaimer { width: 80% !important; }                                    
  100.  
  101.    
  102.  
  103.     /* ------------------------------------------------------------------------------------------------
  104.         TEXT
  105.     */                                                                                      /* NEW */
  106.     body {
  107.         font-size: 16px !important;
  108.         font-weight: 400 !important;
  109.         line-height: 1.25 !important;
  110.     }
  111.     body * {
  112.         /* font-size: inherit !important; */
  113.        font-weight: inherit !important; /*  turns off bolding. 0.2 */
  114.        line-height: inherit !important;
  115.     }
  116.    
  117.  
  118.    
  119.     /* font
  120.        
  121.          
  122.           lang | remote font name
  123.           -----|-----------------
  124.             ja | "Apple TP"
  125.             ko | "Yoon Gothic"
  126.             zh | "PingHei"
  127.             en | "Myriad Set Pro"
  128.             es | "Myriad Set Pro"
  129.             pt | "Myriad Set Pro"
  130.     */                                                                                      /* NEW (experimental) */
  131. /*
  132.     * { font-family: "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif !important; }
  133. */
  134.     [lang|="ja"] * {
  135.         font-family: "Hiragino Kaku Gothic Pro", "Meiryo",
  136.                      "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
  137.     }
  138.     [lang|="ko"] * {
  139.         font-family: "Apple Gothic", "HY Gulim", "MalgumGothic", "HY Dotum", "Lexi Gulim",
  140.                      "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
  141.     }
  142.     [lang|="zh"] * {
  143.         font-family: "STHeitiSC-Light",
  144.                      "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
  145.     }
  146.     [lang|="en"] *,
  147.     [lang|="es"] *,
  148.     [lang|="pt"] * {
  149.         font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
  150.     }
  151.    
  152.     /* Start 0.2 additions */
  153.    
  154.    
  155.     /* Reduce white space in user tips */
  156.     /* Put bolding back.  body * is too strong above.  Hack strong back! */
  157.     strong {
  158.         font-weight: bold !important;}
  159.    
  160.     /* No line after Communities.  Waste of space and doesn't separate anything.
  161.            https://discussions.apple.com/community/mac_os/mac_os_x_technologies/content  */
  162.     div#j-header-wrap header nav#j-globalNav-bg {border-bottom: 0px !important; }
  163.    
  164.  
  165.  
  166.     /* ??? */
  167.      select#j-sort.form-cell.form-dropdown option {
  168.          padding: 5px 6px 5px 8px !important;
  169.          font-size: 14px !important;
  170.          width: 180px !important;      /* Was 220px */
  171.         color:green !important;
  172.        }
  173.                                                                                    
  174.     /* highlights in dark blue unread posts when logged in.  v0.6      
  175.      
  176.     All your posts      
  177.         https://discussions.apple.com/content?filterID=participated~objecttype~objecttype[thread]        
  178.      
  179.     Discussions you authored      
  180.         https://discussions.apple.com/content?filterID=contentstatus[published]~objecttype~objecttype[thread]        
  181.      
  182.     To see the discussions you have read and not read in a community      
  183.     The suffix to use for any ASC forum, placed after the basic link to any forum, it's      
  184.         /content?filterID=contentstatus[published]~objecttype~objecttype[thread]      
  185.      
  186.     for iPhone community this would be:      
  187.         https://discussions.apple.com/community/iphone/using_iphone/content
  188.             ?filterID=contentstatus[published]~objecttype~objecttype[thread]        
  189.      
  190.      
  191.     */  
  192.     .j-td-title strong {
  193.         color:#191970 !important;
  194.         font-weight: normal !important;}  
  195.    
  196.     /* Prevent capitalization of user names there. (Mine becomes Turingtest2 on that page and
  197.       nowhere else, which is daft!) */
  198.     .jive-username-link {text-transform: none !important;}        /* Remove username capitalization */
  199.          
  200.    
  201.     /* Scroll code listings.  set max-height of syntax highlighted code in thread      
  202.        content browser   */      
  203.     .jive-rendered-content .dp-highlighter {    
  204.        max-height: 500px !important;      
  205.        overflow: auto !important;      
  206.     }                                                                                  
  207.     /* Scroll code listings. set max-heiht of pre code (visible when javascript is disabled)  */      
  208.     .jive-rendered-content pre {      
  209.        max-height: 500px !important;      
  210.        overflow: auto !important;      
  211.     }  
  212.    
  213.     /* Rambling footer stuff will be sunk              
  214.        no more legalistic bomblast.
  215.        Read about Apple's worries on the Welcome page.
  216.        .~.~.~.~.~.~.~. */      
  217. /*  footer #globaldisclaimer {display: none !important; } */        
  218.     /* Not a complete path to here, so why be misleading */      
  219. /*  footer nav.footer-breadory {display: none !important; }    */      
  220.     /* Guess by now folks know how to buy an apple product */      
  221. /*  p.gf-buy {display: none !important; } */    
  222.    
  223.     /* end 0.2 additions */
  224.    
  225.     /* preseve monospace for pre.jive-pre */
  226.     pre.jive-pre { font-family: monospace !important; }
  227.  
  228.    
  229.     /* ------------------------------------------------------------------------------------------------
  230.         ASC HEADER, FOOTER AREA
  231.     */
  232.     #j-header,
  233.     #j-compact-header,
  234.     #j-footer { width: 100% !important; }
  235.    
  236.     /* navigation header (Apple Support Communities ...) */
  237.     #j-header-wrap {
  238.         padding: 0px 40px !important;
  239.         margin: 0px 0px 15px !important;
  240.     }
  241.     #j-globalNav-bg {
  242.         padding: 0pX !important;
  243.         margin: 0px !important;
  244.         width: auto !important;                                                             /* NEW */
  245.     }
  246.     #j-satNav { overflow: visible !important; }
  247.  
  248.     #j-header-wrap { margin-bottom: 50px !important; }                                      /* NEW */
  249.     #apple-full-header { margin: 10px 0px 0px !important; }                                 /* NEW */
  250.     #second-row {                                                                           /* NEW */
  251.         padding-top: 25px !important;
  252.         height: 30px !important;
  253.     }
  254.  
  255.     /* announcement */                                                                      /* NEW */
  256.     #jive-alert {
  257.         width: auto !important;
  258.         max-width: inherit !important;
  259.         margin: -20px 40px 10px !important;
  260.     }
  261.     .j-thread #jive-alert {
  262.         margin: -50px 40px 10px !important;
  263.     }
  264.     .jive-body-formpage.j-thread #jive-alert {
  265.         margin: -30px 40px 10px !important;
  266.     }
  267.    
  268.     /* breadcrumb */                                                                        /* NEW */
  269.     #jive-breadcrumb {
  270.         width: auto !important;
  271.         margin-right: 40px !important;
  272.         position: relative !important;
  273.     }
  274.    
  275.     /* footter */                                                                           /* NEW */
  276.     .j-js-footer-wrap {
  277.         width: auto !important;
  278.         min-width: 0px !important;
  279.     }
  280.     footer#j-footer {
  281.         width: auto !important;
  282.         min-width: 0px !important;
  283.     }
  284.  
  285.  
  286.     /* ------------------------------------------------------------------------------------------------
  287.         ASC TOP PAGE
  288.     */
  289.     .j-body-welcome #jive-alert { margin: 0px 40px !important; }
  290.     .j-body-welcome .hero-container img { width: auto !important; }
  291.     .j-body-welcome.j-body-home [id|=jive-widgetframe] > .content-large {
  292.         text-align: center !important;
  293.         overflow-x: auto !important;
  294.         overflow-y: hidden !important;
  295.     }
  296.     .apple-communities {
  297.         display: inline-block !important;
  298.         width: auto !important;
  299.         text-align: left !important;
  300.     }
  301.  
  302.     /* search or ask a question */
  303.     .ask-a-question-container .j-form input[type="text"] { width: 90% !important; }
  304.  
  305.     /* featured topics */
  306.     .jive-widget-featuredcontentwidget h2 {
  307.         font-size: 28px !important;
  308.     }
  309.     .jive-widget-featuredcontentwidget .content-large .featured-content-header {
  310.         padding-bottom: 30px !important;
  311.     }
  312.     .jive-widget-featuredcontentwidget .content-large .featured-content-header p.sub-title {
  313.         margin: 10px 0px 20px !important;
  314.     }
  315.     .jive-widget-featuredcontentwidget .featured-list-container {
  316.         max-width: 1000px !important;
  317.     }
  318.     .jive-widget-featuredcontentwidget .featured-list-container .featured-list-row {
  319.         margin-bottom: 20px !important;
  320.         border-style: dotted !important;
  321.         border-width: thin !important;
  322.     }
  323.     .jive-widget-featuredcontentwidget .featured-list-container .featured-list-user {
  324.         margin: 0px 10px !important;
  325.     }
  326.     .jive-widget-featuredcontentwidget .featured-list-container .featured-list-desc {
  327.         margin: 0px 10px !important;
  328.     }
  329.     .jive-widget-featuredcontentwidget h4.title {
  330.         font-size: 18px !important;
  331.         margin: 10px 0px !important;
  332.         text-decoration: underline !important;
  333.     }
  334.     .jive-widget-featuredcontentwidget .rating-row,
  335.     .jive-widget-featuredcontentwidget .featured-list-container .featured-list-desc blockquote,
  336.     .jive-widget-featuredcontentwidget .featured-list-container .featured-list-desc .user-metadata {
  337.         margin-bottom: 10px !important;
  338.     }
  339.    
  340.     /* new to communities? */
  341.     .on-boarding .on-boarding-header h2 {
  342.         font-size: 28px !important;
  343.         margin: 0px 0px 25px !important;
  344.     }
  345.     .on-boarding .img-container { margin: 0px auto 30px !important; }
  346.    
  347.     /* how-to grid */
  348.     .on-boarding > .grid-display {
  349.         margin-top: 40px !important;
  350.         padding: 20px 0px !important;
  351.         max-width: 1000px !important;
  352.         display: inline-block !important;
  353.     }
  354.     .on-boarding .row .column h3 {
  355.         margin: 0px 30px 20px !important;
  356.         max-height: 50% !important;
  357.     }  
  358.  
  359.  
  360.     /* ------------------------------------------------------------------------------------------------
  361.         COMMUNITIES CATEGORIES OVERVIEW
  362.     */                                                                                      /* NEW */
  363.     /* communities description */
  364.     .apple-space-overview .jive-widget-subcommunitieswidget .community-image {
  365.         width: 200px !important;
  366.         position: absolute !important;
  367.         z-index: -1 !important;
  368.     }
  369.     .apple-space-overview .jive-widget-subcommunitieswidget .community-image img {
  370.         width: 200px !important;
  371.         height: 200px !important;
  372.     }
  373.     .apple-space-overview .jive-widget-subcommunitieswidget .community-description {
  374.         margin-bottom: 45px !important;
  375.     }
  376.     .apple-space-overview .jive-widget-subcommunitieswidget .community-description h1 {
  377.         font-size: 28px !important;
  378.         margin: 30px 0px !important;
  379.     }  
  380.    
  381.     /* top communities */
  382.     .apple-space-overview  h2.community-title {
  383.         font-size: 24px !important;
  384.         margin: 0px 0px 20px !important;
  385.     }
  386.     .apple-space-overview .category-latest-header h3 {
  387.         font-size: 22px !important;
  388.         margin: 0px 0px 20px !important;
  389.     }
  390.     .apple-space-overview .category-latest h3,
  391.     .apple-space-overview .category-latest h4 { font-size: 20px !important; }
  392.     .apple-space-overview .jive-widget-subcommunitieswidget .content-large       { padding: 10px !important; }
  393.     .apple-space-overview .jive-widget-subcommunitieswidget .content-large > nav { padding-top: 0px !important; }
  394.     .apple-space-overview .jive-widget-recentcontentfilterwidget {
  395.         padding-bottom: 10px !important;
  396.         margin-bottom: 0px !important;
  397.     }
  398.    
  399.     /* search for more topics */
  400.     .apple-space-overview .category-page .ask-a-question-header {
  401.         margin-top: 20px !important;
  402.         width: auto !important;
  403.     }
  404.     .apple-space-overview .category-page .ask-a-question-header h2 { font-size: 24px !important; }
  405.     .apple-space-overview .category-page .ask-a-question-container {
  406.         width: 80% !important;
  407.         max-width: 1000px !important;
  408.         margin: 30px auto !important;
  409.     }
  410.     .apple-space-overview .category-page .ask-a-question-container .j-form input[type="text"] {
  411.         padding: 10px 10px 10px 50px !important;
  412.         width: 94% !important;
  413.     }
  414.     .apple-space-overview .category-page .ask-a-question-footer { margin: 40px 0px !important; }
  415.    
  416.     /* contact apple support */
  417.     .apple-space-overview .section-eyebrow { font-size: 24px !important; }
  418.     .apple-space-overview .section-header {
  419.         font-size: 22px !important;
  420.         margin: 0px 0px 30px !important;
  421.     }
  422.        
  423.    
  424.     /* ------------------------------------------------------------------------------------------------
  425.         THREAD LIST BROWSER
  426.     */
  427.  
  428.     /* ------------------
  429.         community overview
  430.     */                                                                                      /* NEW */
  431.     .category-latest .category-latest-container .category-latest-row {
  432.         margin: 0px !important;
  433.         padding: 5px 0px !important;
  434.     }
  435.     .category-latest .category-latest-container .category-latest-row .discussion-metadata {
  436.         margin: 5px 0px !important;
  437.     }
  438.     .category-latest .category-latest-container .category-latest-row .discussion-title a {
  439.         font-size: 100% !important;
  440.         font-weight: 500 !important;
  441.         color: rgb(0, 136, 204) !important;
  442.     }
  443.     .category-latest .category-latest-container .category-latest-row:nth-child(odd) {
  444.         background: rgb(247, 247, 247) !important;
  445.     }
  446.     .category-latest .category-latest-container .category-latest-row .read-full {
  447.         display: none !important;
  448.     }
  449.     .category-latest .category-latest-container .category-latest-row .discussion-metadata .cell {
  450.         margin-right: 15px !important;
  451.     }
  452.     .category-latest .category-latest-container .category-latest-row .discussion-metadata .cell a {
  453.         color: rgb(0, 136, 204) !important;
  454.         text-decoration: none !important;
  455.     }
  456.    
  457.     .apple-space-overview #body-apple .list-page .ask-a-question-sidebar {
  458.         margin: 0px 70px 10px 0px !important;
  459.     }
  460.     .apple-space-overview #body-apple .list-page .ask-a-question-sidebar .ask-a-question-space-icon {
  461.         width: 128px !important;
  462.         height: 128px !important;
  463.     }
  464.     .apple-space-overview #body-apple .list-page .ask-a-question-wrapper .community-siblings {
  465.         padding: 5px 0px !important;
  466.         font-size: 20px !important;
  467.     }
  468.  
  469.     /* content filter (by type (solved|recommended|unanswered) & category) */
  470.     .jive-content-filter {
  471.         width: 20% !important;
  472.         max-width: 250px !important;
  473.         min-width: 100px !important;
  474.         padding: 0px 10px 0px 0px !important;
  475.     }
  476.     .jive-content-filter h2 {
  477.         margin-bottom: 15px !important;
  478.         font-weight: 500 !important;
  479.     }
  480.     .jive-content-filter ul li { margin: 3px 0px !important; }
  481.     .jive-content-filter ul li:nth-child(odd) { background: rgb(247, 247, 247) !important; }
  482.     .jive-content-filter ul li a.jive-content-filter-highlight { background: rgb(230, 240, 230) !important; }
  483.     /* ------------------ */
  484.    
  485.  
  486.     /* show author name in 'Latest activity' column in detailed list view of threads */
  487.     td.j-td-date > span { display : inherit !important; }
  488.  
  489.     /* main section */
  490.     #j-main { padding: 0px !important; }
  491.  
  492.     /* table cell title */
  493.     .jive-table td.jive-table-cell-title { padding: 5px !important; }
  494.        
  495.     /* thread list view column widths */                                            
  496.     .j-browse-details .j-td-title { max-width: none !important; }
  497.     .j-browse-details .j-td-date {
  498.         width: auto !important;
  499.         max-width: 20% !important;
  500.     }
  501.    
  502.     /* thread list view: read thread font weight */                                         /* NEW (feature restored) */
  503.     /* I'll go with dark blue.  In an earlier implementation of ASC, the bolded fond wasn't that noticeable, so
  504.        a dark blue was picked.  Might as well stay with it.                                    0.2 */
  505.  /*   .j-browse-details .j-td-title strong { font-weight: 600 !important; }  */
  506.    
  507.  
  508.     @media all and ( max-width: 1099px )
  509.     {
  510.         /* ------------------
  511.             Treatment for narrow window
  512.             Hide Like and Bookmark columns in thread list view if viewport width <= 1098 (= 1265 - 166)
  513.         */                                                                              
  514.         .j-browse-details .j-td-likes,
  515.         .j-browse-details .j-td-bookmarks { display: none !important; }
  516.         .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th,
  517.         .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th + th { display: none !important; }
  518.         .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th + th + th { display: table-cell !important; }
  519.     }
  520.  
  521.    
  522.     /* user name link */
  523.     .jive-username-link { text-transform: none !important; }                        
  524.  
  525.     /* threads list view table tr td  */                                                    /* CHANGED */
  526.     .j-browse-details-tbody tr td { padding: 2px !important; }
  527.  
  528.     /* threads list view left most icon */                                                  /* NEW */
  529.     .j-browse-details-tbody .j-td-icon { padding: 0px 6px 0px !important; }
  530.    
  531.     /* communities list view table tr td */
  532.     .jive-communities-listing table tr td { padding: 5px !important; }
  533.    
  534.     /* thumbnails view width */
  535.     .j-browse-content .j-thumb-view,
  536.     .j-browse-places .j-browse-thumbnails,
  537.     .j-browse-people .j-browse-thumbnails { width: 100% !important; }
  538.    
  539.     /* thumbnail view list item margin */                                          
  540.     .j-browse-content .j-thumb-view > li,
  541.     .j-browse-places .j-browse-thumbnails > li { margin-right: 20px !important; }
  542.    
  543.     /* thumbnail view article font size */                                                  /* NEW */
  544.     .j-thumb article { font-size: inherit !important; }
  545.    
  546.     /* thunbnail view article header height */                                              /* NEW */
  547.     .j-content-thumb header { height: 22px !important; }
  548.  
  549.     /* thumbnail view article header font size */                                           /* NEW */
  550.     .j-thumb header h4.shrunk { font-size: 80% !important; }
  551.     .j-browse-content .j-content-thumb header .icon {
  552.         font-size: 16px !important;
  553.         margin: 0px 8px 0px 0px !important;
  554.     }
  555.    
  556.     /* thumbnail view article height */                                                     /* NEW */
  557.     .j-browse-content .j-content-thumb article { height: 120px !important; }
  558.    
  559.     /* thumbnail view footer */                                                             /* NEW */
  560.     .j-browse-content .j-content-thumb.j-thumb footer { padding: 4px 0px 0px !important; }  
  561.  
  562.    
  563.     /* social actions row */
  564.     .apple-social-actions-wrapper { margin-right: 0px !important; }
  565.     .j-thread .j-social-actions { margin-right: 40px !important; }
  566.  
  567.     /* apple header, subheader row ("Find helpful contents..." etc )*/              
  568.     #apple-full-subheader,
  569.     #apple-activity-subheader {
  570.         padding: 0px 40px 15px !important;
  571.         margin-bottom: 15px !important;
  572.     }
  573.     #apple-full-header h2,
  574.     #apple-activity-header h2 { padding: 0px 40px !important; }
  575.  
  576.     /* page header */
  577.     .j-body-place #jive-body > header.j-page-header {
  578.         margin-left: 40px !important;
  579.         margin-right: 40px !important;
  580.         width: auto !important;
  581.     }
  582.    
  583.     /* pagenation */                                                                        /* NEW */
  584.     .j-pagination-prevnext > .j-pagination-prev,
  585.     .j-pagination-prevnext > .j-pagination-next { font-size: 0px !important; }  
  586.    
  587.    
  588.     /* browser filter row */
  589.     #j-browse-filters { margin-bottom: 5px !important; }
  590.  
  591.     /* browser controls row */
  592.     .j-type-row { margin-bottom: 0px !important; }
  593.  
  594.     /* browser controls content types (All Contents|User Tips|Discussions) width */
  595.     #js-browse-controls .j-type-row .j-content-types { width: 90% !important; }
  596.    
  597.     /* browser controls view toggle (Thumbnails|Details) width */
  598.     #js-browse-controls #j-item-view-toggle {
  599.         width: 10% !important;
  600.         display: table !important;
  601.     }
  602.  
  603.     /* content filter row (All|Open|Answered|Threads) */
  604.     .j-content-filter {
  605.         background: white !important;
  606.         margin-bottom: 10px !important;
  607.     }  
  608.    
  609.     /* container canvas */
  610.     .j-contained {
  611.         margin-left: 40px !important;
  612.         margin-right: 40px !important;
  613.     }
  614.  
  615.     /* more search results available */
  616.     #j-more-search-results-available { padding: 10px !important; }
  617.    
  618.     /* misc */
  619.     .jive-widget { margin-bottom: 10px !important; }
  620.     .j-column { margin-bottom: 10px !important; }
  621.  
  622.  
  623.     @media all and ( min-width: 1265px )
  624.     {
  625.         /* ------------------
  626.             Treatment for narrow window
  627.             Method 1 (minimum optimisation)
  628.    
  629.             Adjust thread list table's shift and margin to maximize its width.
  630.         */                                                                              
  631.         .j-layout-sl.j-browse-content .j-column-wrap-l { margin-left: -166px !important; }
  632.         .j-layout-sl.j-browse-content .j-column-l      { margin-left: 166px !important; }
  633.         .j-layout-sl.j-browse-content .j-column-s      { width: 166px !important; }
  634.     }
  635.     @media all and ( max-width: 1265px )
  636.     {
  637.         /* ------------------
  638.             Treatment for narrow window
  639.             Method 2 (more beneficial to narrow window but has disadvantage for wide window)
  640.            
  641.             Let thread list table have full width but not exceed 1019px to make room for sidebar ui (filters & actions).
  642.             If window is wide enough (>=1265px), sidebar ui is displayed next to thread list table,
  643.             otherwise it is displayed below or above it (depending upon its document tree order).
  644.            
  645.             * sidebar width (constant)    = 166px
  646.             * thread table max width      = 1019px
  647.             * canvas margin-left          = 40px
  648.             * canvas margin-right         = 40px
  649.             ---------------------------------------
  650.             * total                       = 1265px
  651.         */                                                                              
  652.         .j-layout-sl.j-browse-content .j-column-wrap-l { max-width: 1019px !important; }
  653.         .j-layout-sl.j-browse-content .j-column-wrap-l { margin-left: 0px !important; }
  654.         .j-layout-sl.j-browse-content .j-column-l      { margin-left: 0px !important; }
  655.         .j-layout-sl.j-browse-content .j-column-s      { width: 166px !important; }
  656.     }
  657.  
  658.  
  659.     /* ------------------
  660.         Swap left-right positions of thread list table and sidebar ui (filters & actions)
  661.     */                                                                              
  662.     /* let thread list table float left */
  663.     .j-layout-sl.j-browse-content .j-column-wrap-l,
  664.     .j-layout-sl.j-browse-places .j-column-wrap-l { float: left !important; }
  665.  
  666.     /* let sidebar ui float right */
  667.     .j-layout-sl.j-browse-content .j-column-s,
  668.     .j-layout-sl.j-browse-places .j-column-s { float: right !important; }
  669.     /* ------------------ */
  670.  
  671.  
  672.     /* ------------------
  673.         leader board
  674.     */
  675.     /* .jive-widget.jive-box.j-rc5.jive-widget-leaderboardwidget */
  676.    
  677. /*
  678.     .jive-widget-leaderboardwidget {display: none !important; }                    
  679. */
  680.  
  681.     .jive-widget-leaderboardwidget { max-width: 1000px !important; }                        
  682.     .jive-widget-leaderboardwidget .j-bigtab-nav .j-tabbar { padding-top: 10px !important; }
  683.     .jive-widget-leaderboardwidget .jive-widget-topmembers.split-columns ul li { min-height: 0px !important; }
  684.     .jive-widget-leaderboardwidget .top-member-username,
  685.     .jive-widget-leaderboardwidget .top-member-username * { font-size: inherit !important; }
  686.     .jive-widget-leaderboardwidget .top-member-username { margin-left: 15px !important; }
  687.     .jive-widget-leaderboardwidget .user-level-points {
  688.         font-size: 18px !important;
  689.         margin: 14px 0px !important;
  690.         width: 60px !important;
  691.         height: 30px !important;
  692.         padding: 8px 0px 0px !important;
  693.     }
  694.     .jive-widget-leaderboardwidget .top-member-profile-info { width: 80% !important; }
  695.     .jive-widget-leaderboardwidget .top-member-profile-info > a {
  696.         border-radius: 0% !important;
  697.         width: 60px !important;
  698.         height: 60px !important;
  699.     }
  700.     .jive-widget-leaderboardwidget .top-member-username a.jiveTT-hover-user { width: auto !important; }
  701.     .jive-widget-leaderboardwidget .pagination-class { margin-top: 30px !important; }
  702.     /* ------------------ */
  703.  
  704.  
  705.     /* article list
  706.         .j-rc5 is used to identify this list
  707.         e.g., https://discussions.apple.com/article/HT1939 */                      
  708.     .j-layout-sl.j-browse-content.j-rc5 #jive-body-maincol { margin: 0px 0px 0px 166px !important; }
  709.  
  710.  
  711.     /* ------------------------------------------------------------------------------------------------
  712.         THREAD CONTENT BROWSER
  713.     */
  714.     /* thread header */
  715.     .apple-thread-header {
  716.         width: auto !important;
  717.         margin-bottom: 10px !important;
  718.         margin-left: 40px !important;
  719.     }
  720.  
  721.     /* thread message */                                                                    /* NEW */
  722.     .j-thread .jive-content .j-thread-post .jive-rendered-content {
  723.         font-size:   inherit !important;
  724.     }
  725.     .j-thread #body-apple .jive-thread-messages h2.helpful-allreply,
  726.     .j-thread #body-apple #helpful-container,
  727.     .j-thread #body-apple .j-thread-post > header .j-post-author,
  728.     .j-thread #body-apple .thread-container-wrapper,
  729.     .j-thread #body-apple .all-replies-container,
  730.     .j-thread #body-apple #j-main #jive-breadcrumb,
  731.     .j-thread #body-apple .addReply,
  732.     .j-thread #body-apple #jive-body-intro-content {
  733.         max-width: inherit !important;
  734.         margin: 10px 40px !important;
  735.     }
  736.     .j-inresponse-to {
  737.         font-size: inherit !important;
  738.     }
  739.     .j-thread .jive-content .j-thread-post > header,
  740.     .j-thread .jive-content .j-thread-post > h3.header {
  741.         margin: 15px 0px 10px 0px !important;
  742.     }
  743.  
  744.  
  745.     /* thread original messeage (question) */                                               /* NEW */
  746.     /* #FFFFCC  parchment #EDF7E8 light green answered 0.2 */
  747.     .j-thread-post section.j-original-message {
  748.         margin: 0px 30px !important;
  749.         padding: 15px 10px !important;
  750.         border-style: dotted !important;
  751.         border-width: thin !important;
  752.         background: none repeat scroll 0% 0% #FFFFCC !important;  /* parchment 0.2 */
  753.     }
  754.     .j-thread-post section.j-original-message h1 {
  755.         max-width: inherit !important;
  756.         margin: 0px 60px 20px 60px !important;
  757.     }
  758.     .j-thread-post section.j-original-message .jive-rendered-content {
  759.         max-width: inherit !important;
  760.         margin: 0px 25px !important;
  761.     }
  762.    
  763.     /* original poster profile header */
  764.     .j-thread .jive-content .j-thread-post > header.js-original-header {
  765.         max-width: inherit !important;
  766.         margin: 0px 40px !important;
  767.         padding: 5px !important;
  768.     }
  769.  
  770.     .j-thread-post section .thread-actions {
  771.         max-width: inherit !important;
  772.         margin: 0px 25px !important;
  773.     }
  774.     .j-original-message .jive-rendered-content p {
  775.         font-size:   inherit !important;
  776.     }
  777.     .meta-posted {
  778.         max-width: inherit !important;
  779.         margin: 10px 25px 20px !important;
  780.     }
  781.     /* Q mark */
  782.     .j-original-message h1 .q-marker {
  783.         left: -60px !important;
  784.         font-size: 32px !important;
  785.     }
  786.    
  787.  
  788.     /* answer rollup */                                                                     /* NEW */
  789.     .j-answer-rollup.span-full-width {
  790.         background: none repeat scroll 0% 0% rgb(237, 247, 232) !important;
  791.         padding-bottom: 10px !important;
  792.         margin: 20px 0px 0px 0px !important;
  793.         border: 1px solid rgb(45, 184, 71) !important;
  794.     }
  795.     .j-inline-correct-answer {
  796.         padding: 0px !important;
  797.         max-width: inherit !important;
  798.         margin: 0px 10px !important;
  799.     }
  800.     .j-inline-correct-answer section {
  801.         margin: 10px 0px !important;
  802.     }
  803.     /* A mark */
  804.     .j-inline-correct-answer .answer-marker {
  805.         left: 0px !important;
  806.         font-size: 32px !important;
  807.     }
  808.    
  809.  
  810.     /* persistent question shown at top */                                                  /* NEW */
  811.     .persist-question.persist { display: none !important; }
  812.  
  813.    
  814.     /* Solved and Helpful marker text */                                                    /* NEW */
  815.     .j-thread-post header .j-correct-text,
  816.     .j-thread-post h3.header .j-correct-text,
  817.     .j-thread-post header .j-helpful-text,
  818.     .j-thread-post h3.header .j-helpful-text {
  819.         font-size: 22px !important;
  820.         background: none repeat scroll 0% 0% transparent !important;
  821.         border-style: none !important;
  822.         margin: 0px !important;
  823.         padding: 10px !important;
  824.     }
  825.  
  826.    
  827.     /* thread content */                                                                    /* CHANGED */
  828.     .j-thread .jive-content { margin: 0px 10px 0px 10px !important; }
  829.  
  830.    
  831.     /* thread replies ul */
  832.     ul.jive-discussion-replies.jive-discussion-indent-0 { margin: 0px !important; }
  833.    
  834.     /* thread reply li */
  835.     .jive-discussion-replies li.reply { margin-top: 15px !important; }
  836.  
  837.  
  838.     /* thread message border */                                                             /* NEW */
  839.     .jive-discussion-replies li.reply .jive-thread-message {
  840.         border-style: dotted !important;
  841.         border-width: thin !important;
  842.     }
  843.  
  844.  
  845.     /* orgininal poster comment background */                                               /* NEW */
  846.     .original-poster-comment {
  847.         background: none repeat scroll 0% 0% rgb(247, 247, 237) !important;
  848.         top:    0px !important;
  849.         right:  0px !important;
  850.         bottom: 0px !important;
  851.         left:   0px !important;
  852.     }
  853.  
  854.  
  855.     /* pagenation */                                                                        /* NEW */
  856.     .j-thread .jive-thread-messages .j-pagination {
  857.         margin: 30px 0px !important;
  858.     }
  859.  
  860.  
  861.     /* promoted helpful answer and prompted recommended answer */                           /* NEW */
  862.     .j-inline-promoted-helpful-answer,
  863.     .j-inline-recommended-answer {
  864.         background: none repeat scroll 0% 0% rgb(250, 240, 220) !important;
  865.         padding: 15px 10px 5px 10px !important;
  866.         margin: 0px 10px 15px 10px !important;
  867.         border-style: dotted !important;
  868.         border-width: thin !important;
  869.     }
  870.     .j-inline-promoted-helpful-answer p {
  871.         margin: 0px !important;
  872.     }
  873.     .j-inline-promoted-helpful-answer header .reply-date,
  874.     .j-inline-promoted-helpful-answer h3.header .reply-date,
  875.     .j-inline-recommended-answer header .reply-date,
  876.     .j-inline-recommended-answer h3.header .reply-date {
  877.         font-size: inherit !important;
  878.         margin: 10px 0px !important;
  879.     }
  880.     .j-inline-promoted-helpful-answer header .j-helpful-text,
  881.     .j-inline-promoted-helpful-answer h3.header .j-helpful-text,
  882.     .j-inline-recommended-answer header .j-helpful-text,
  883.     .j-inline-recommended-answer h3.header .j-helpful-text {
  884.         font-size: 22px !important;
  885.         background: none repeat scroll 0% 0% transparent !important;
  886.         border-style: none !important;
  887.         margin: 0px !important;
  888.     }
  889.     .j-inline-promoted-helpful-answer section .reply-body,
  890.     .j-inline-recommended-answer section .reply-body {
  891.         font-size: inherit !important;
  892.         margin-bottom: 20px !important;
  893.     }
  894.     .j-inline-promoted-helpful-answer section,
  895.     .j-inline-recommended-answer section {
  896.         padding: 0px 20px !important;
  897.     }
  898.     #helpful-container { padding-top: 0px !important; }
  899.     #helpful-container hr { margin: 10px !important; }
  900.     #helpful-container .more-answers { margin: 0px !important; }
  901.     #helpful-container .more-answers * { font-size: 24px !important; }
  902.  
  903.  
  904.     /* inline correct answer, helpful answer background */                                  /* NEW */
  905.     div[itemprop="acceptedAnswer"] {
  906.         background: none repeat scroll 0% 0% rgb(237, 247, 232) !important;
  907.     }
  908.     .j-thread .jive-content.j-helpful,
  909.     .j-thread .jive-content.j-helpful.j-op {
  910.         background: none repeat scroll 0% 0% rgb(250, 240, 220) !important;
  911.     }
  912.  
  913.  
  914.     /* switch between 'hellpful replies only' and 'all replies' */                          /* NEW */
  915.     .jive-thread-messages .helpful-all-switch * {  
  916.         font-size: 24px !important;
  917.     }
  918.     .jive-thread-messages .helpful-all-switch li.inactive {
  919.         padding: 0px !important;
  920.         top: 32px !important;
  921.     }
  922.     .jive-thread-messages .helpful-all-switch li.inactive span.menu {
  923.         width: auto  !important;
  924.         min-width: 160px !important;
  925.         padding: 5px  !important;
  926.         text-align: center !important;
  927.     }
  928.    
  929.  
  930.     /* thread content footer profile */                                                     /* NEW */
  931.     .j-thread-post section.j-original-message footer .footer-profile {
  932.         margin-right: 10px !important;
  933.     }
  934.     .j-thread-post footer .footer-profile {
  935.         margin-right: -10px !important;
  936.     }
  937.     .j-thread-post footer .footer-profile .j-status-level {
  938.         padding: 0px 10px 0px 0px !important;
  939.     }
  940.     .j-thread-post footer .footer-profile .username,
  941.     .j-thread-post footer .footer-profile .jive-username-link {
  942.         padding: 0px 10px 0px 10px !important;
  943.         max-width: 250px !important;
  944.     }
  945.     .j-inline-correct-answer footer .footer-profile .j-status-levels,
  946.     .j-inline-promoted-helpful-answer footer .footer-profile .j-status-levels,
  947.     .j-inline-recommended-answer footer .footer-profile .j-status-levels {
  948.         padding: 0px 10px 0px 0px !important;
  949.     }
  950.     .j-inline-correct-answer footer .footer-profile .username,
  951.     .j-inline-promoted-helpful-answer footer .footer-profile .username,
  952.     .j-inline-recommended-answer footer .footer-profile .username {
  953.         padding: 0px 10px 0px 10px !important;
  954.         max-width: 250px !important;
  955.     }
  956.  
  957.  
  958.     /* text wrap in header */
  959.     .j-thread-post > header .j-post-author { white-space: normal !important; }      
  960.    
  961.     /* thread post section (message body) */
  962.     .j-thread-post section {
  963.         padding: 0px 20px !important;
  964.         margin-bottom: 15px !important;                                                     /* CHANGED */
  965.     }
  966.    
  967.  
  968.     /* thread rendered content */
  969.     .jive-rendered-content { padding-bottom: 4px !important; }
  970.    
  971.     /* thread rendered content quote & pre */
  972.     .jive-rendered-content .jive-quote,
  973.     .jive-rendered-content .jive-pre {
  974.         margin: 5px 15px !important;
  975.     }
  976.  
  977.     /* thread reply footer (Return to Community | Go to original post) */
  978.     #jive-thread-reply-footer { margin-top: 10px !important; }
  979.    
  980.     /* more like this links, incomming links */
  981.     #apple-related-threads { margin: 0px 40px !important; }
  982.     #apple-related-threads .j-box { margin-bottom: 0px !important; }
  983.     .j-icon-list li { padding: 3px 0px 3px 22px !important; }
  984.  
  985.     /* related articles */                                                          
  986.     .apple-sidebar-property {
  987.         width: auto !important;
  988.         padding-left: 0px !important;
  989.     }
  990.     .jive-box-body.jive-sidebar-body.jive-sidebar-body-related-articles { padding: 15px 0px !important; }
  991.    
  992.  
  993.     /* ------------------
  994.         staus level, expertise, level points
  995.     */
  996.     /* status level expertise tile */
  997.     .j-status-level.expertise-tile,
  998.     .status-tile.expertise-tile { display: none !important; }                  
  999.    
  1000.     /* status level level points */
  1001.     .j-status-level .level-points span { display: inherit !important; }            
  1002.     .j-status-level .level-points { white-space: inherit !important; }              
  1003.     /* ------------------ */
  1004.  
  1005.  
  1006.     /* ------------------------------------------------------------------------------------------------
  1007.         INLINE EDITOR
  1008.     */
  1009.     /* editor */
  1010.     .jive-discussion-replies li.addReply { margin: 50px 40px 0px !important; }
  1011.  
  1012.  
  1013.     /* ------------------------------------------------------------------------------------------------
  1014.         ADVANCED EDITOR
  1015.     */
  1016.  
  1017.     /* content area */
  1018.     .j-thread.jive-body-formpage #body-apple .j-form {
  1019.         max-width: inherit !important;
  1020.         margin: 0px auto 20px !important;
  1021.         width: inherit !important;
  1022.     }
  1023.     .j-thread .jive-content.jive-create-thread,
  1024.     .jive-body-formpage-document .jive-content.doc-page {
  1025.         margin: 0px 40px !important;
  1026.         padding: 0px !important;
  1027.     }
  1028.  
  1029.  
  1030.     /* editor panel */
  1031.     .j-thread .jive-content.jive-create-thread #jive-compose-title,
  1032.     .j-thread .jive-content.jive-create-thread .jive-editor-panel.jive-large-editor-panel,
  1033.     .jive-body-formpage-document .jive-content.doc-page #jive-compose-title,
  1034.     .jive-body-formpage-document .jive-content.doc-page .jive-editor-panel.jive-large-editor-panel { margin: 0px !important; }
  1035.  
  1036.     /* line height in editor
  1037.    
  1038.        I've tracked down a copy/paste error that happens in the editor if you decide to rearrange things.
  1039.        Typically the cut and pasted text inherits an unwanted fixed size which isn't displayed in the
  1040.        editor and can be missed after submission. This issue can be suppressed by not explicitly setting
  1041.        the font size of the editor area.   turingtest2
  1042.          https://discussions.apple.com/docs/DOC-10241
  1043.     */
  1044.     body.tiny_mce_content { line-height: inherit !important; }
  1045.  
  1046.     /* replying to */
  1047.     p.jive-replying-to { padding: 20px 0px !important; }
  1048.     .jive-body-formpage-comment .jive-thread-message { margin: 0px 40px 0px 80px !important; }
  1049.  
  1050.     /* reply to avatar */
  1051.     .j-thread-post header .j-post-avatar {
  1052.         position: absolute !important;
  1053.         top: 0px !important;
  1054.         left: -50px !important;
  1055.         width: auto !important;
  1056.     }
  1057.    
  1058.     /* buttons (Reply|Cancel) 0,2
  1059.     .j-publishbar,
  1060.     .jive-body-formpage .jive-composebuttons { margin: 20px 40px 0px !important; } */
  1061.  
  1062.  
  1063.     /* ------------------------------------------------------------------------------------------------
  1064.         ACTIVITY STREAM
  1065.     */
  1066.     /* activity entry */
  1067.     .j-act-entry { padding: 5px 0px 10px 100px !important; }
  1068.  
  1069.     /* activity title */
  1070.     .j-body-home .j-act-title { padding: 5px 0px 5px 24px !important; }
  1071.  
  1072.     /* activity body & comment */                                                  
  1073.     .j-body-home .j-act-init { padding: 5px 0px 10px 100px !important; }
  1074.     .apple-activity-comments-wrapper { margin-left: 0px !important; }
  1075.  
  1076.     /* Like list */
  1077.     .j-act-grouped .j-act-g-item { padding: 3px !important; }
  1078.    
  1079.    
  1080.     /* ------------------------------------------------------------------------------------------------
  1081.         SEARCH RESULTS
  1082.     */
  1083.     /* search result entry */
  1084.     .j-search-results-main-container .j-search-result { padding: 10px !important; }
  1085.  
  1086.  
  1087.     /* ------------------------------------------------------------------------------------------------
  1088.         DOC (USER TIP)
  1089.     */                                                                              
  1090.     /* user tip canvas */
  1091.     .jive-body-content.j-doc .j-column-wrap-l { margin: 0px 40px !important; }
  1092.  
  1093.     /* user tip border etc */                                                               /* NEW */
  1094.     .j-doc .jive-content {
  1095.         margin: 0px !important;
  1096.         padding: 10px !important;
  1097.         border: thin dotted !important;
  1098.     }
  1099.  
  1100.  
  1101.     /* ------------------------------------------------------------------------------------------------
  1102.         BLOG (MODERATOR TIP)
  1103.     */                                                                                      /* NEW */                                                                      
  1104.     /* blog canvas */
  1105.     .jive-body-content.j-blog .j-column-wrap-l { margin: 0px 40px !important; }
  1106.    
  1107.     /* blog border etc */
  1108.     .jive-content-blog {
  1109.         margin: 0px !important;
  1110.         padding: 10px !important;
  1111.         border: thin dotted !important;
  1112.         border-radius: 0px !important;
  1113.     }
  1114.  
  1115.  
  1116.     /* ------------------------------------------------------------------------------------------------
  1117.         UNAUTHORIZED (WARNING)
  1118.     */                                                                                      /* NEW */                                                                      
  1119.     /* unauthorized error message */
  1120.     .jive-body-warn.jive-body-unathorized #j-main { margin: 0px 40px !important; }
  1121.  
  1122.    
  1123.     /* ------------------------------------------------------------------------------------------------
  1124.         PROFILE
  1125.     */                                                                              
  1126.     /* header & navigation bar (Bio|Activity|People|Content|Communities|Bookmarks) */
  1127.     .j-view-profile .j-page-header { padding: 10px 40px !important; }
  1128.     .j-bigtab-nav { margin: 10px 40px !important; }
  1129.    
  1130.     /* filter ui current selection blue marker */                                           /* NEW */
  1131.     .j-view-profile .j-second-nav ul > li.active {
  1132.         display: none !important;
  1133.     }
  1134.  
  1135.     /* ------------------
  1136.         Bio
  1137.     */
  1138.     .j-layout-l .j-column-wrap-l { width: 100% !important; }
  1139.    
  1140.     /* ------------------
  1141.         profile specialties and awards
  1142.     */
  1143.     /* profile status container for specialties and awards */                               /* REFINED (rule) */
  1144.     .jive-view-profile .profile-status-container { display: none !important; }
  1145.  
  1146.     /* profile modal note status row for specialties and awards */
  1147.     .status-row { display: none !important; }                                      
  1148.     /* ------------------ */
  1149.  
  1150.  
  1151.     /* ------------------
  1152.         Content
  1153.     */                                                                                      /* NEW */
  1154.     /* browser control ui */
  1155.     .j-view-profile .j-layout-sl.j-browse-content .j-column-s #js-browse-controls {
  1156.         margin: 25px 0px 0px -166px !important;
  1157.     }
  1158. } /* end */
  1159.  
  1160. /* ==============================================  
  1161.    Revise the display of posts in a Thread.      0.2
  1162.    Each of these cases may have one or more post after:
  1163.      -- Question only
  1164.      -- Question with answer
  1165.      -- Question with helpful
  1166.      -- Question with answer and helpful
  1167.    examples:
  1168.    https://discussions.apple.com/thread/7583029
  1169.    https://communities.apple.com/pt/thread/4531
  1170.    https://communities.apple.com/pt/thread/4705
  1171.  
  1172.   */
  1173. @-moz-document
  1174.    url-prefix(https://discussions.apple.com/thread),
  1175.    url-prefix(https://discussions.apple.com/message),
  1176.    url-prefix(https://discussions.apple.com/update-advanced-comment.jspa),
  1177.    url-prefix(https://discussionsjapan.apple.com/thread),
  1178.    url-prefix(https://discussionsjapan.apple.com/message),
  1179.    url-prefix(https://discussionsjapan.apple.com/update-advanced-comment.jspa),
  1180.    url-prefix(https://discussionskorea.apple.com/thread),
  1181.    url-prefix(https://discussionskorea.apple.com/message),
  1182.    url-prefix(https://discussionskorea.apple.com/update-advanced-comment.jspa),
  1183.    url-prefix(https://communities.apple.com/es/thread),  
  1184.    url-prefix(https://communities.apple.com/es/message),  /* I have not see an es message */
  1185.    url-prefix(https://communities.apple.com/es/update-advanced-comment.jspa),
  1186.    url-prefix(https://communities.apple.com/pt/thread),
  1187.    url-prefix(https://communities.apple.com/pt/message),
  1188.    url-prefix(https://communities.apple.com/pt/update-advanced-comment.jspa) {
  1189.        
  1190.         /* Debug to identify which page we found.  Place our ukiyo-e. */      
  1191.  /*   h1, h2, h3 {    
  1192.           background-color: aqua !important;      
  1193.           border: 2px dashed black !important;    
  1194.          }
  1195.    */
  1196.       /* significant classes and selecters
  1197.          To select in Question and posible answer and helpful
  1198.            section.j-original-message
  1199.        
  1200.          to select all replies
  1201.            div.all-replies-container
  1202.            ul-jive-discussion-replies.jive-discussion-flat.jive-discussion-indent-0
  1203.       */
  1204.        
  1205.    
  1206.      /* Tighten up double paragraphs spacing.  I put in a blank paragraph to separate "real"
  1207.         paragraphs  
  1208.           https://discussions.apple.com/message/30333231#30333231 */
  1209.      .j-thread .jive-content .j-thread-post section p,
  1210.      .j-thread .jive-content .j-thread-post section .jive-rendered-content p,
  1211.      .j-thread .jive-content .j-thread-post section.j-original-message .jive-rendered-content p {
  1212.         min-height: 0px !important;
  1213.      }
  1214.      p[style="min-height: 8pt; height: 8pt; padding: 0px;"] { height: 0.6em !important; }
  1215.      
  1216.      
  1217.      
  1218.      /* the control that shows all replies, and forces the display of all replies
  1219.         when they might otherwise be hidden. Thanks turingtest2, London, UK
  1220.         Hiroto, has similar css, but doesn't seem as effective */
  1221.      .more-answers {display: none !important;}                     /* Hide the more to the conversation block */
  1222.      .all-replies-container {display: inherit !important;}         /* Display all answers */
  1223.        
  1224.  
  1225.      /* For buttons without the black background like cancel */
  1226.      div.jive-composebuttons button.j-btn-global,
  1227.      span a.black-button.jive-acclaim-likelink,  /* question button */
  1228.      div.j-inline-correct-answer footer a.action-button,  /* answer button */
  1229.      span.js-acclaim-container.acclaim-container a /* response button */
  1230.        {
  1231.          padding: 7px 7px !important;
  1232.          color:  #0288CC !important;  /* light blue, was rgb(150,150,150) grey */
  1233.          font-size: 14px !important;
  1234.          line-height: 14px !important;
  1235.          background-color: #f2f2f2 !important;
  1236.  
  1237.        }
  1238.        
  1239.      /* button in reponse */
  1240.      div.all-replies-container .jive-thread-helpful-btn {
  1241.          color: #0288CC !important;  /* light blue */
  1242.          background-color: #f2f2f2 !important;
  1243.          
  1244.        }
  1245.        
  1246.      /* change lower button text from grey to light blue. */
  1247.           /* li.js-link-abuse *,*/
  1248.      a.discussionPermaLink,
  1249.      span.jive-icon-sml.jive-icon-warn {  color: #0288CC !important;  /* light blue */}
  1250.        
  1251.      /* Make all lower buttons the same. Who ever heard of different size buttons? */  
  1252.        
  1253.          /* save reply, button you get to save an edit of a post */
  1254.      div.jive-composebuttons button#submitButton.j-btn-callout,  /* post button on edit of orginal post */
  1255.          /* Correct answer.  Isn't as bad as the reply button, but might as well use the
  1256.             same set of rule, even if we do not need all. may not be correct button :-( */
  1257.      div.jive-thread-reply-btn-correct a,
  1258.          /* Following; upper right */
  1259.      a#jive-link-thread-following.button.following-button,  /* no box */
  1260.          /* alternative state of following button, follow */
  1261.      a#jive-link-thread-startFollowing.button.follow-button,
  1262.          /* action button with the V */
  1263.      a.apple-actions-link,  /* not working */
  1264.          /* Tone down Reply Button */
  1265.          /* footer div.footer-toplevel-actions a .discussionAdd, */
  1266.      .discussionAdd,
  1267.          /* clicking on Reply to get the inputput, this is the save */
  1268.      div input.jive-form-button-save.j-btn-callout,
  1269.           /* clicking on Reply to get the inputput, this is the cancel */
  1270.      div input.jive-form-button-cancel{
  1271.          background-image: none !important; ;   /* bye, bye gradiant */
  1272.          background-color: #f2f2f2 !important;
  1273.          color: #0288CC !important;  /* light blue, was rgb(150,150,150) grey */
  1274.          padding: 7px !important;
  1275.          font-size: 14px !important;
  1276.          line-height: 14px !important;
  1277.  
  1278.        }
  1279.      
  1280.      /*  save reply, button you get to save an edit of a post. touch up
  1281.        https://discussions.apple.com/update-advanced-comment.jspa?id=30347987 */
  1282.      div#body-apple button#submitButton.j-btn-callout { margin-left: 20px !important; }
  1283.    
  1284.        
  1285.      /* Following button, upper right. Might as well box it for consistancy */
  1286.      a#jive-link-thread-following.button.following-button  {
  1287.          border-style: solid !important;
  1288.          border-width: thin !important;
  1289.          border-color: #9b9b9b !important; /* grey, Apple's color */
  1290.          padding: 6px 6px 8px 28px !important;
  1291.        }
  1292.        
  1293.      
  1294.      
  1295.      /* Check icon with Following.  Move to the left of following. */
  1296.      span.following-check.icon.icon-check {margin-left: -10px !important; margin-top: -7px !important; }
  1297.        
  1298.      /* Tool icon button upper left, right of Following button */
  1299.        a#apple-actions-link { padding: 4px 6px 4px !important; }
  1300.      
  1301.      /* Tool icon button lower left. same row as reply button */
  1302.      a.js-toggle-thread-options.thread-options  { padding: 4px 4px 4px !important; }
  1303.            
  1304.      /* Tool box upper right */
  1305.      ul.apple-social-actions-toolbar li.apple-actions {height: 28px !important;}
  1306.        
  1307.           /* Following; upper right */
  1308.      a#jive-link-thread-following.button.following-button:hover,      
  1309.        /* post button on edit of orginal post */
  1310.      div.jive-composebuttons button#submitButton.j-btn-callout:hover,
  1311.           /* cancel button on edit of orginal post */
  1312.      div.jive-composebuttons button.j-btn-global:hover,
  1313.           /* clicking on Reply to get the input, this is the save */    
  1314.      div input.jive-form-button-save.j-btn-callout:hover,
  1315.           /* clicking on Reply to get the inputput, this is the cancel */
  1316.      div input.jive-form-button-cancel:hover,
  1317.        /* Reply button hover state */
  1318.        .discussionAdd:hover{ border-color: #0288CC !important; }
  1319.        
  1320.   } /* @-moz-document for responses */
  1321.  
  1322.  
  1323. /* ==============================================  0.2
  1324.  
  1325.     User tips
  1326.       https://discussions.apple.com/docs/DOC-7501
  1327. */
  1328.  
  1329. @-moz-document
  1330.    url-prefix(https://discussions.apple.com/docs),
  1331.    url-prefix(https://discussionsjapan.apple.com/docs),
  1332.    url-prefix(https://discussionskorea.apple.com/docs),
  1333.    url-prefix(https://communities.apple.com/es/docs),  
  1334.    url-prefix(https://communities.apple.com/pt/tdocs) {
  1335.  
  1336.        
  1337.       /*     Debug to identify which page we found.  Place our ukiyo-e. */      
  1338.  /*  h1, h2, h3 {    
  1339.           background-color: aqua !important;      
  1340.           border: 2px dashed black !important;    
  1341.          }  */
  1342.              
  1343.       /* Following button, upper right. Might as well box it for consistancy  
  1344.         the > is the child selector. Must be a child of the parent. */
  1345.       ul.apple-social-actions-toolbar > li .following-button  {
  1346.           background-image: none !important; ;   /* bye, bye gradiant */
  1347.           background-color: #f2f2f2 !important;
  1348.           color: #0288CC !important;  /* light blue, was rgb(150,150,150) grey */
  1349.           padding: 7px !important;
  1350.           font-size: 14px !important;
  1351.           line-height: 14px !important;
  1352.           border-style: solid !important;
  1353.           border-width: thin !important;
  1354.           border-color: #9b9b9b !important; /* grey, Apple's color */
  1355.           padding: 6px 6px 8px 28px !important;
  1356.           margin-top: 4px !important;
  1357.        }
  1358.        
  1359.  
  1360.      /* Check icon with Following.  Move to the left of following. */
  1361.      span.following-check.icon.icon-check {margin-left: -10px !important; margin-top: -7px !important; }
  1362.        
  1363.      /* Tool icon button upper left, right of Following button */
  1364.      a#apple-actions-link {
  1365.          padding: 4px 6px 4px !important;
  1366.        
  1367.        }
  1368.      
  1369.      /* Tool icon button lower left. same row as reply button */
  1370.      a.js-toggle-thread-options.thread-options  { padding: 4px 4px 4px !important; }
  1371.            
  1372.      /* Tool box upper right */
  1373.      ul.apple-social-actions-toolbar li.apple-actions {
  1374.          height: 28px !important;
  1375.          margin-top: 4px !important;
  1376.          margin-right: 4px !important;
  1377.        }
  1378.          
  1379.   /* User tips also show an extra line after each paragraph which adversely affects a list written as paragraphs */
  1380.   p {margin-bottom: 0.1em;}  
  1381.    
  1382.       /* User tip reply button when saving a reply */
  1383.   div.jive-form-buttons input.j-btn-callout,
  1384.       /* User tip cancel button when making a reply */
  1385.   div.jive-form-buttons input.j-btn-callout + input{
  1386.          background-image: none !important; ;   /* bye, bye gradiant */
  1387.          background-color: white !important;  
  1388.          color: #0288CC !important;  /* light blue, was rgb(150,150,150) grey */
  1389.          padding: 7px !important;
  1390.          font-size: 14px !important;
  1391.          line-height: 14px !important;
  1392.        }
  1393.  
  1394.        
  1395.        
  1396.    /* Hovering thing */
  1397.    div.jive-form-buttons input.j-btn-callout:hover,
  1398.    div.jive-form-buttons input.j-btn-callout + input:hover { border-color: #0288CC !important; }  
  1399.        
  1400. }
  1401.  
  1402. /* ==============================================
  1403.    For ASC web pages with a sidebar shown on narrow window, make the side bar
  1404.    horizontal. Adjusts the column sizes in lists.
  1405.    adding more @-moz-document callouts prevents collateral damage
  1406.    to other web pages when css class and id conflicts.
  1407.    example pages:
  1408.      https://discussions.apple.com/content?filterID=following~objecttype~objecttype[thread]
  1409.      https://discussions.apple.com/community/ipad/ipad_in_business_and_education/content
  1410.         ?filterID=contentstatus[published]~objecttype~objecttype[thread]
  1411.      https://communities.apple.com/es/community/ipad/using_ipad/content?filterID=
  1412.         contentstatus[published]~objecttype~objecttype[thread]
  1413.      https://communities.apple.com/pt/people/espa%C3%B1ol.rccharles/content?manage=true
  1414.    avoid:
  1415.      https://communities.apple.com/pt/search.jspa
  1416.  
  1417.    */
  1418.      
  1419. @-moz-document
  1420.    url-prefix(https://discussions.apple.com/content),
  1421.    url-prefix(https://discussions.apple.com/community),
  1422.    url-prefix(https://discussions.apple.com/people),
  1423.    url-prefix(https://discussionsjapan.apple.com/content),
  1424.    url-prefix(https://discussionsjapan.apple.com/community),
  1425.    url-prefix(https://discussionsjapan.apple.com/people),
  1426.    url-prefix(https://discussionskorea.apple.com/content),
  1427.    url-prefix(https://discussionskorea.apple.com/community),
  1428.    url-prefix(https://discussionskorea.apple.com/people),
  1429.    url-prefix(https://communities.apple.com/es/content),    
  1430.    url-prefix(https://communities.apple.com/es/community/),
  1431.    url-prefix(https://communities.apple.com/es/people),  
  1432.    url-prefix(https://communities.apple.com/pt/content),
  1433.    url-prefix(https://communities.apple.com/pt/community/),
  1434.    url-prefix(https://communities.apple.com/pt/people) {  
  1435.    
  1436.     @media all and (max-width: 1265px)  {
  1437.      /* Debug to identify which page we found.  Place our ukiyo-e. */      
  1438.   /*    h1, h2, h3, #apple-site-title > a:nth-child(1) {    
  1439.            
  1440.           border: 2px dashed black !important;    
  1441.          }  */
  1442.        
  1443.     /* ------------------      
  1444.        Treatment for narrow window      
  1445.        Method 1 (minimum optimisation)      
  1446.      
  1447.        Places
  1448.        
  1449.        https://discussions.apple.com/places
  1450.        
  1451.        Adjust community list table's shift and margin to maximize its width.      
  1452.     */                                                                            
  1453.     /* ------------------ (currently commented out)      
  1454.     .j-layout-sl.j-browse-places .j-column-wrap-l { margin-left: -166px !important; }      
  1455.     .j-layout-sl.j-browse-places .j-column-l      { margin-left: 166px !important; }      
  1456.     .j-layout-sl.j-browse-places .j-column-s      { width: 166px !important; }      
  1457.     ------------------ */      
  1458.     /* ------------------      
  1459.         Treatment for narrow window      
  1460.         Method 2 (more beneficial to narrow window but has disadvantage for wide window)      
  1461.          
  1462.         Let community list table have full width but not exceed 1019px to make room for      
  1463.         sidebar ui (filters & actions).  If window is wide enough (>=1265px), sidebar ui      
  1464.         is displayed next to community list table, otherwise it is displayed below or
  1465.         above it (depending upon its document tree order).      
  1466.          
  1467.         * sidebar width (constant)    = 166px      
  1468.         * community table max width   = 1019px      
  1469.         * canvas margin-left          = 40px      
  1470.         * canvas margin-right         = 40px      
  1471.         ---------------------------------------      
  1472.         * total                       = 1265px      
  1473.     */                                                                              
  1474.     /* ------------------ (currently active) */      
  1475.     .j-layout-sl.j-browse-places .j-column-wrap-l { max-width: 1019px !important; }      
  1476.     .j-layout-sl.j-browse-places .j-column-wrap-l { margin-left: 0px !important; }      
  1477.     .j-layout-sl.j-browse-places .j-column-l      { margin-left: 0px !important; }      
  1478.     .j-layout-sl.j-browse-places .j-column-l      { padding-left: 0px !important; }      
  1479.     .j-layout-sl.j-browse-places .j-column-s      { width: 166px !important; }          
  1480.     /* ------------------ */      
  1481.        
  1482.     /* See if we can position "start ad discussion, Write a user tip" bottom  
  1483.        bar a little better */    
  1484.     .j-box {    
  1485.         margin-top: 40px !important;    
  1486.         float: right !important;}    
  1487.        
  1488.    
  1489.     /* Turn verical nav list into a horizontal nav list to save vertical space.    
  1490.         This nav bar appear above the list of dicussions in the Your Content page.    
  1491.         It appears below in the list of discussions page.    
  1492.         A larger screen has room for vertical navigation, so let along. */    
  1493.  
  1494.     /* We need to make room for the horizontal nav bar.  A floating right, the area to the left    
  1495.        is blank anyway. */    
  1496.     .j-layout-sl.j-browse-content .j-column-s        
  1497.         { width: 95% !important; }  /* let more room for horizontal navigation 0.64 */    
  1498.      
  1499.      
  1500.     /* make nav bar horizontal amoung other things. */    
  1501.     div .j-column.j-column-s nav ul li {  
  1502.       float: left !important;    /* makes the list items horizontal */    
  1503.       width: 120px !important;  /* width of each link */  
  1504.                                  /*  height: 30px !important;*/
  1505.                                  /* vertical-align: middle !important; */
  1506.        
  1507.       text-align: center !important;    
  1508.       margin-left: 0 !important;    
  1509.       padding-left: 0 !important;    
  1510.     }  
  1511.  
  1512.     li.j-browse-filter-group-item.js-browse-filter-group-item a.js-select-link {height: 30px !important;}
  1513.        
  1514.     /* let a little space to the left of the navigation bar. */      
  1515.         div .j-column.j-column-s nav  {  
  1516.     margin-left: 0px !important;      
  1517.         margin-top: 20px !important;  /* max of margin-bottom of proceeding line and margin-top */    
  1518.     }  
  1519.      
  1520.    /* after making the navigating link horizontal, the blue overlay box doesn't immediately  
  1521.       jump to the draft box.  After clicking on any of the other links, the blue box    
  1522.       parks on the draft box and will not move.  The function must be implemented in javascript which  
  1523.       cannot be changed from css. In the May 2016 ASC, the blue box moves correct when the sidebar is moved to the right.
  1524.       Still broken for horizontal. Purge it.    
  1525.       Upper nav bar on your content */    
  1526.       /* https://discussions.apple.com/people/<apple-id>/content */    
  1527.     body.jive-view-profile.j-view-profile.j-view-profile-nonself.other .j-second-nav > ul:nth-child(1) > li:last-child,    
  1528.        body.j-body-yourwork.other li.active:last-child {display: none !important;}    
  1529.        
  1530.    /* Found another blue overlay box.    
  1531.       https://discussions.apple.com/people/<ASC_id>/content?manage=true */    
  1532.     body.jive-view-profile.j-view-profile.j-view-profile-self.other li.active:last-child {display: none !important;}    
  1533.      
  1534.     /* style the link (a tag) inside the li    
  1535.        Put a box around the links.  Complete box makes for a dark middle Line. So, leave  
  1536.        off right line but for righ most link. Do the best we can    
  1537.        ASC box grey-line color #d7d7d7 also seems like grey #eaeaea */    
  1538.     div .j-column.j-column-s nav li a {  
  1539.        border: 1px solid #d7d7d7 !important;    
  1540.        border-left: none !important;  /* avoid double border lines for middle items */    
  1541.        padding-left: 0 !important;    
  1542.     }  
  1543.    
  1544.     /* Fill in the first box with a line on the left */    
  1545.     /* Upper nav bar on your content  
  1546.        https://discussions.apple.com/content?filterID=following~objecttype~objecttype[thread] */    
  1547.     body.j-body-yourwork.other li.j-browse-filter-group-item:first-child > a,  
  1548.     /* https://discussions.apple.com/people/<apple-id>/content?manage=true */    
  1549.     body.jive-view-profile.j-view-profile.j-view-profile-self other li.active:first-child > a,  
  1550.     /* https://discussions.apple.com/people/<apple-id>/content */    
  1551.     div .j-column.j-column-s nav.j-second-nav ul > li:first-child > a,  
  1552.     /* lower nav bar, see here:    
  1553.        https://discussions.apple.com/community/ipad/ipad_in_business_and_education  
  1554.             /content?filterID=contentstatus[published]~objecttype~objecttype[thread] */    
  1555.     body.j-body-place.other    li.j-browse-filter-group-item:first-child {    
  1556.        border-left: 1px solid #d7d7d7 !important;  /* avoid double border lines for middle items */    
  1557.     }  
  1558.        
  1559.    /* Hover over  */
  1560.         /* text */
  1561.    div.j-browse-sorts.j-browse-filter-row span.j-browse-search input:hover,
  1562.         /* horizontal nav bar */
  1563.    div .j-column.j-column-s nav li a:hover,
  1564.         /* sort by ... */
  1565.    #js-browse-controls #j-browse-filters #j-sort:hover {  
  1566.      border-color: #42aaff !important;  /* light blue */    
  1567.      }  
  1568.  
  1569.    /* "Type to filter by text" on list of discussions in a community. */
  1570.     div.j-browse-sorts.j-browse-filter-row span.j-browse-search input {
  1571.          padding: 5px 6px 5px 8px !important;
  1572.          font-size: 14px !important;
  1573.          width: 160px !important;      /* Was 220px */
  1574.          text-align: center !important;
  1575.          border-color: #9b9b9b !important;
  1576.          background-color: #f2f2f2 !important;
  1577.        }
  1578.        
  1579.        /* Sort by ... */
  1580.        #js-browse-controls #j-browse-filters #j-sort {
  1581.            border-color: #9b9b9b !important; /* grey, Apple's color */
  1582.            padding: 6px 6px 8px 28px !important;
  1583.            font-size: 14px !important;
  1584.            background-color: #f2f2f2 !important;
  1585.            text-align: left !important;
  1586.            height:  30px !important;
  1587.            padding: 2px !important;
  1588.            width: 260px !important;
  1589.         }
  1590.    
  1591.      
  1592.        
  1593.   } /* media */
  1594. } /* @-moz-document url-prefix for sidebar */
  1595.  
  1596. /* ==============================================
  1597.    Leave the login window footer alone. So, turn these fields back on.    
  1598.     */      
  1599. @-moz-document    
  1600.     url-prefix(https://discussions.apple.com/people/),      
  1601.     url-prefix(https://discussions.apple.com/welcome),      
  1602.     url-prefix(https://discussionsjapan.apple.com/people/),        
  1603.     url-prefix(https://discussionsjapan.apple.com/welcome/),      
  1604.     url-prefix(https://discussionskorea.apple.com/people/),      
  1605.     url-prefix(https://discussionskorea.apple.com/welcome/),
  1606.     url-prefix(https://communities.apple.com/es/people),  
  1607.     url-prefix(https://communities.apple.com/es/welcome),      
  1608.     url-prefix(https://communities.apple.com/pt/people),
  1609.     url-prefix(https://communities.apple.com/pt/welcome)  {        
  1610.    
  1611.         /* legalistic bomblast on login window*/      
  1612.         #globaldisclaimer.sosumi {display: inherit !important; }            
  1613.         /* path to here */      
  1614.         #j-footer #breadcrumbs {display: inherit !important; }      
  1615.         /* apple product info */      
  1616.         p.gf-buy {display: inherit !important; }          
  1617. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement