style-wpcom.scss 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195
  1. /**
  2. * WordPress.com specific styles
  3. *
  4. *
  5. */
  6. /* Variables & Mixins
  7. --------------------------------------------------------------*/
  8. @import "variables/variables-base";
  9. @import "mixins/mixins-base";
  10. /*--------------------------------------------------------------
  11. # Plugins
  12. --------------------------------------------------------------*/
  13. @import "plugins/highlander-comments";
  14. /**
  15. * Stats
  16. */
  17. #wpstats {
  18. display: none;
  19. }
  20. /**
  21. * Ads
  22. */
  23. .wpa .u > div,
  24. .wpadvert > div > * {
  25. background-color: #efefef;
  26. }
  27. /**
  28. * Widgets
  29. */
  30. #secondary {
  31. .time_machine_widget {
  32. position: relative;
  33. .time-machine-post {
  34. width: ( ( 100% / 8 ) * 5 );
  35. margin-left: calc(25%);
  36. }
  37. .time-machine-post-title {
  38. @include font-size(1.125);
  39. font-family: $font__header;
  40. font-weight: 300;
  41. line-height: ($baseline);
  42. word-break: break-word;
  43. margin: ($baseline * .5) 0;
  44. }
  45. .time-machine-navigation {
  46. position: relative;
  47. }
  48. .time-machine-navigation {
  49. @include nav-title();
  50. }
  51. }
  52. .widget_wpcom_social_media_icons_widget ul li a {
  53. padding: 0 3px;
  54. &:before {
  55. font-size: $baseline;
  56. }
  57. }
  58. .widget_authors > ul > li > a {
  59. display: block;
  60. margin-bottom: ($baseline * .5);
  61. img,
  62. strong {
  63. display: inline-block;
  64. vertical-align: middle;
  65. }
  66. }
  67. .widget_recent_entries ul {
  68. margin-bottom: 0;
  69. li {
  70. @include nav-title();
  71. margin-bottom: $mobile-baseline;
  72. }
  73. }
  74. .widget-grofile .grofile-meta h4 {
  75. @include widget-title();
  76. color: $color__link-hover;
  77. margin: 0;
  78. }
  79. .widget_recent_comments {
  80. .recentcommentstexttop,
  81. .recentcommentstextend {
  82. @include nav-title();
  83. }
  84. }
  85. .aboutme_widget h2 {
  86. clear: inherit;
  87. }
  88. #flickr_badge_wrapper {
  89. border: $color__border-transparent;
  90. }
  91. }
  92. @include breakpoint(tablet) {
  93. #secondary {
  94. .widget_author_grid > ul,
  95. .widget_flickr > table,
  96. .widget_recent_images .recent_images,
  97. .jetpack_widget_social_icons .jetpack-social-widget-list {
  98. @include gutter-width( ( 100% / 8 ) * 5 );
  99. }
  100. .time_machine_widget {
  101. .time-machine-post {
  102. width: ( ( 100% / 8 ) * 5 );
  103. margin-left: calc(25%);
  104. }
  105. .time-machine-navigation {
  106. position: absolute;
  107. top: ($baseline * 1.5);
  108. left: ($gutter * .5);
  109. }
  110. .time-machine-navigation {
  111. @include nav-title();
  112. }
  113. }
  114. .widget_jetpack_my_community > * {
  115. margin-left: 25%;
  116. @include gutter-width( ( 100% / 8 ) * 5 );
  117. }
  118. .widget-grofile {
  119. padding-left: 25%;
  120. position: relative;
  121. .grofile-meta {
  122. @include gutter-width( 60% );
  123. h4 {
  124. position: absolute;
  125. left: 0;
  126. @include gutter-width( 25% );
  127. }
  128. }
  129. .grofile-thumbnail {
  130. @include gutter-width( 40% );
  131. }
  132. }
  133. .widget_recent_comments {
  134. .recentcommentsavatar {
  135. @include gutter-width( ( 100% / 8 ) * 5 );
  136. }
  137. }
  138. .wp_widget_tag_cloud > *:not(.widget-title),
  139. .wp_widget_tag_cloud > div {
  140. @include gutter-width( ( 100% / 8 ) * 5 );
  141. }
  142. }
  143. }