Advertisement
rccharles

wzzz post #4

Mar 13th, 2017
536
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 48.41 KB | None | 0 0
  1.  
  2.   /*
  3.  
  4.       custom styles for Apple Support Communities board system introduced in 2016-06 (v0.11)
  5.  
  6.      
  7.  
  8.       v0.11
  9.  
  10.           - introduced @media rules in THREAD LIST BROWSER and PLACES sections:
  11.  
  12.               @media all and ( max-width: X ) rule
  13.  
  14.               @media all and ( min-width: Y ) rule
  15.  
  16.          
  17.  
  18.           - added, refined and fixed rules in various sections, which include but not limited to
  19.  
  20.               BODY
  21.  
  22.                   - changed #body-apple {width: 100%} to {width: auto}, which is essential to
  23.  
  24.                     prevent horizontal scroller from appearing in narrow window environment.
  25.  
  26.               TEXT > font
  27.  
  28.                   - added rules to use fine local font in lieu of illegible remote font
  29.  
  30.               ASC TOP PAGE
  31.  
  32.                   - added rules on 'search or ask a question', 'featured topics' etc
  33.  
  34.               COMMUNITIES CATEGORIES OVERVIEW
  35.  
  36.                   - new section
  37.  
  38.               THREAD LIST BROWSER > community overview
  39.  
  40.                   - added and refined rules (treating filter ui layout)
  41.  
  42.               PROFILE > content
  43.  
  44.                   - new subsection (treating browser control ui layout)
  45.  
  46.               BLOG
  47.  
  48.                   - new section
  49.  
  50.               UNAUTHORIZED
  51.  
  52.                   - new section
  53.  
  54.  
  55.  
  56.       v0.10d
  57.  
  58.           - draft
  59.  
  60.  
  61.  
  62.       written by Hiroto, 2016-06
  63.  
  64.   */
  65.  
  66.   @-moz-document
  67.  
  68.       domain(communities.apple.com),
  69.  
  70.       domain(discussions.apple.com),
  71.  
  72.       domain(discussionsjapan.apple.com),
  73.  
  74.       domain(discussionskorea.apple.com),
  75.  
  76.       domain(discussionschinese.apple.com)
  77.  
  78.   {
  79.  
  80.  
  81.  
  82.       .all-replies-container {display: inherit !important;}                       /* Display all answers */
  83.  
  84.       .more-answers {display: none !important;}                                   /* Hide the more to the conversation block */
  85.  
  86.    
  87.  
  88.       /* ------------------------------------------------------------------------------- -----------------
  89.  
  90.           BODY
  91.  
  92.       */
  93.  
  94.       body.j-body-welome,             /* Welcome */
  95.  
  96.       body.j-body-place,              /* Community */
  97.  
  98.       body.j-body-yourwork,           /* Content */
  99.  
  100.       body.j-body-home,               /* Activity */
  101.  
  102.       body.j-body-yourconnections,    /* People */
  103.  
  104.       body.j-body-preferences,        /* Preferences */
  105.  
  106.       body.jive-body-content,         /* Thread */
  107.  
  108.       body.jive-body-search,          /* Search */
  109.  
  110.       body.jive-view-profile          /* Profile */
  111.  
  112.       {                                                                              
  113.  
  114.           background: white !important;
  115.  
  116.       }
  117.  
  118.       body {
  119.  
  120.           background: white;
  121.  
  122.           min-width: 0px !important;
  123.  
  124.       }
  125.  
  126.       #body-apple {
  127.  
  128.           width: auto !important;
  129.  
  130.           max-width: 1100px !important;
  131.  
  132.           min-width: 0px !important;
  133.  
  134.       }
  135.  
  136.       #globalheader { display: none !important; }                                    
  137.  
  138.       #global-nav-wrapper {display: none !important; }                              
  139.  
  140.       #globalfooter,
  141.  
  142.       #globaldisclaimer { width: 80% !important; }                                  
  143.  
  144.  
  145.  
  146.  
  147.  
  148.       /* ------------------------------------------------------------------------------- -----------------
  149.  
  150.           TEXT
  151.  
  152.       */                                                                                       /* NEW */
  153.  
  154.       body {
  155.  
  156.           font-size: 16px !important;
  157.  
  158.           font-weight: 400 !important;
  159.  
  160.           line-height: 1.25 !important;
  161.  
  162.       }
  163.  
  164.       body * {
  165.  
  166.           /* font-size: inherit !important; */
  167.  
  168.           font-weight: inherit !important;
  169.  
  170.           line-height: inherit !important;
  171.  
  172.       }
  173.  
  174.  
  175.  
  176.       /* font
  177.  
  178.           - let it use well-established fine local fonts
  179.  
  180.             in lieu of slow, small, condensed and illegible remote fonts
  181.  
  182.             by removing the following from the font-family per language:
  183.  
  184.            
  185.  
  186.             lang | remote font name
  187.  
  188.             -----|-----------------
  189.  
  190.               ja | "Apple TP"
  191.  
  192.               ko | "Yoon Gothic"
  193.  
  194.               zh | "PingHei"
  195.  
  196.               en | "Myriad Set Pro"
  197.  
  198.               es | "Myriad Set Pro"
  199.  
  200.               pt | "Myriad Set Pro"
  201.  
  202.       */                                                                                       /* NEW (experimental) */
  203.  
  204.   /*
  205.  
  206.       * { font-family: "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif !important; }
  207.  
  208.   */
  209.  
  210.       [lang|="ja"] * {
  211.  
  212.           font-family: "Hiragino Kaku Gothic Pro", "Meiryo",
  213.  
  214.                        "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
  215.  
  216.       }
  217.  
  218.       [lang|="ko"] * {
  219.  
  220.           font-family: "Apple Gothic", "HY Gulim", "MalgumGothic", "HY Dotum", "Lexi Gulim",
  221.  
  222.                        "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
  223.  
  224.       }
  225.  
  226.       [lang|="zh"] * {
  227.  
  228.           font-family: "STHeitiSC-Light",
  229.  
  230.                        "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
  231.  
  232.       }
  233.  
  234.       [lang|="en"] *,
  235.  
  236.       [lang|="es"] *,
  237.  
  238.       [lang|="pt"] * {
  239.  
  240.           font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
  241.  
  242.       }
  243.  
  244.      
  245.  
  246.       /* preseve monospace for pre.jive-pre */
  247.  
  248.       pre.jive-pre { font-family: monospace !important; }
  249.  
  250.  
  251.  
  252.      
  253.  
  254.       /* ------------------------------------------------------------------------------- -----------------
  255.  
  256.           ASC HEADER, FOOTER AREA
  257.  
  258.       */
  259.  
  260.       #j-header,
  261.  
  262.       #j-compact-header,
  263.  
  264.       #j-footer { width: 100% !important; }
  265.  
  266.      
  267.  
  268.       /* navigation header (Apple Support Communities ...) */
  269.  
  270.       #j-header-wrap {
  271.  
  272.           padding: 0px 40px !important;
  273.  
  274.           margin: 0px 0px 15px !important;
  275.  
  276.       }
  277.  
  278.       #j-globalNav-bg {
  279.  
  280.           padding: 0pX !important;
  281.  
  282.           margin: 0px !important;
  283.  
  284.           width: auto !important;                                                             /* NEW */
  285.  
  286.       }
  287.  
  288.       #j-satNav { overflow: visible !important; }
  289.  
  290.  
  291.  
  292.       #j-header-wrap { margin-bottom: 50px !important; }                                      /* NEW */
  293.  
  294.       #apple-full-header { margin: 10px 0px 0px !important; }                                 /* NEW */
  295.  
  296.       #second-row {                                                                           /* NEW */
  297.  
  298.           padding-top: 25px !important;
  299.  
  300.           height: 30px !important;
  301.  
  302.       }
  303.  
  304.  
  305.  
  306.       /* announcement */                                                                      /* NEW */
  307.  
  308.       #jive-alert {
  309.  
  310.           width: auto !important;
  311.  
  312.           max-width: inherit !important;
  313.  
  314.           margin: -20px 40px 10px !important;
  315.  
  316.       }
  317.  
  318.       .j-thread #jive-alert {
  319.  
  320.           margin: -50px 40px 10px !important;
  321.  
  322.       }
  323.  
  324.       .jive-body-formpage.j-thread #jive-alert {
  325.  
  326.           margin: -30px 40px 10px !important;
  327.  
  328.       }
  329.  
  330.      
  331.  
  332.       /* breadcrumb */                                                                        /* NEW */
  333.  
  334.       #jive-breadcrumb {
  335.  
  336.           width: auto !important;
  337.  
  338.           margin-right: 40px !important;
  339.  
  340.           position: relative !important;
  341.  
  342.       }
  343.  
  344.      
  345.  
  346.       /* footter */                                                                           /* NEW */
  347.  
  348.       .j-js-footer-wrap {
  349.  
  350.           width: auto !important;
  351.  
  352.           min-width: 0px !important;
  353.  
  354.       }
  355.  
  356.       footer#j-footer {
  357.  
  358.           width: auto !important;
  359.  
  360.           min-width: 0px !important;
  361.  
  362.       }
  363.  
  364.  
  365.  
  366.  
  367.  
  368.       /* ------------------------------------------------------------------------------- -----------------
  369.  
  370.           ASC TOP PAGE
  371.  
  372.       */
  373.  
  374.       .j-body-welcome #jive-alert { margin: 0px 40px !important; }
  375.  
  376.       .j-body-welcome .hero-container img { width: auto !important; }
  377.  
  378.       .j-body-welcome.j-body-home [id|=jive-widgetframe] > .content-large {
  379.  
  380.           text-align: center !important;
  381.  
  382.           overflow-x: auto !important;
  383.  
  384.           overflow-y: hidden !important;
  385.  
  386.       }
  387.  
  388.       .apple-communities {
  389.  
  390.           display: inline-block !important;
  391.  
  392.           width: auto !important;
  393.  
  394.           text-align: left !important;
  395.  
  396.       }
  397.  
  398.  
  399.  
  400.       /* search or ask a question */
  401.  
  402.       .ask-a-question-container .j-form input[type="text"] { width: 90% !important; }
  403.  
  404.  
  405.  
  406.       /* featured topics */
  407.  
  408.       .jive-widget-featuredcontentwidget h2 {
  409.  
  410.           font-size: 28px !important;
  411.  
  412.       }
  413.  
  414.       .jive-widget-featuredcontentwidget .content-large .featured-content-header {
  415.  
  416.           padding-bottom: 30px !important;
  417.  
  418.       }
  419.  
  420.       .jive-widget-featuredcontentwidget .content-large .featured-content-header p.sub-title {
  421.  
  422.           margin: 10px 0px 20px !important;
  423.  
  424.       }
  425.  
  426.       .jive-widget-featuredcontentwidget .featured-list-container {
  427.  
  428.           max-width: 1000px !important;
  429.  
  430.       }
  431.  
  432.       .jive-widget-featuredcontentwidget .featured-list-container .featured-list-row {
  433.  
  434.           margin-bottom: 20px !important;
  435.  
  436.           border-style: dotted !important;
  437.  
  438.           border-width: thin !important;
  439.  
  440.       }
  441.  
  442.       .jive-widget-featuredcontentwidget .featured-list-container .featured-list-user {
  443.  
  444.           margin: 0px 10px !important;
  445.  
  446.       }
  447.  
  448.       .jive-widget-featuredcontentwidget .featured-list-container .featured-list-desc {
  449.  
  450.           margin: 0px 10px !important;
  451.  
  452.       }
  453.  
  454.       .jive-widget-featuredcontentwidget h4.title {
  455.  
  456.           font-size: 18px !important;
  457.  
  458.           margin: 10px 0px !important;
  459.  
  460.           text-decoration: underline !important;
  461.  
  462.       }
  463.  
  464.       .jive-widget-featuredcontentwidget .rating-row,
  465.  
  466.       .jive-widget-featuredcontentwidget .featured-list-container .featured-list-desc blockquote,
  467.  
  468.       .jive-widget-featuredcontentwidget .featured-list-container .featured-list-desc .user-metadata {
  469.  
  470.           margin-bottom: 10px !important;
  471.  
  472.       }
  473.  
  474.      
  475.  
  476.       /* new to communities? */
  477.  
  478.       .on-boarding .on-boarding-header h2 {
  479.  
  480.           font-size: 28px !important;
  481.  
  482.           margin: 0px 0px 25px !important;
  483.  
  484.       }
  485.  
  486.       .on-boarding .img-container { margin: 0px auto 30px !important; }
  487.  
  488.      
  489.  
  490.       /* how-to grid */
  491.  
  492.       .on-boarding > .grid-display {
  493.  
  494.           margin-top: 40px !important;
  495.  
  496.           padding: 20px 0px !important;
  497.  
  498.           max-width: 1000px !important;
  499.  
  500.           display: inline-block !important;
  501.  
  502.       }
  503.  
  504.       .on-boarding .row .column h3 {
  505.  
  506.           margin: 0px 30px 20px !important;
  507.  
  508.           max-height: 50% !important;
  509.  
  510.       }  
  511.  
  512.  
  513.  
  514.  
  515.  
  516.       /* ------------------------------------------------------------------------------- -----------------
  517.  
  518.           COMMUNITIES CATEGORIES OVERVIEW
  519.  
  520.       */                                                                                       /* NEW */
  521.  
  522.       /* communities description */
  523.  
  524.       .apple-space-overview .jive-widget-subcommunitieswidget .community-image {
  525.  
  526.           width: 200px !important;
  527.  
  528.           position: absolute !important;
  529.  
  530.           z-index: -1 !important;
  531.  
  532.       }
  533.  
  534.       .apple-space-overview .jive-widget-subcommunitieswidget .community-image img {
  535.  
  536.           width: 200px !important;
  537.  
  538.           height: 200px !important;
  539.  
  540.       }
  541.  
  542.       .apple-space-overview .jive-widget-subcommunitieswidget .community-description {
  543.  
  544.           margin-bottom: 45px !important;
  545.  
  546.       }
  547.  
  548.       .apple-space-overview .jive-widget-subcommunitieswidget .community-description h1 {
  549.  
  550.           font-size: 28px !important;
  551.  
  552.           margin: 30px 0px !important;
  553.  
  554.       }  
  555.  
  556.      
  557.  
  558.       /* top communities */
  559.  
  560.       .apple-space-overview  h2.community-title {
  561.  
  562.           font-size: 24px !important;
  563.  
  564.           margin: 0px 0px 20px !important;
  565.  
  566.       }
  567.  
  568.       .apple-space-overview .category-latest-header h3 {
  569.  
  570.           font-size: 22px !important;
  571.  
  572.           margin: 0px 0px 20px !important;
  573.  
  574.       }
  575.  
  576.       .apple-space-overview .category-latest h3,
  577.  
  578.       .apple-space-overview .category-latest h4 { font-size: 20px !important; }
  579.  
  580.       .apple-space-overview .jive-widget-subcommunitieswidget .content-large       { padding: 10px !important; }
  581.  
  582.       .apple-space-overview .jive-widget-subcommunitieswidget .content-large > nav { padding-top: 0px !important; }
  583.  
  584.       .apple-space-overview .jive-widget-recentcontentfilterwidget {
  585.  
  586.           padding-bottom: 10px !important;
  587.  
  588.           margin-bottom: 0px !important;
  589.  
  590.       }
  591.  
  592.      
  593.  
  594.       /* search for more topics */
  595.  
  596.       .apple-space-overview .category-page .ask-a-question-header {
  597.  
  598.           margin-top: 20px !important;
  599.  
  600.           width: auto !important;
  601.  
  602.       }
  603.  
  604.       .apple-space-overview .category-page .ask-a-question-header h2 { font-size: 24px !important; }
  605.  
  606.       .apple-space-overview .category-page .ask-a-question-container {
  607.  
  608.           width: 80% !important;
  609.  
  610.           max-width: 1000px !important;
  611.  
  612.           margin: 30px auto !important;
  613.  
  614.       }
  615.  
  616.       .apple-space-overview .category-page .ask-a-question-container .j-form input[type="text"] {
  617.  
  618.           padding: 10px 10px 10px 50px !important;
  619.  
  620.           width: 94% !important;
  621.  
  622.       }
  623.  
  624.       .apple-space-overview .category-page .ask-a-question-footer { margin: 40px 0px !important; }
  625.  
  626.      
  627.  
  628.       /* contact apple support */
  629.  
  630.       .apple-space-overview .section-eyebrow { font-size: 24px !important; }
  631.  
  632.       .apple-space-overview .section-header {
  633.  
  634.           font-size: 22px !important;
  635.  
  636.           margin: 0px 0px 30px !important;
  637.  
  638.       }
  639.  
  640.          
  641.  
  642.      
  643.  
  644.       /* ------------------------------------------------------------------------------- -----------------
  645.  
  646.           THREAD LIST BROWSER
  647.  
  648.       */
  649.  
  650.  
  651.  
  652.       /* ------------------
  653.  
  654.           community overview
  655.  
  656.       */                                                                                       /* NEW */
  657.  
  658.       .category-latest .category-latest-container .category-latest-row {
  659.  
  660.           margin: 0px !important;
  661.  
  662.           padding: 5px 0px !important;
  663.  
  664.       }
  665.  
  666.       .category-latest .category-latest-container .category-latest-row .discussion-metadata {
  667.  
  668.           margin: 5px 0px !important;
  669.  
  670.       }
  671.  
  672.       .category-latest .category-latest-container .category-latest-row .discussion-title a {
  673.  
  674.           font-size: 100% !important;
  675.  
  676.           font-weight: 500 !important;
  677.  
  678.           color: rgb(0, 136, 204) !important;
  679.  
  680.       }
  681.  
  682.       .category-latest .category-latest-container .category-latest-row:nth-child(odd) {
  683.  
  684.           background: rgb(247, 247, 247) !important;
  685.  
  686.       }
  687.  
  688.       .category-latest .category-latest-container .category-latest-row .read-full {
  689.  
  690.           display: none !important;
  691.  
  692.       }
  693.  
  694.       .category-latest .category-latest-container .category-latest-row .discussion-metadata .cell {
  695.  
  696.           margin-right: 15px !important;
  697.  
  698.       }
  699.  
  700.       .category-latest .category-latest-container .category-latest-row .discussion-metadata .cell a {
  701.  
  702.           color: rgb(0, 136, 204) !important;
  703.  
  704.           text-decoration: none !important;
  705.  
  706.       }
  707.  
  708.      
  709.  
  710.       .apple-space-overview #body-apple .list-page .ask-a-question-sidebar {
  711.  
  712.           margin: 0px 70px 10px 0px !important;
  713.  
  714.       }
  715.  
  716.       .apple-space-overview #body-apple .list-page .ask-a-question-sidebar .ask-a-question-space-icon {
  717.  
  718.           width: 128px !important;
  719.  
  720.           height: 128px !important;
  721.  
  722.       }
  723.  
  724.       .apple-space-overview #body-apple .list-page .ask-a-question-wrapper .community-siblings {
  725.  
  726.           padding: 5px 0px !important;
  727.  
  728.           font-size: 20px !important;
  729.  
  730.       }
  731.  
  732.  
  733.  
  734.       /* content filter (by type (solved|recommended|unanswered) & category) */
  735.  
  736.       .jive-content-filter {
  737.  
  738.           width: 20% !important;
  739.  
  740.           max-width: 250px !important;
  741.  
  742.           min-width: 100px !important;
  743.  
  744.           padding: 0px 10px 0px 0px !important;
  745.  
  746.       }
  747.  
  748.       .jive-content-filter h2 {
  749.  
  750.           margin-bottom: 15px !important;
  751.  
  752.           font-weight: 500 !important;
  753.  
  754.       }
  755.  
  756.       .jive-content-filter ul li { margin: 3px 0px !important; }
  757.  
  758.       .jive-content-filter ul li:nth-child(odd) { background: rgb(247, 247, 247) !important; }
  759.  
  760.       .jive-content-filter ul li a.jive-content-filter-highlight { background: rgb(230, 240, 230) !important; }
  761.  
  762.       /* ------------------ */
  763.  
  764.      
  765.  
  766.  
  767.  
  768.       /* show author name in 'Latest activity' column in detailed list view of threads */
  769.  
  770.       td.j-td-date > span { display : inherit !important; }
  771.  
  772.  
  773.  
  774.       /* main section */
  775.  
  776.       #j-main { padding: 0px !important; }
  777.  
  778.  
  779.  
  780.       /* table cell title */
  781.  
  782.       .jive-table td.jive-table-cell-title { padding: 5px !important; }
  783.  
  784.          
  785.  
  786.       /* thread list view column widths */                                          
  787.  
  788.       .j-browse-details .j-td-title { max-width: none !important; }
  789.  
  790.       .j-browse-details .j-td-date {
  791.  
  792.           width: auto !important;
  793.  
  794.           max-width: 20% !important;
  795.  
  796.       }
  797.  
  798.      
  799.  
  800.       /* thread list view: read thread font weight */                                         /* NEW (feature restored) */
  801.  
  802.       .j-browse-details .j-td-title strong { font-weight: 400 !important; }
  803.  
  804.       /* highlights in dark blue unread posts when logged in. */
  805.  
  806.       .j-td-title strong {color:#191970 !important; font-weight: normal !important;}
  807.  
  808.      
  809.  
  810.  
  811.  
  812.       @media all and ( max-width: 1099px )
  813.  
  814.       {
  815.  
  816.           /* ------------------
  817.  
  818.               Treatment for narrow window
  819.  
  820.               Hide Like and Bookmark columns in thread list view if viewport width <= 1098 (= 1265 - 166)
  821.  
  822.           */                                                                            
  823.  
  824.           .j-browse-details .j-td-likes,
  825.  
  826.           .j-browse-details .j-td-bookmarks { display: none !important; }
  827.  
  828.           .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th,
  829.  
  830.           .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th + th { display: none !important; }
  831.  
  832.           .j-browse-details > table.j-browse-list > thead.j-rc4 > tr > th + th + th + th { display: table-cell !important; }
  833.  
  834.       }
  835.  
  836.  
  837.  
  838.      
  839.  
  840.       /* user name link */
  841.  
  842.       .jive-username-link { text-transform: none !important; }                      
  843.  
  844.  
  845.  
  846.       /* threads list view table tr td  */                                                    /* CHANGED */
  847.  
  848.       .j-browse-details-tbody tr td { padding: 2px !important; }
  849.  
  850.  
  851.  
  852.       /* threads list view left most icon */                                                  /* NEW */
  853.  
  854.       .j-browse-details-tbody .j-td-icon { padding: 0px 6px 0px !important; }
  855.  
  856.      
  857.  
  858.       /* communities list view table tr td */
  859.  
  860.       .jive-communities-listing table tr td { padding: 5px !important; }
  861.  
  862.      
  863.  
  864.       /* thumbnails view width */
  865.  
  866.       .j-browse-content .j-thumb-view,
  867.  
  868.       .j-browse-places .j-browse-thumbnails,
  869.  
  870.       .j-browse-people .j-browse-thumbnails { width: 100% !important; }
  871.  
  872.      
  873.  
  874.       /* thumbnail view list item margin */                                          
  875.  
  876.       .j-browse-content .j-thumb-view > li,
  877.  
  878.       .j-browse-places .j-browse-thumbnails > li { margin-right: 20px !important; }
  879.  
  880.      
  881.  
  882.       /* thumbnail view article font size */                                                  /* NEW */
  883.  
  884.       .j-thumb article { font-size: inherit !important; }
  885.  
  886.      
  887.  
  888.       /* thunbnail view article header height */                                              /* NEW */
  889.  
  890.       .j-content-thumb header { height: 22px !important; }
  891.  
  892.  
  893.  
  894.       /* thumbnail view article header font size */                                           /* NEW */
  895.  
  896.       .j-thumb header h4.shrunk { font-size: 80% !important; }
  897.  
  898.       .j-browse-content .j-content-thumb header .icon {
  899.  
  900.           font-size: 16px !important;
  901.  
  902.           margin: 0px 8px 0px 0px !important;
  903.  
  904.       }
  905.  
  906.      
  907.  
  908.       /* thumbnail view article height */                                                     /* NEW */
  909.  
  910.       .j-browse-content .j-content-thumb article { height: 120px !important; }
  911.  
  912.      
  913.  
  914.       /* thumbnail view footer */                                                             /* NEW */
  915.  
  916.       .j-browse-content .j-content-thumb.j-thumb footer { padding: 4px 0px 0px !important; }
  917.  
  918.  
  919.  
  920.      
  921.  
  922.       /* social actions row */
  923.  
  924.       .apple-social-actions-wrapper { margin-right: 0px !important; }
  925.  
  926.       .j-thread .j-social-actions { margin-right: 40px !important; }
  927.  
  928.  
  929.  
  930.       /* apple header, subheader row ("Find helpful contents..." etc )*/            
  931.  
  932.       #apple-full-subheader,
  933.  
  934.       #apple-activity-subheader {
  935.  
  936.           padding: 0px 40px 15px !important;
  937.  
  938.           margin-bottom: 15px !important;
  939.  
  940.       }
  941.  
  942.       #apple-full-header h2,
  943.  
  944.       #apple-activity-header h2 { padding: 0px 40px !important; }
  945.  
  946.  
  947.  
  948.       /* page header */
  949.  
  950.       .j-body-place #jive-body > header.j-page-header {
  951.  
  952.           margin-left: 40px !important;
  953.  
  954.           margin-right: 40px !important;
  955.  
  956.           width: auto !important;
  957.  
  958.       }
  959.  
  960.      
  961.  
  962.       /* pagenation */                                                                        /* NEW */
  963.  
  964.       .j-pagination-prevnext > .j-pagination-prev,
  965.  
  966.       .j-pagination-prevnext > .j-pagination-next { font-size: 0px !important; }
  967.  
  968.      
  969.  
  970.      
  971.  
  972.       /* browser filter row */
  973.  
  974.       #j-browse-filters { margin-bottom: 5px !important; }
  975.  
  976.  
  977.  
  978.       /* browser controls row */
  979.  
  980.       .j-type-row { margin-bottom: 0px !important; }
  981.  
  982.  
  983.  
  984.       /* browser controls content types (All Contents|User Tips|Discussions) width */
  985.  
  986.       #js-browse-controls .j-type-row .j-content-types { width: 90% !important; }
  987.  
  988.      
  989.  
  990.       /* browser controls view toggle (Thumbnails|Details) width */
  991.  
  992.       #js-browse-controls #j-item-view-toggle {
  993.  
  994.           width: 10% !important;
  995.  
  996.           display: table !important;
  997.  
  998.       }
  999.  
  1000.  
  1001.  
  1002.       /* content filter row (All|Open|Answered|Threads) */
  1003.  
  1004.       .j-content-filter {
  1005.  
  1006.           background: white !important;
  1007.  
  1008.           margin-bottom: 10px !important;
  1009.  
  1010.       }  
  1011.  
  1012.      
  1013.  
  1014.       /* container canvas */
  1015.  
  1016.       .j-contained {
  1017.  
  1018.           margin-left: 40px !important;
  1019.  
  1020.           margin-right: 40px !important;
  1021.  
  1022.       }
  1023.  
  1024.  
  1025.  
  1026.       /* more search results available */
  1027.  
  1028.       #j-more-search-results-available { padding: 10px !important; }
  1029.  
  1030.      
  1031.  
  1032.       /* misc */
  1033.  
  1034.       .jive-widget { margin-bottom: 10px !important; }
  1035.  
  1036.       .j-column { margin-bottom: 10px !important; }
  1037.  
  1038.  
  1039.  
  1040.  
  1041.  
  1042.       @media all and ( min-width: 1265px )
  1043.  
  1044.       {
  1045.  
  1046.           /* ------------------
  1047.  
  1048.               Treatment for narrow window
  1049.  
  1050.               Method 1 (minimum optimisation)
  1051.  
  1052.      
  1053.  
  1054.               Adjust thread list table's shift and margin to maximize its width.
  1055.  
  1056.           */                                                                            
  1057.  
  1058.           .j-layout-sl.j-browse-content .j-column-wrap-l { margin-left: -166px !important; }
  1059.  
  1060.           .j-layout-sl.j-browse-content .j-column-l      { margin-left: 166px !important; }
  1061.  
  1062.           .j-layout-sl.j-browse-content .j-column-s      { width: 166px !important; }
  1063.  
  1064.       }
  1065.  
  1066.       @media all and ( max-width: 1265px )
  1067.  
  1068.       {
  1069.  
  1070.           /* ------------------
  1071.  
  1072.               Treatment for narrow window
  1073.  
  1074.               Method 2 (more beneficial to narrow window but has disadvantage for wide window)
  1075.  
  1076.              
  1077.  
  1078.               Let thread list table have full width but not exceed 1019px to make room for sidebar ui (filters & actions).
  1079.  
  1080.               If window is wide enough (>=1265px), sidebar ui is displayed next to thread list table,
  1081.  
  1082.               otherwise it is displayed below or above it (depending upon its document tree order).
  1083.  
  1084.              
  1085.  
  1086.               * sidebar width (constant)    = 166px
  1087.  
  1088.               * thread table max width      = 1019px
  1089.  
  1090.               * canvas margin-left          = 40px
  1091.  
  1092.               * canvas margin-right         = 40px
  1093.  
  1094.               ---------------------------------------
  1095.  
  1096.               * total                       = 1265px
  1097.  
  1098.           */                                                                            
  1099.  
  1100.           .j-layout-sl.j-browse-content .j-column-wrap-l { max-width: 1019px !important; }
  1101.  
  1102.           .j-layout-sl.j-browse-content .j-column-wrap-l { margin-left: 0px !important; }
  1103.  
  1104.           .j-layout-sl.j-browse-content .j-column-l      { margin-left: 0px !important; }
  1105.  
  1106.           .j-layout-sl.j-browse-content .j-column-s      { width: 166px !important; }
  1107.  
  1108.       }
  1109.  
  1110.  
  1111.  
  1112.  
  1113.  
  1114.       /* ------------------
  1115.  
  1116.           Swap left-right positions of thread list table and sidebar ui (filters & actions)
  1117.  
  1118.       */                                                                            
  1119.  
  1120.       /* let thread list table float left */
  1121.  
  1122.       .j-layout-sl.j-browse-content .j-column-wrap-l,
  1123.  
  1124.       .j-layout-sl.j-browse-places .j-column-wrap-l { float: left !important; }
  1125.  
  1126.  
  1127.  
  1128.       /* let sidebar ui float right */
  1129.  
  1130.       .j-layout-sl.j-browse-content .j-column-s,
  1131.  
  1132.       .j-layout-sl.j-browse-places .j-column-s { float: right !important; }
  1133.  
  1134.       /* ------------------ */
  1135.  
  1136.  
  1137.  
  1138.  
  1139.  
  1140.       /* ------------------
  1141.  
  1142.           leader board
  1143.  
  1144.       */
  1145.  
  1146.       /* .jive-widget.jive-box.j-rc5.jive-widget-leaderboardwidget */
  1147.  
  1148.      
  1149.  
  1150.   /*
  1151.  
  1152.       .jive-widget-leaderboardwidget {display: none !important; }                    
  1153.  
  1154.   */
  1155.  
  1156.  
  1157.  
  1158.       .jive-widget-leaderboardwidget { max-width: 1000px !important; }                      
  1159.  
  1160.       .jive-widget-leaderboardwidget .j-bigtab-nav .j-tabbar { padding-top: 10px !important; }
  1161.  
  1162.       .jive-widget-leaderboardwidget .jive-widget-topmembers.split-columns ul li { min-height: 0px !important; }
  1163.  
  1164.       .jive-widget-leaderboardwidget .top-member-username,
  1165.  
  1166.       .jive-widget-leaderboardwidget .top-member-username * { font-size: inherit !important; }
  1167.  
  1168.       .jive-widget-leaderboardwidget .top-member-username { margin-left: 15px !important; }
  1169.  
  1170.       .jive-widget-leaderboardwidget .user-level-points {
  1171.  
  1172.           font-size: 18px !important;
  1173.  
  1174.           margin: 14px 0px !important;
  1175.  
  1176.           width: 60px !important;
  1177.  
  1178.           height: 30px !important;
  1179.  
  1180.           padding: 8px 0px 0px !important;
  1181.  
  1182.       }
  1183.  
  1184.       .jive-widget-leaderboardwidget .top-member-profile-info { width: 80% !important; }
  1185.  
  1186.       .jive-widget-leaderboardwidget .top-member-profile-info > a {
  1187.  
  1188.           border-radius: 0% !important;
  1189.  
  1190.           width: 60px !important;
  1191.  
  1192.           height: 60px !important;
  1193.  
  1194.       }
  1195.  
  1196.       .jive-widget-leaderboardwidget .top-member-username a.jiveTT-hover-user { width: auto !important; }
  1197.  
  1198.       .jive-widget-leaderboardwidget .pagination-class { margin-top: 30px !important; }
  1199.  
  1200.       /* ------------------ */
  1201.  
  1202.  
  1203.  
  1204.  
  1205.  
  1206.       /* article list
  1207.  
  1208.           .j-rc5 is used to identify this list
  1209.  
  1210.           e.g., https://discussions.apple.com/article/HT1939 */                      
  1211.  
  1212.       .j-layout-sl.j-browse-content.j-rc5 #jive-body-maincol { margin: 0px 0px 0px 166px !important; }
  1213.  
  1214.  
  1215.  
  1216.  
  1217.  
  1218.       /* ------------------------------------------------------------------------------- -----------------
  1219.  
  1220.           THREAD CONTENT BROWSER
  1221.  
  1222.       */
  1223.  
  1224.       /* thread header */
  1225.  
  1226.       .apple-thread-header {
  1227.  
  1228.           width: auto !important;
  1229.  
  1230.           margin-bottom: 10px !important;
  1231.  
  1232.           margin-left: 40px !important;
  1233.  
  1234.       }
  1235.  
  1236.  
  1237.  
  1238.       /* thread message */                                                                    /* NEW */
  1239.  
  1240.       .j-thread .jive-content .j-thread-post .jive-rendered-content {
  1241.  
  1242.           font-size:   inherit !important;
  1243.  
  1244.       }
  1245.  
  1246.       .j-thread #body-apple .jive-thread-messages h2.helpful-allreply,
  1247.  
  1248.       .j-thread #body-apple #helpful-container,
  1249.  
  1250.       .j-thread #body-apple .j-thread-post > header .j-post-author,
  1251.  
  1252.       .j-thread #body-apple .thread-container-wrapper,
  1253.  
  1254.       .j-thread #body-apple .all-replies-container,
  1255.  
  1256.       .j-thread #body-apple #j-main #jive-breadcrumb,
  1257.  
  1258.       .j-thread #body-apple .addReply,
  1259.  
  1260.       .j-thread #body-apple #jive-body-intro-content {
  1261.  
  1262.           max-width: inherit !important;
  1263.  
  1264.           margin: 10px 40px !important;
  1265.  
  1266.       }
  1267.  
  1268.       .j-inresponse-to {
  1269.  
  1270.           font-size: inherit !important;
  1271.  
  1272.       }
  1273.  
  1274.       .j-thread .jive-content .j-thread-post > header,
  1275.  
  1276.       .j-thread .jive-content .j-thread-post > h3.header {
  1277.  
  1278.           margin: 15px 0px 10px 0px !important;
  1279.  
  1280.       }
  1281.  
  1282.  
  1283.  
  1284.  
  1285.  
  1286.       /* thread original messeage (question) */                                               /* NEW */
  1287.  
  1288.       .j-thread-post section.j-original-message {
  1289.  
  1290.           margin: 0px 30px !important;
  1291.  
  1292.           padding: 15px 10px !important;
  1293.  
  1294.           border-style: dotted !important;
  1295.  
  1296.           border-width: thin !important;
  1297.  
  1298.           background: none repeat scroll 0% 0% rgb(247, 247, 237) !important;
  1299.  
  1300.       }
  1301.  
  1302.       .j-thread-post section.j-original-message h1 {
  1303.  
  1304.           max-width: inherit !important;
  1305.  
  1306.           margin: 0px 60px 20px 60px !important;
  1307.  
  1308.       }
  1309.  
  1310.       .j-thread-post section.j-original-message .jive-rendered-content {
  1311.  
  1312.           max-width: inherit !important;
  1313.  
  1314.           margin: 0px 25px !important;
  1315.  
  1316.       }
  1317.  
  1318.      
  1319.  
  1320.       /* original poster profile header */
  1321.  
  1322.       .j-thread .jive-content .j-thread-post > header.js-original-header {
  1323.  
  1324.           max-width: inherit !important;
  1325.  
  1326.           margin: 0px 40px !important;
  1327.  
  1328.           padding: 5px !important;
  1329.  
  1330.       }
  1331.  
  1332.  
  1333.  
  1334.       .j-thread-post section .thread-actions {
  1335.  
  1336.           max-width: inherit !important;
  1337.  
  1338.           margin: 0px 25px !important;
  1339.  
  1340.       }
  1341.  
  1342.       .j-original-message .jive-rendered-content p {
  1343.  
  1344.           font-size:   inherit !important;
  1345.  
  1346.       }
  1347.  
  1348.       .meta-posted {
  1349.  
  1350.           max-width: inherit !important;
  1351.  
  1352.           margin: 10px 25px 20px !important;
  1353.  
  1354.       }
  1355.  
  1356.       /* Q mark */
  1357.  
  1358.       .j-original-message h1 .q-marker {
  1359.  
  1360.           left: -60px !important;
  1361.  
  1362.           font-size: 32px !important;
  1363.  
  1364.       }
  1365.  
  1366.      
  1367.  
  1368.  
  1369.  
  1370.       /* answer rollup */                                                                     /* NEW */
  1371.  
  1372.       .j-answer-rollup.span-full-width {
  1373.  
  1374.           background: none repeat scroll 0% 0% rgb(237, 247, 232) !important;
  1375.  
  1376.           padding-bottom: 10px !important;
  1377.  
  1378.           margin: 20px 0px 0px 0px !important;
  1379.  
  1380.           border: 1px solid rgb(45, 184, 71) !important;
  1381.  
  1382.       }
  1383.  
  1384.       .j-inline-correct-answer {
  1385.  
  1386.           padding: 0px !important;
  1387.  
  1388.           max-width: inherit !important;
  1389.  
  1390.           margin: 0px 10px !important;
  1391.  
  1392.       }
  1393.  
  1394.       .j-inline-correct-answer section {
  1395.  
  1396.           margin: 10px 0px !important;
  1397.  
  1398.       }
  1399.  
  1400.       /* A mark */
  1401.  
  1402.       .j-inline-correct-answer .answer-marker {
  1403.  
  1404.           left: 0px !important;
  1405.  
  1406.           font-size: 32px !important;
  1407.  
  1408.       }
  1409.  
  1410.      
  1411.  
  1412.  
  1413.  
  1414.       /* persistent question shown at top */                                                  /* NEW */
  1415.  
  1416.       .persist-question.persist { display: none !important; }
  1417.  
  1418.  
  1419.  
  1420.      
  1421.  
  1422.       /* Solved and Helpful marker text */                                                    /* NEW */
  1423.  
  1424.       .j-thread-post header .j-correct-text,
  1425.  
  1426.       .j-thread-post h3.header .j-correct-text,
  1427.  
  1428.       .j-thread-post header .j-helpful-text,
  1429.  
  1430.       .j-thread-post h3.header .j-helpful-text {
  1431.  
  1432.           font-size: 22px !important;
  1433.  
  1434.           background: none repeat scroll 0% 0% transparent !important;
  1435.  
  1436.           border-style: none !important;
  1437.  
  1438.           margin: 0px !important;
  1439.  
  1440.           padding: 10px !important;
  1441.  
  1442.       }
  1443.  
  1444.  
  1445.  
  1446.      
  1447.  
  1448.       /* thread content */                                                                    /* CHANGED */
  1449.  
  1450.       .j-thread .jive-content { margin: 0px 10px 0px 10px !important; }
  1451.  
  1452.  
  1453.  
  1454.      
  1455.  
  1456.       /* thread replies ul */
  1457.  
  1458.       ul.jive-discussion-replies.jive-discussion-indent-0 { margin: 0px !important; }
  1459.  
  1460.      
  1461.  
  1462.       /* thread reply li */
  1463.  
  1464.       .jive-discussion-replies li.reply { margin-top: 15px !important; }
  1465.  
  1466.  
  1467.  
  1468.  
  1469.  
  1470.       /* thread message border */                                                             /* NEW */
  1471.  
  1472.       .jive-discussion-replies li.reply .jive-thread-message {
  1473.  
  1474.           border-style: dotted !important;
  1475.  
  1476.           border-width: thin !important;
  1477.  
  1478.       }
  1479.  
  1480.  
  1481.  
  1482.  
  1483.  
  1484.       /* orgininal poster comment background */                                               /* NEW */
  1485.  
  1486.       .original-poster-comment {
  1487.  
  1488.           background: none repeat scroll 0% 0% rgb(247, 247, 237) !important;
  1489.  
  1490.           top:    0px !important;
  1491.  
  1492.           right:  0px !important;
  1493.  
  1494.           bottom: 0px !important;
  1495.  
  1496.           left:   0px !important;
  1497.  
  1498.       }
  1499.  
  1500.  
  1501.  
  1502.  
  1503.  
  1504.       /* pagenation */                                                                        /* NEW */
  1505.  
  1506.       .j-thread .jive-thread-messages .j-pagination {
  1507.  
  1508.           margin: 30px 0px !important;
  1509.  
  1510.       }
  1511.  
  1512.  
  1513.  
  1514.  
  1515.  
  1516.       /* promoted helpful answer and prompted recommended answer */                           /* NEW */
  1517.  
  1518.       .j-inline-promoted-helpful-answer,
  1519.  
  1520.       .j-inline-recommended-answer {
  1521.  
  1522.           background: none repeat scroll 0% 0% rgb(250, 240, 220) !important;
  1523.  
  1524.           padding: 15px 10px 5px 10px !important;
  1525.  
  1526.           margin: 0px 10px 15px 10px !important;
  1527.  
  1528.           border-style: dotted !important;
  1529.  
  1530.           border-width: thin !important;
  1531.  
  1532.       }
  1533.  
  1534.       .j-inline-promoted-helpful-answer p {
  1535.  
  1536.           margin: 0px !important;
  1537.  
  1538.       }
  1539.  
  1540.       .j-inline-promoted-helpful-answer header .reply-date,
  1541.  
  1542.       .j-inline-promoted-helpful-answer h3.header .reply-date,
  1543.  
  1544.       .j-inline-recommended-answer header .reply-date,
  1545.  
  1546.       .j-inline-recommended-answer h3.header .reply-date {
  1547.  
  1548.           font-size: inherit !important;
  1549.  
  1550.           margin: 10px 0px !important;
  1551.  
  1552.       }
  1553.  
  1554.       .j-inline-promoted-helpful-answer header .j-helpful-text,
  1555.  
  1556.       .j-inline-promoted-helpful-answer h3.header .j-helpful-text,
  1557.  
  1558.       .j-inline-recommended-answer header .j-helpful-text,
  1559.  
  1560.       .j-inline-recommended-answer h3.header .j-helpful-text {
  1561.  
  1562.           font-size: 22px !important;
  1563.  
  1564.           background: none repeat scroll 0% 0% transparent !important;
  1565.  
  1566.           border-style: none !important;
  1567.  
  1568.           margin: 0px !important;
  1569.  
  1570.       }
  1571.  
  1572.       .j-inline-promoted-helpful-answer section .reply-body,
  1573.  
  1574.       .j-inline-recommended-answer section .reply-body {
  1575.  
  1576.           font-size: inherit !important;
  1577.  
  1578.           margin-bottom: 20px !important;
  1579.  
  1580.       }
  1581.  
  1582.       .j-inline-promoted-helpful-answer section,
  1583.  
  1584.       .j-inline-recommended-answer section {
  1585.  
  1586.           padding: 0px 20px !important;
  1587.  
  1588.       }
  1589.  
  1590.       #helpful-container { padding-top: 0px !important; }
  1591.  
  1592.       #helpful-container hr { margin: 10px !important; }
  1593.  
  1594.       #helpful-container .more-answers { margin: 0px !important; }
  1595.  
  1596.       #helpful-container .more-answers * { font-size: 24px !important; }
  1597.  
  1598.  
  1599.  
  1600.  
  1601.  
  1602.       /* inline correct answer, helpful answer background */                                  /* NEW */
  1603.  
  1604.       div[itemprop="acceptedAnswer"] {
  1605.  
  1606.           background: none repeat scroll 0% 0% rgb(237, 247, 232) !important;
  1607.  
  1608.       }
  1609.  
  1610.       .j-thread .jive-content.j-helpful,
  1611.  
  1612.       .j-thread .jive-content.j-helpful.j-op {
  1613.  
  1614.           background: none repeat scroll 0% 0% rgb(250, 240, 220) !important;
  1615.  
  1616.       }
  1617.  
  1618.  
  1619.  
  1620.  
  1621.  
  1622.       /* switch between 'hellpful replies only' and 'all replies' */                          /* NEW */
  1623.  
  1624.       .jive-thread-messages .helpful-all-switch * {  
  1625.  
  1626.           font-size: 24px !important;
  1627.  
  1628.       }
  1629.  
  1630.       .jive-thread-messages .helpful-all-switch li.inactive {
  1631.  
  1632.           padding: 0px !important;
  1633.  
  1634.           top: 32px !important;
  1635.  
  1636.       }
  1637.  
  1638.       .jive-thread-messages .helpful-all-switch li.inactive span.menu {
  1639.  
  1640.           width: auto  !important;
  1641.  
  1642.           min-width: 160px !important;
  1643.  
  1644.           padding: 5px  !important;
  1645.  
  1646.           text-align: center !important;
  1647.  
  1648.       }
  1649.  
  1650.      
  1651.  
  1652.  
  1653.  
  1654.       /* thread content footer profile */                                                     /* NEW */
  1655.  
  1656.       .j-thread-post section.j-original-message footer .footer-profile {
  1657.  
  1658.           margin-right: 10px !important;
  1659.  
  1660.       }
  1661.  
  1662.       .j-thread-post footer .footer-profile {
  1663.  
  1664.           margin-right: -10px !important;
  1665.  
  1666.       }
  1667.  
  1668.       .j-thread-post footer .footer-profile .j-status-level {
  1669.  
  1670.           padding: 0px 10px 0px 0px !important;
  1671.  
  1672.       }
  1673.  
  1674.       .j-thread-post footer .footer-profile .username,
  1675.  
  1676.       .j-thread-post footer .footer-profile .jive-username-link {
  1677.  
  1678.           padding: 0px 10px 0px 10px !important;
  1679.  
  1680.           max-width: 250px !important;
  1681.  
  1682.       }
  1683.  
  1684.       .j-inline-correct-answer footer .footer-profile .j-status-levels,
  1685.  
  1686.       .j-inline-promoted-helpful-answer footer .footer-profile .j-status-levels,
  1687.  
  1688.       .j-inline-recommended-answer footer .footer-profile .j-status-levels {
  1689.  
  1690.           padding: 0px 10px 0px 0px !important;
  1691.  
  1692.       }
  1693.  
  1694.       .j-inline-correct-answer footer .footer-profile .username,
  1695.  
  1696.       .j-inline-promoted-helpful-answer footer .footer-profile .username,
  1697.  
  1698.       .j-inline-recommended-answer footer .footer-profile .username {
  1699.  
  1700.           padding: 0px 10px 0px 10px !important;
  1701.  
  1702.           max-width: 250px !important;
  1703.  
  1704.       }
  1705.  
  1706.  
  1707.  
  1708.  
  1709.  
  1710.       /* text wrap in header */
  1711.  
  1712.       .j-thread-post > header .j-post-author { white-space: normal !important; }    
  1713.  
  1714.      
  1715.  
  1716.       /* thread post section (message body) */
  1717.  
  1718.       .j-thread-post section {
  1719.  
  1720.           padding: 0px 20px !important;
  1721.  
  1722.           margin-bottom: 15px !important;                                                     /* CHANGED */
  1723.  
  1724.       }
  1725.  
  1726.      
  1727.  
  1728.  
  1729.  
  1730.       /* thread rendered content */
  1731.  
  1732.       .jive-rendered-content { padding-bottom: 4px !important; }
  1733.  
  1734.      
  1735.  
  1736.       /* thread rendered content quote & pre */
  1737.  
  1738.       .jive-rendered-content .jive-quote,
  1739.  
  1740.       .jive-rendered-content .jive-pre {
  1741.  
  1742.           margin: 5px 15px !important;
  1743.  
  1744.       }
  1745.  
  1746.  
  1747.  
  1748.       /* thread reply footer (Return to Community | Go to original post) */
  1749.  
  1750.       #jive-thread-reply-footer { margin-top: 10px !important; }
  1751.  
  1752.      
  1753.  
  1754.       /* more like this links, incomming links */
  1755.  
  1756.       #apple-related-threads { margin: 0px 40px !important; }
  1757.  
  1758.       #apple-related-threads .j-box { margin-bottom: 0px !important; }
  1759.  
  1760.       .j-icon-list li { padding: 3px 0px 3px 22px !important; }
  1761.  
  1762.  
  1763.  
  1764.       /* related articles */                                                        
  1765.  
  1766.       .apple-sidebar-property {
  1767.  
  1768.           width: auto !important;
  1769.  
  1770.           padding-left: 0px !important;
  1771.  
  1772.       }
  1773.  
  1774.       .jive-box-body.jive-sidebar-body.jive-sidebar-body-related-articles { padding: 15px 0px !important; }
  1775.  
  1776.      
  1777.  
  1778.  
  1779.  
  1780.       /* ------------------
  1781.  
  1782.           staus level, expertise, level points
  1783.  
  1784.       */
  1785.  
  1786.       /* status level expertise tile */
  1787.  
  1788.       .j-status-level.expertise-tile,
  1789.  
  1790.       .status-tile.expertise-tile { display: none !important; }                  
  1791.  
  1792.      
  1793.  
  1794.       /* status level level points */
  1795.  
  1796.       .j-status-level .level-points span { display: inherit !important; }            
  1797.  
  1798.       .j-status-level .level-points { white-space: inherit !important; }            
  1799.  
  1800.       /* ------------------ */
  1801.  
  1802.  
  1803.  
  1804.  
  1805.  
  1806.       /* ------------------------------------------------------------------------------- -----------------
  1807.  
  1808.           INLINE EDITOR
  1809.  
  1810.       */
  1811.  
  1812.       /* editor */
  1813.  
  1814.       .jive-discussion-replies li.addReply { margin: 50px 40px 0px !important; }
  1815.  
  1816.  
  1817.  
  1818.  
  1819.  
  1820.       /* ------------------------------------------------------------------------------- -----------------
  1821.  
  1822.           ADVANCED EDITOR
  1823.  
  1824.       */
  1825.  
  1826.  
  1827.  
  1828.       /* content area */
  1829.  
  1830.       .j-thread.jive-body-formpage #body-apple .j-form {
  1831.  
  1832.           max-width: inherit !important;
  1833.  
  1834.           margin: 0px auto 20px !important;
  1835.  
  1836.           width: inherit !important;
  1837.  
  1838.       }
  1839.  
  1840.       .j-thread .jive-content.jive-create-thread,
  1841.  
  1842.       .jive-body-formpage-document .jive-content.doc-page {
  1843.  
  1844.           margin: 0px 40px !important;
  1845.  
  1846.           padding: 0px !important;
  1847.  
  1848.       }
  1849.  
  1850.  
  1851.  
  1852.  
  1853.  
  1854.       /* editor panel */
  1855.  
  1856.       .j-thread .jive-content.jive-create-thread #jive-compose-title,
  1857.  
  1858.       .j-thread .jive-content.jive-create-thread .jive-editor-panel.jive-large-editor-panel,
  1859.  
  1860.       .jive-body-formpage-document .jive-content.doc-page #jive-compose-title,
  1861.  
  1862.       .jive-body-formpage-document .jive-content.doc-page .jive-editor-panel.jive-large-editor-panel { margin: 0px !important; }
  1863.  
  1864.  
  1865.  
  1866.       /* line height in editor */
  1867.  
  1868.       body.tiny_mce_content { line-height: inherit !important; }
  1869.  
  1870.  
  1871.  
  1872.       /* replying to */
  1873.  
  1874.       p.jive-replying-to { padding: 20px 0px !important; }
  1875.  
  1876.       .jive-body-formpage-comment .jive-thread-message { margin: 0px 40px 0px 80px !important; }
  1877.  
  1878.  
  1879.  
  1880.       /* reply to avatar */
  1881.  
  1882.       .j-thread-post header .j-post-avatar {
  1883.  
  1884.           position: absolute !important;
  1885.  
  1886.           top: 0px !important;
  1887.  
  1888.           left: -50px !important;
  1889.  
  1890.           width: auto !important;
  1891.  
  1892.       }
  1893.  
  1894.      
  1895.  
  1896.       /* buttons (Reply|Cancel) */
  1897.  
  1898.       .j-publishbar,
  1899.  
  1900.       .jive-body-formpage .jive-composebuttons { margin: 20px 40px 0px !important; }
  1901.  
  1902.  
  1903.  
  1904.  
  1905.  
  1906.       /* ------------------------------------------------------------------------------- -----------------
  1907.  
  1908.           ACTIVITY STREAM
  1909.  
  1910.       */
  1911.  
  1912.       /* activity entry */
  1913.  
  1914.       .j-act-entry { padding: 5px 0px 10px 100px !important; }
  1915.  
  1916.  
  1917.  
  1918.       /* activity title */
  1919.  
  1920.       .j-body-home .j-act-title { padding: 5px 0px 5px 24px !important; }
  1921.  
  1922.  
  1923.  
  1924.       /* activity body & comment */                                                  
  1925.  
  1926.       .j-body-home .j-act-init { padding: 5px 0px 10px 100px !important; }
  1927.  
  1928.       .apple-activity-comments-wrapper { margin-left: 0px !important; }
  1929.  
  1930.  
  1931.  
  1932.       /* Like list */
  1933.  
  1934.       .j-act-grouped .j-act-g-item { padding: 3px !important; }
  1935.  
  1936.      
  1937.  
  1938.      
  1939.  
  1940.       /* ------------------------------------------------------------------------------- -----------------
  1941.  
  1942.           SEARCH RESULTS
  1943.  
  1944.       */
  1945.  
  1946.       /* search result entry */
  1947.  
  1948.       .j-search-results-main-container .j-search-result { padding: 10px !important; }
  1949.  
  1950.  
  1951.  
  1952.  
  1953.  
  1954.       /* ------------------------------------------------------------------------------- -----------------
  1955.  
  1956.           DOC (USER TIP)
  1957.  
  1958.       */                                                                            
  1959.  
  1960.       /* user tip canvas */
  1961.  
  1962.       .jive-body-content.j-doc .j-column-wrap-l { margin: 0px 40px !important; }
  1963.  
  1964.  
  1965.  
  1966.       /* user tip border etc */                                                               /* NEW */
  1967.  
  1968.       .j-doc .jive-content {
  1969.  
  1970.           margin: 0px !important;
  1971.  
  1972.           padding: 10px !important;
  1973.  
  1974.           border: thin dotted !important;
  1975.  
  1976.       }
  1977.  
  1978.  
  1979.  
  1980.  
  1981.  
  1982.       /* ------------------------------------------------------------------------------- -----------------
  1983.  
  1984.           BLOG (MODERATOR TIP)
  1985.  
  1986.       */                                                                                       /* NEW */                                                                      
  1987.  
  1988.       /* blog canvas */
  1989.  
  1990.       .jive-body-content.j-blog .j-column-wrap-l { margin: 0px 40px !important; }
  1991.  
  1992.      
  1993.  
  1994.       /* blog border etc */
  1995.  
  1996.       .jive-content-blog {
  1997.  
  1998.           margin: 0px !important;
  1999.  
  2000.           padding: 10px !important;
  2001.  
  2002.           border: thin dotted !important;
  2003.  
  2004.           border-radius: 0px !important;
  2005.  
  2006.       }
  2007.  
  2008.  
  2009.  
  2010.  
  2011.  
  2012.       /* ------------------------------------------------------------------------------- -----------------
  2013.  
  2014.           UNAUTHORIZED (WARNING)
  2015.  
  2016.       */                                                                                       /* NEW */                                                                      
  2017.  
  2018.       /* unauthorized error message */
  2019.  
  2020.       .jive-body-warn.jive-body-unathorized #j-main { margin: 0px 40px !important; }
  2021.  
  2022.  
  2023.  
  2024.      
  2025.  
  2026.       /* ------------------------------------------------------------------------------- -----------------
  2027.  
  2028.           PROFILE
  2029.  
  2030.       */                                                                            
  2031.  
  2032.       /* header & navigation bar (Bio|Activity|People|Content|Communities|Bookmarks) */
  2033.  
  2034.       .j-view-profile .j-page-header { padding: 10px 40px !important; }
  2035.  
  2036.       .j-bigtab-nav { margin: 10px 40px !important; }
  2037.  
  2038.      
  2039.  
  2040.       /* filter ui current selection blue marker */                                           /* NEW */
  2041.  
  2042.       .j-view-profile .j-second-nav ul > li.active {
  2043.  
  2044.           display: none !important;
  2045.  
  2046.       }
  2047.  
  2048.  
  2049.  
  2050.       /* ------------------
  2051.  
  2052.           Bio
  2053.  
  2054.       */
  2055.  
  2056.       .j-layout-l .j-column-wrap-l { width: 100% !important; }
  2057.  
  2058.      
  2059.  
  2060.       /* ------------------
  2061.  
  2062.           profile specialties and awards
  2063.  
  2064.       */
  2065.  
  2066.       /* profile status container for specialties and awards */                               /* REFINED (rule) */
  2067.  
  2068.       .jive-view-profile .profile-status-container { display: none !important; }
  2069.  
  2070.  
  2071.  
  2072.       /* profile modal note status row for specialties and awards */
  2073.  
  2074.       .status-row { display: none !important; }                                      
  2075.  
  2076.       /* ------------------ */
  2077.  
  2078.  
  2079.  
  2080.  
  2081.  
  2082.       /* ------------------
  2083.  
  2084.           Content
  2085.  
  2086.       */                                                                                       /* NEW */
  2087.  
  2088.       /* browser control ui */
  2089.  
  2090.       .j-view-profile .j-layout-sl.j-browse-content .j-column-s #js-browse-controls {
  2091.  
  2092.           margin: 25px 0px 0px -166px !important;
  2093.  
  2094.       }
  2095.  
  2096.      
  2097.  
  2098.  
  2099.  
  2100.       /* ------------------------------------------------------------------------------- -----------------
  2101.  
  2102.           PLACES (almost hidden, rarely used)
  2103.  
  2104.          
  2105.  
  2106.               e.g.
  2107.  
  2108.               https://discussions.apple.com/places
  2109.  
  2110.               https://discussionsjapan.apple.com/places
  2111.  
  2112.               https://communities.apple.com/es/places
  2113.  
  2114.               etc.
  2115.  
  2116.       */                                                                            
  2117.  
  2118.       /* latest activity column */
  2119.  
  2120.       .j-browse-details .j-td-activity { max-width: 650px !important; }
  2121.  
  2122.      
  2123.  
  2124.       /* filter row margin bottom */
  2125.  
  2126.       .j-body-yourplaces #j-browse-filters { margin-bottom: 30px !important;}
  2127.  
  2128.  
  2129.  
  2130.  
  2131.  
  2132.       @media all and ( min-width: 1265px )
  2133.  
  2134.       {
  2135.  
  2136.           /* ------------------
  2137.  
  2138.               Treatment for narrow window
  2139.  
  2140.               Method 1 (minimum optimisation)
  2141.  
  2142.      
  2143.  
  2144.               Adjust community list table's shift and margin to maximize its width.
  2145.  
  2146.           */                                                                            
  2147.  
  2148.           .j-layout-sl.j-browse-places .j-column-wrap-l { margin-left: -166px !important; }
  2149.  
  2150.           .j-layout-sl.j-browse-places .j-column-l      { margin-left: 166px !important; }
  2151.  
  2152.           .j-layout-sl.j-browse-places .j-column-l      { padding-left: 0px !important; }
  2153.  
  2154.           .j-layout-sl.j-browse-places .j-column-s      { width: 166px !important; }
  2155.  
  2156.       }
  2157.  
  2158.       @media all and ( max-width: 1265px )
  2159.  
  2160.       {
  2161.  
  2162.           /* ------------------
  2163.  
  2164.               Treatment for narrow window
  2165.  
  2166.               Method 2 (more beneficial to narrow window but has disadvantage for wide window)
  2167.  
  2168.              
  2169.  
  2170.               Let community list table have full width but not exceed 1019px to make room for sidebar ui (filters & actions).
  2171.  
  2172.               If window is wide enough (>=1265px), sidebar ui is displayed next to community list table,
  2173.  
  2174.               otherwise it is displayed below or above it (depending upon its document tree order).
  2175.  
  2176.              
  2177.  
  2178.               * sidebar width (constant)    = 166px
  2179.  
  2180.               * community table max width   = 1019px
  2181.  
  2182.               * canvas margin-left          = 40px
  2183.  
  2184.               * canvas margin-right         = 40px
  2185.  
  2186.               ---------------------------------------
  2187.  
  2188.               * total                       = 1265px
  2189.  
  2190.           */                                                                            
  2191.  
  2192.           .j-layout-sl.j-browse-places .j-column-wrap-l { max-width: 1019px !important; }
  2193.  
  2194.           .j-layout-sl.j-browse-places .j-column-wrap-l { margin-left: 0px !important; }
  2195.  
  2196.           .j-layout-sl.j-browse-places .j-column-l      { margin-left: 0px !important; }
  2197.  
  2198.           .j-layout-sl.j-browse-places .j-column-l      { padding-left: 0px !important; }
  2199.  
  2200.           .j-layout-sl.j-browse-places .j-column-s      { width: 166px !important; }
  2201.  
  2202.       }
  2203.  
  2204.   }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement