API tools faq
paste
Advertisement
fauzanjeg

Custom Change || Use Mobile Layout for Ipad Pro on Landscape mode

fauzanjeg
May 7th, 2021
221
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 10.61 KB | None | 0 0
raw download clone embed print report
  1. /* Custom Change || Use Mobile Layout for Ipad Pro on Landscape mode */
  2. @media only screen
  3.   and (min-device-width: 1024px)
  4.   and (max-device-width: 1366px)
  5.   and (-webkit-min-device-pixel-ratio: 2)
  6.   and (orientation: landscape) {
  7.     /* Mobile Menu */
  8.     .jeg_header {display: none;}
  9.     #jeg_off_canvas, .jeg_navbar_mobile_wrapper, .jeg_navbar_mobile {display: block;}
  10.     .admin-bar #jeg_off_canvas {top: 32px;}
  11.     .jeg_navbar_mobile_wrapper { display: block; }
  12.  
  13.     /* Sidebar */
  14.     .jeg_sidebar {padding:0px 15px !important;}
  15.  
  16.     /* Side Content */
  17.     .jeg_sidecontent .jeg_viewport {margin-left: auto;}
  18.     .jeg_sidecontent_left:not(.jeg_boxed) .container,
  19.     .jeg_sidecontent_left:not(.jeg_boxed) .jeg_vc_content > .vc_row,
  20.     .jeg_sidecontent_left:not(.jeg_boxed) .jeg_vc_content > .vc_element > .vc_row {margin-left: auto;}
  21.  
  22.     #jeg_sidecontent { display: none; }
  23.  
  24.     /* Slider Type 2 */
  25.     .jeg_slider_type_2_wrapper .thumbnail-container { padding-bottom: 445px; }
  26.     .jeg_slider_type_2 .jeg_slide_item {height: 445px}
  27.     .jeg_slider_type_2 .jeg_slide_caption {width: 60%;}
  28.     .jeg_slider_type_2 .jeg_slide_caption .jeg_post_title {font-size: 30px;}
  29.  
  30.     /* Slider Type 3 */
  31.     .jeg_slider_type_3 .jeg_post_title {font-size: 18px;}
  32.     .jeg_col_3o3 .jeg_slider_type_3[data-items="5"] .jeg_post_title,
  33.     .jeg_col_2o3 .jeg_slider_type_3[data-items="3"] .jeg_post_title,
  34.     .jeg_col_2o3 .jeg_slider_type_3[data-items="4"] .jeg_post_title,
  35.     .jeg_col_2o3 .jeg_slider_type_3[data-items="5"] .jeg_post_title {
  36.         font-size: 16px;
  37.         margin-bottom: 5px;
  38.     }
  39.  
  40.     /* Slider Type 4 */
  41.     .jeg_slider_type_4 .jeg_slide_caption {width: 60%}
  42.     .jeg_slider_type_4 .jeg_slide_caption .jeg_post_title {font-size: 30px; letter-spacing: -0.02em}
  43.  
  44.     /* Slider Type 5 */
  45.     .jeg_slider_type_5_wrapper .thumbnail-container, .jeg_slider_type_6_wrapper .thumbnail-container { padding-bottom: 445px; }
  46.     .jeg_slider_type_5 .jeg_slide_item, .jeg_slider_type_6 .jeg_slide_item {height: 445px}
  47.     .jeg_slider_type_5 .jeg_slide_caption {width: 60%;}
  48.     .jeg_slider_type_5 .jeg_slide_caption .jeg_post_title {font-size: 30px;}
  49.  
  50.     /* Slider Type 6 */
  51.     .jeg_slider_type_6 .jeg_slide_caption .jeg_post_title { font-size: 40px; margin: 20px auto 30px }
  52.     .jeg_slider_type_6 .jeg_slide_caption .jeg_post_title:before { bottom: -42px; }
  53.  
  54.     /* Slider Type 7 */
  55.     .jeg_slider_type_7_wrapper .thumbnail-container { padding-bottom: 445px; }
  56.     .jeg_slider_type_7 .jeg_slide_item { height: 445px }
  57.     .jeg_slider_type_7 .jeg_slide_caption .jeg_post_title { font-size: 24px; }
  58.     .jeg_slider_type_7 .jeg_post_excerpt { margin-bottom: 15px; }
  59.     .jeg_slider_type_7 .jeg_block_nav a { height: 50px; line-height: 50px; }
  60.  
  61.     /* Post Carousel 3 */
  62.     .jeg_postblock_carousel_3 .jeg_post_title {font-size: 14px;}
  63.     .jeg_postblock_carousel_3 .jeg_thumb {width: 65px}
  64.  
  65.     /*** Block Modules ***/
  66.  
  67.     /*** Hero Blocks ***/
  68.     .jeg_heroblock_1 .jeg_heroblock_wrapper,
  69.     .jeg_heroblock_2 .jeg_heroblock_wrapper,
  70.     .jeg_heroblock_6 .jeg_heroblock_wrapper,
  71.     .jeg_heroblock_8 .jeg_heroblock_wrapper {
  72.         height: 412px;
  73.     }
  74.  
  75.     .jeg_heroblock_3 .jeg_heroblock_wrapper,
  76.     .jeg_heroblock_4 .jeg_heroblock_wrapper,
  77.     .jeg_heroblock_5 .jeg_heroblock_wrapper,
  78.     .jeg_heroblock_7 .jeg_heroblock_wrapper,
  79.     .jeg_heroblock_9 .jeg_heroblock_wrapper,
  80.     .jeg_heroblock_13 .jeg_heroblock_wrapper {
  81.         height: 355px;
  82.     }
  83.  
  84.     .jeg_heroblock_10 .jeg_heroblock_wrapper,
  85.     .jeg_heroblock_11 .jeg_heroblock_wrapper,
  86.     .jeg_heroblock_12 .jeg_heroblock_wrapper {
  87.         height: 445px;
  88.     }
  89.  
  90.     .jeg_heroblock_skew .jeg_heroblock_wrapper {
  91.         height: 289px;
  92.     }
  93.  
  94.     /* match caption style */
  95.     .jeg_heroblock_13.jeg_hero_style_1 .jeg_postblock_content {left: 30px; bottom: 30px;}
  96.     .jeg_heroblock_13.jeg_hero_style_2 .jeg_postblock_content {left: 30px; right: 30px;}
  97.     .jeg_heroblock_13.jeg_hero_style_3 .jeg_postblock_content {left: 20px; top: 20px}
  98.     .jeg_heroblock_13.jeg_hero_style_3 .jeg_postblock_content {left: 20px; top: 20px}
  99.     .jeg_heroblock_skew.jeg_hero_style_1 .jeg_postblock_content {left: 0}
  100.     .jeg_heroblock_skew.jeg_hero_style_1 .jeg_hero_item_1 .jeg_postblock_content {left: 10px}
  101.     .jeg_heroblock_6.jeg_hero_style_1 .jeg_heroblock_scroller .jeg_post_title,
  102.     .jeg_heroblock_6.jeg_hero_style_1 .jeg_heroblock_scroller .jeg_post_category {
  103.         -webkit-transform: translate3d(0, 10px, 0);
  104.                 transform: translate3d(0, 10px, 0);
  105.     }
  106.  
  107.     /* hero caption */
  108.     .jeg_hero_style_1 .jeg_postblock_content {padding-bottom: 20px;}
  109.     .jeg_hero_style_2 .jeg_post_info {bottom: 20px}
  110.     .jeg_hero_style_7 .jeg_post_title {font-size: 16px;}
  111.     .jeg_hero_style_7 .jeg_post_meta {font-size: 10px;}
  112.  
  113.     .jeg_heroblock_1 .jeg_hero_item_3 .jeg_post_title,
  114.     .jeg_heroblock_1 .jeg_hero_item_4 .jeg_post_title,
  115.     .jeg_heroblock_2 .jeg_heroblock_scroller .jeg_post_title,
  116.     .jeg_heroblock_3 .jeg_hero_item_3 .jeg_post_title,
  117.     .jeg_heroblock_3 .jeg_hero_item_4 .jeg_post_title,
  118.     .jeg_heroblock_10 .jeg_hero_item_2 .jeg_post_title,
  119.     .jeg_heroblock_10 .jeg_hero_item_3 .jeg_post_title,
  120.     .jeg_heroblock_10 .jeg_hero_item_4 .jeg_post_title,
  121.     .jeg_heroblock_10 .jeg_hero_item_6 .jeg_post_title,
  122.     .jeg_heroblock_10 .jeg_hero_item_7 .jeg_post_title,
  123.     .jeg_heroblock_11 .jeg_hero_item_4 .jeg_post_title,
  124.     .jeg_heroblock_12 .jeg_hero_item_5 .jeg_post_title {
  125.         font-size: 16px;
  126.     }
  127.  
  128.     .jeg_heroblock_6 .jeg_hero_item_1 .jeg_post_title,
  129.     .jeg_heroblock_skew .jeg_post_title,
  130.     .jeg_heroblock_13 .jeg_post_title {
  131.         font-size: 28px;
  132.         line-height: 1.2;
  133.     }
  134.  
  135.     /* style 7*/
  136.     .jeg_hero_style_7 .jeg_postblock_content {
  137.         width: auto;
  138.         right: 20px;
  139.     }
  140.     .jeg_heroblock_1.jeg_hero_style_7 .jeg_hero_item_3 .jeg_post_title,
  141.     .jeg_heroblock_1.jeg_hero_style_7 .jeg_hero_item_4 .jeg_post_title,
  142.     .jeg_heroblock_2.jeg_hero_style_7 .jeg_heroblock_scroller .jeg_post_title,
  143.     .jeg_heroblock_3.jeg_hero_style_7 .jeg_hero_item_3 .jeg_post_title,
  144.     .jeg_heroblock_3.jeg_hero_style_7 .jeg_hero_item_4 .jeg_post_title,
  145.     .jeg_heroblock_10.jeg_hero_style_7 .jeg_hero_item_2 .jeg_post_title,
  146.     .jeg_heroblock_10.jeg_hero_style_7 .jeg_hero_item_3 .jeg_post_title,
  147.     .jeg_heroblock_10.jeg_hero_style_7 .jeg_hero_item_4 .jeg_post_title,
  148.     .jeg_heroblock_10.jeg_hero_style_7 .jeg_hero_item_6 .jeg_post_title,
  149.     .jeg_heroblock_10.jeg_hero_style_7 .jeg_hero_item_7 .jeg_post_title,
  150.     .jeg_heroblock_11.jeg_hero_style_7 .jeg_hero_item_4 .jeg_post_title,
  151.     .jeg_heroblock_12.jeg_hero_style_7 .jeg_hero_item_5 .jeg_post_title {
  152.         font-size: 12px;
  153.     }
  154.  
  155.     .jeg_heroblock_5.jeg_hero_style_7 .jeg_post_title,
  156.     .jeg_heroblock_8.jeg_hero_style_7 .jeg_post_title,
  157.     .jeg_heroblock_10.jeg_hero_style_7 .jeg_hero_item_1 .jeg_post_title,
  158.     .jeg_heroblock_10.jeg_hero_style_7 .jeg_hero_item_5 .jeg_post_title,
  159.     .jeg_heroblock_11.jeg_hero_style_7 .jeg_hero_item_2 .jeg_post_title,
  160.     .jeg_heroblock_11.jeg_hero_style_7 .jeg_hero_item_3 .jeg_post_title,
  161.     .jeg_heroblock_12.jeg_hero_style_7 .jeg_hero_item_2 .jeg_post_title,
  162.     .jeg_heroblock_12.jeg_hero_style_7 .jeg_hero_item_3 .jeg_post_title {
  163.         font-size: 18px;
  164.     }
  165.  
  166.     .jeg_heroblock_1.jeg_hero_style_7 .jeg_hero_item_1 .jeg_post_title,
  167.     .jeg_heroblock_2.jeg_hero_style_7 .jeg_hero_item_1 .jeg_post_title,
  168.     .jeg_heroblock_3.jeg_hero_style_7 .jeg_hero_item_1 .jeg_post_title,
  169.     .jeg_heroblock_4.jeg_hero_style_7 .jeg_hero_item_1 .jeg_post_title,
  170.     .jeg_heroblock_5.jeg_hero_style_7 .jeg_hero_item_1 .jeg_post_title,
  171.     .jeg_heroblock_9.jeg_hero_style_7 .jeg_post_title,
  172.     .jeg_heroblock_11.jeg_hero_style_7 .jeg_hero_item_1 .jeg_post_title,
  173.     .jeg_heroblock_12.jeg_hero_style_7 .jeg_hero_item_1 .jeg_post_title  {
  174.         font-size: 20px;
  175.     }
  176.  
  177.     .jeg_heroblock_skew.jeg_hero_style_7 .jeg_post_title {
  178.         font-size: 22px;
  179.         line-height: 1.3;
  180.     }
  181.     .jeg_heroblock_6.jeg_hero_style_7 .jeg_hero_item_1 .jeg_post_title,
  182.     .jeg_heroblock_13.jeg_hero_style_7 .jeg_post_title {
  183.         font-size: 24px;
  184.         line-height: 1.4;
  185.     }
  186.  
  187.     /* Post Carousel 3 */
  188.     .jeg_postblock_carousel_3 .jeg_post_meta {display: none;}
  189.  
  190.     /* Widgets */
  191.     .popularpost_item:first-child .jeg_post_title {font-size: 20px;}
  192.     .jeg_ad_widget .ad_container {padding: 0; border: 0;}
  193.  
  194.     .jeg_inline_subscribeform .mc4wp-form .jeg_mc4wp_heading {
  195.         flex: 0 0 100%;
  196.         padding-right: 0;
  197.     }
  198.     .jeg_inline_subscribeform .mc4wp-form-fields p {
  199.         font-size: 14px;
  200.     }
  201.  
  202.     /* Footer */
  203.     .jeg_footer_social .socials_widget a {margin: 0 15px;}
  204.     .jeg_footer_social .socials_widget span {font-size: 11px; letter-spacing: 1px}
  205.  
  206.     /*** Single Post ***/
  207.     .entry-header .jeg_post_title {font-size: 2.4em;}
  208.     .jeg_single_tpl_2 .entry-header .jeg_post_title,
  209.     .jeg_single_tpl_3 .entry-header .jeg_post_title,
  210.     .jeg_single_tpl_6 .entry-header .jeg_post_title,
  211.     .jeg_featured_big .entry-header .jeg_post_title {
  212.         font-size: 3em;
  213.     }
  214.  
  215.     .jeg_single_tpl_6 .entry-header .jeg_meta_trending {top: -8em;}
  216.  
  217.     .entry-content h1 {font-size: 2em}
  218.     .entry-content h2 {font-size: 1.703em}
  219.     .entry-content h3 {font-size: 1.35em}
  220.     .entry-content h4 {font-size: 1.2em}
  221.     .entry-content h5 {font-size: 1.17em}
  222.  
  223.     .entry-content h3.jeg_block_title {
  224.         font-size: inherit;
  225.     }
  226.  
  227.     .jeg_single_narrow .jeg_main_content {margin-top: 0;}
  228.     .jeg_single_narrow .jeg_share_button.share-float {margin-left: 10px;}
  229.     .jeg_featured_img {
  230.         background-attachment: inherit;
  231.     }
  232.     .jeg_parallax .jeg_featured_img {
  233.         background-position: center center !important;
  234.         -webkit-background-size: cover;
  235.         -moz-background-size: cover;
  236.         -o-background-size: cover;
  237.         background-size: cover;
  238.     }
  239.  
  240.     .jeg_single_tpl_6 .jeg_featured_big {height: 300px}
  241.     .jeg_single_tpl_10 .entry-header {margin: 20px auto 30px;}
  242.  
  243.     .alignright, .alignleft {max-width: 265px;}
  244.     .entry-content .pullquote { font-size: 120%; }
  245.     .entry-content blockquote, .entry-content q {font-size: 110%;}
  246.     .entry-content .pullquote.align-left { max-width: 40%; margin-right: 1em; }
  247.     .entry-content .pullquote.align-right { max-width: 40%; margin-left: 1em; }
  248.     .jeg_authorpage .jeg_author_content p { width: 100%; }
  249.  
  250.     /** Category **/
  251.     .jeg_cat_header_4 .jeg_cat_overlay .jeg_title_wrap {padding: 70px 0}
  252.  
  253.     .jeg_slider_type_1 .jeg_slide_caption .jeg_post_title {
  254.         font-size: 23px;
  255.     }
  256. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!