responsive.scss 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. /*For Laptop (1280px)*/
  2. @media(max-width:1350px) {
  3. .carousel .item{
  4. h3{
  5. font-size:17px;
  6. height:90px;
  7. }
  8. }
  9. .inbox-center{
  10. a{
  11. width:400px;
  12. }
  13. }
  14. }
  15. /*Small Desktop*/
  16. @media(min-width:1024px) {
  17. .app-search .form-control:focus{
  18. width: 300px;
  19. }
  20. }
  21. /*Ipad*/
  22. @media(min-width:768px) {
  23. #page-wrapper {
  24. position: inherit;
  25. margin: 0px 0 0px 220px;
  26. }
  27. .navbar-default{
  28. position:relative;
  29. width:100%;
  30. top:0px;
  31. }
  32. .fix-header{
  33. .navbar-static-top{
  34. position:fixed;
  35. }
  36. #page-wrapper {
  37. margin-top:60px;
  38. }
  39. }
  40. .mail_listing{border-left:1px solid rgba(120, 130, 140, 0.13); padding-left:20px;}
  41. .inbox-panel{ padding-right:20px; }
  42. .top-minus{
  43. margin-top:-62px;
  44. float:right;
  45. }
  46. }
  47. @media (max-width:1024px) {
  48. .b-r-none{ border-right:0px;}
  49. .carousel-inner h3{ height:90px; overflow:hidden;}
  50. .inbox-center{
  51. a{
  52. width:300px;
  53. }
  54. }
  55. }
  56. /*Phone*/
  57. @media(max-width:767px) {
  58. .navbar-top-links {
  59. display:inline-block;
  60. .profile-pic img{
  61. margin-right:0px;
  62. }
  63. }
  64. .top-left-part{ width:60px;}
  65. .navbar-top-links li:last-child{ margin-right:0px;}
  66. .navbar-top-links .dropdown-messages, .navbar-top-links .dropdown-tasks, .navbar-top-links .dropdown-alerts{
  67. width:260px;
  68. }
  69. .row-in-br{ border-right:0px; border-bottom:1px solid $border;}
  70. .bg-title{
  71. .breadcrumb{
  72. float:left;
  73. margin-top:0px;
  74. margin-bottom:10px;
  75. }
  76. }
  77. /*Timeline*/
  78. ul.timeline:before {
  79. left: 40px;
  80. }
  81. ul.timeline > li > .timeline-panel {
  82. width: calc(100% - 90px);
  83. width: -moz-calc(100% - 90px);
  84. width: -webkit-calc(100% - 90px);
  85. }
  86. ul.timeline > li > .timeline-badge {
  87. top: 16px;
  88. left: 15px;
  89. margin-left: 0;
  90. }
  91. ul.timeline > li > .timeline-panel {
  92. float: right;
  93. }
  94. ul.timeline > li > .timeline-panel:before {
  95. right: auto;
  96. left: -15px;
  97. border-right-width: 15px;
  98. border-left-width: 0;
  99. }
  100. ul.timeline > li > .timeline-panel:after {
  101. right: auto;
  102. left: -14px;
  103. border-right-width: 14px;
  104. border-left-width: 0;
  105. }
  106. .wizard-steps > li{
  107. display:block;
  108. }
  109. .dropdown .mailbox, .dropdown .dropdown-tasks {
  110. left:-94px;
  111. }
  112. .mega-dropdown-menu{
  113. height:340px;
  114. overflow:auto;
  115. }
  116. .left-aside{
  117. position:relative;
  118. width:100%;
  119. border:0px;
  120. }
  121. .right-aside{
  122. margin-left:0px;
  123. }
  124. .chat-main-box .chat-left-aside{
  125. left:-250px;
  126. transition:0.5s ease-in;
  127. background:$white;
  128. &.open-pnl{
  129. left:0px;
  130. }
  131. .open-panel{
  132. display:block;
  133. }
  134. }
  135. .chat-main-box .chat-right-aside{
  136. margin:0px;
  137. }
  138. /***** Close Update 1.5 *****/
  139. }
  140. @media(max-width:480px) {
  141. .vtabs{
  142. .tabs-vertical{
  143. width:auto;
  144. }
  145. }
  146. .stat-item{padding-right:0px;}
  147. .login-box{
  148. width:100%;
  149. }
  150. }