Advertisement
Guest User

/r/abcqwerty123 concept by /u/mos_6502.

a guest
Aug 1st, 2014
26
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 4.19 KB | None | 0 0
  1. /* Note: this is a rough implementation of my POC. It should work, but some aspects may not.
  2.  * To get rid of those linear gradients, you'll have to remove them from the stylesheet before applying this.
  3.  * Otherwise the CSS won't appear on those elements.
  4.  
  5.  * Here's a link to the imgur album: https://imgur.com/a/8nQsh#0
  6.  
  7.  * Also, I dunno if the CSS that changes the link color is in here, and i'm too tired to check :P
  8.  
  9.  * Anyways, enjoy! I hope it helps, and gives you some ideas. I'll happily work on it further if you decide
  10.  * that you like my concept.
  11.  
  12.  *<3, /u/mos_6502
  13.  */
  14.  
  15. .pagename a {
  16. /* Change color to dark blue. */
  17. color: #3333D6;
  18. font-size: 38px;
  19. /* Give a nice hard black edge, as well as a nice orange glow behind the lettering. */
  20. text-shadow: 1px 1px 0px #000052,3px 3px 5px orange;
  21. position: relative;
  22. bottom: 52px;
  23. left: 125px;
  24. }
  25.  
  26. .flair, .linkflairlabel {
  27. display: inline-block;
  28. margin-right: .5em;
  29. padding: 0 2px;
  30. background: #f5f5f5;
  31. color: #555;
  32. border: 1px solid #ddd;
  33. /* Very minor change to border-radius, to make flair have a more rounded edge.
  34.  * The previous version had such a slight roundedness that it looked almost square, which is
  35.  * a little hard on the eyes, IMO.
  36.  */
  37. border-radius: 3.5px;
  38. }
  39.  
  40. #header-bottom-left {
  41. height: 27px;
  42. width: auto;
  43. /* Change to a soft, flat blue that fits with the flat/minimalist design of the rest of the sub. */
  44. background-color: #4848B4;
  45. text-align: center;
  46. bottom: 0!important;
  47. position: absolute;
  48. padding-right: 1000%;
  49. }
  50.  
  51. #header-bottom-right {
  52. /* Match the edits made above. */
  53. background-color: #4848B4;
  54. border-top: 0 solid #000;
  55. border-left: 1px solid #000 height:24px;
  56. width: auto;
  57. padding: 0 15px 0 0!important;
  58. bottom: 0;
  59. border-radius: 0;
  60. font-family: Arial,sans-serif;
  61. font-size: 11px;
  62. font-weight: bold;
  63. line-height: 24px;
  64. text-transform: uppercase;
  65. color: #444;
  66. position: absolute;
  67. top: auto!important;
  68. bottom: 0!important;
  69. z-index: 96;
  70. }
  71.  
  72. .user .userkarma {
  73. /* Turn karma indicator orange, because it looks nice. */
  74. cursor: help;
  75. font-weight: bold;
  76. border-bottom: 1px dotted gray;
  77. color: orange;
  78. }
  79.  
  80. .titlebox .usertext .md>h3 {
  81. font-size: 16px;
  82. background-color: #3333D6;
  83. color: white;
  84. text-shadow: 0 1px 0 rgb(16,59,128);
  85. height: 26px;
  86. border-bottom: 1px solid rgb(16,59,128);
  87. margin: 10px 8px 5px -21px;
  88. padding: 8px 0 0 32px;
  89. font-weight: bold;
  90. position: relative;
  91. box-shadow: 4px 4px 2px -3px #414141;
  92. -moz-box-shadow: 4px 4px 2px -3px #414141;
  93. -webkit-box-shadow: 4px 4px 2px -3px #414141;
  94. }
  95.  
  96. /* Change how borders look on posts in the frontpage. */
  97. .linklisting {
  98. margin-left: 15px;
  99. border-top: 1px solid #A9A9EE;
  100. margin-right: 340px;
  101. border-top:none;
  102. }
  103.  
  104. .content #siteTable .link {
  105. margin-bottom: 0px;
  106. padding-top: 11px;
  107. padding-bottom: 11px;
  108. border-bottom: 1px solid #A9A9EE;
  109. border-left: none;
  110. border-right: none;
  111. }
  112.  
  113.  
  114. /* End change borders */
  115.  
  116. /* Remove borders from the sidebar */
  117. .side {
  118. background: transparent;
  119. /* No border = clean and spacious looking :) */
  120. border: none;
  121. }
  122.  
  123. /* Change title color to soft blue */
  124. .thing .title, .thing .title :link {
  125. color: #7070E2;
  126. font-weight: normal;
  127. }
  128.  
  129.  
  130. /* Change footer appearance */
  131.  
  132. .footer{
  133. border: none;
  134. }
  135.  
  136. /* Change border color. */
  137. .footer .col {
  138. float: left;
  139. margin: 10px 0;
  140. padding: 0 15px;
  141. border-left: 1px solid #A9A9EE;
  142. height: 9.5em;
  143. }
  144.  
  145. /* End change footer appearance */
  146.  
  147. /* Flatter network box. */
  148. .side .md [href="/box1"] {
  149. display: inline-block;
  150. height: 30px;
  151. width: 366px;
  152. content: "See more of the abcqwerty123 network";
  153. color: black;
  154. font-size: 16px;
  155. font-weight: normal;
  156. text-align: center;
  157. padding-top: 3px;
  158. background-color: #AEAEAE;
  159. border-top: 2px #bebebe;
  160. border-left: 2px #bebebe;
  161. border-right: 2px #bebebe;
  162. border-bottom: 2px #bebebe;
  163. position: absolute!important;
  164. pointer-events: none;
  165. z-index: 2010;
  166. top: 22px!important;
  167. right: 0px;
  168. }
  169.  
  170. .side .md [href="/box2"] {
  171. display: inline-block;
  172. pointer-events: none;
  173. height: 54px;
  174. width: 366px;
  175. content: "";
  176. color: black;
  177. background-color: #C4C4C4;
  178. border-top: 2px;
  179. border-left: 2px;
  180. border-right: 2px;
  181. border-bottom: 2px;
  182. position: absolute!important;
  183. z-index: 2010;
  184. top: 44px!important;
  185. right: 0px;
  186. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement