SHARE
TWEET

Theme CSS

ShowStopperMatrix Jun 4th, 2015 205 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /*
  2. DEFAULT STYLES FOR THIS THEME
  3. */
  4. @constants
  5. {
  6.  
  7.  
  8.   /*
  9.   PAGE WIDTHS & BACKGROUND COLOR
  10.   Specify the top bar wrapper width (which contains the mini menu, logo, and main menu
  11.   by default), the footer width, and the width of left & right-side columns.
  12.   */
  13.   theme_topbar_width: 100%;
  14.   theme_topbar_minimenu_width: 950px;
  15.   theme_topbar_logo_width: 950px;
  16.   theme_topbar_menu_width: 950px;
  17.   theme_footer_width: 930px;
  18.   theme_content_width: 950px;
  19.   theme_content_columns_left_width: 190px;
  20.   theme_content_columns_right_width: 190px;
  21.   theme_body_background_color: #192121;
  22.  
  23.   /*
  24.   HEADER AND FOOTER COLORS
  25.   These values are only used to style the site-wide header and footer.
  26.   */
  27.   theme_topbar_background_color: #e9f4fa;
  28.   theme_topbar_menu_background_color: #1A3D3B;
  29.   theme_topbar_menu_background_color_hover: transparent;
  30.   theme_topbar_menu_link_color: #fff;
  31.   theme_topbar_menu_link_decoration: none;
  32.   theme_topbar_menu_link_hover_color: #fff;
  33.   theme_topbar_menu_link_hover_decoration: underline;
  34.   theme_topbar_menu_link_size: 1.3em;
  35.   theme_topbar_menu_link_background_color: transparent;
  36.   theme_topbar_menu_link_background_color_hover: transparent;
  37.   theme_topbar_menu_border: 1px solid #89a4b3;
  38.   theme_topbar_minimenu_background_color: #fff;
  39.   theme_topbar_minimenu_border: 2px solid #d7e7f0;
  40.   theme_topbar_minimenu_link_size: .7em;
  41.   theme_topbar_minimenu_link_color: #999;
  42.   theme_topbar_minimenu_link_hover_color: #FFF;
  43.   theme_topbar_minimenu_link_hover_decoration: none;
  44.   theme_topbar_minimenu_link_hover_background_color: #233B3B;
  45.   theme_topbar_border: 0px solid transparent;
  46.  
  47.   /*
  48.   TEXT & LINKS
  49.   These values affect the size and colors of your text and links throughout your layout.
  50.   */
  51.   theme_font_family: arial, helvetica, sans-serif;
  52.   theme_font_size: 10pt;
  53.   theme_font_color: #c4c4c4;
  54.   theme_font_color_light: #8D8D8D;
  55.   theme_text_align: left;
  56.   theme_link_color: #5ab2b5;
  57.   theme_link_color_hover: #FFFFFF;
  58.   theme_link_decoration: none;
  59.   theme_link_decoration_hover: none;
  60.   theme_link_alt_color: #ed6321;
  61.   theme_headline_color: #FFFFFF;
  62.   theme_headline_size_large: 1.5em;
  63.   theme_headline_size_medium: 1.1em;
  64.  
  65.   /*
  66.   BORDER COLORS
  67.   These colors are mostly applied to borders that separate items in lists of content.
  68.   */
  69.   theme_border_color: #21322D;
  70.   theme_border_medium_color: #171717;
  71.   theme_border_dark_color: #262626;
  72.  
  73.   /*
  74.   WIDGET BOX BORDER COLORS
  75.   These colors are applied to borders around or within boxes that have a background color,
  76.   like widgets.
  77.   */
  78.   theme_foreground_border_color: #1E2C28;
  79.   theme_foreground_border_color_light: #212E2B;
  80.   theme_foreground_background_color: transparent;
  81.  
  82.   /*
  83.   INPUT FIELDS AND BUTTONS
  84.   These values style input fields and buttons that appear throughout the layout.
  85.   */
  86.   theme_input_background_color: #0C1211;
  87.   theme_select_background_color: #1E2D2A;
  88.   theme_input_font_color: #c4c4c4;
  89.   theme_select_font_color: #DFDFDF;
  90.   theme_input_border_colors: #000 #18221F #20312C #18221F;
  91.   theme_select_border_colors: #283832 #000 #000 #18221F;
  92.   theme_button_background_color: #f26522;
  93.   theme_button_background_color_hover: #F6651C;
  94.   theme_button_font_color: #fff;
  95.   theme_button_border_color: #ee6321;
  96.  
  97.   /*
  98.   PHOTO BORDERS
  99.   These colors are applied to the borders drawn around most images and thumbnails.
  100.   */
  101.   theme_photo_border_color: transparent;
  102.   theme_photo_border_color_hover: #233934;
  103.  
  104.   /*
  105.   FORMS
  106.   These colors are applied to most forms throughout the layout.
  107.   */
  108.   theme_form_border_color: #000;
  109.   theme_form_background_color: #f4f9fb;
  110.   theme_form_label_font_color: #777;
  111.  
  112.   /*
  113.   TABS (BUTTON-STYLE)
  114.   These colors are applied to the button-style tab menus which are often shown
  115.   on browse pages.
  116.   */
  117.   theme_buttontabs_font_color: #777;
  118.   theme_buttontabs_font_color_hover: #fff;
  119.   theme_buttontabs_font_color_active: #fff;
  120.   theme_buttontabs_background_color: rgba(0,0,0,.35);
  121.   theme_buttontabs_background_color_hover: #132E2C;
  122.   theme_buttontabs_background_color_active: rgba(0,0,0,.45);
  123.  
  124.   /*
  125.   TABS
  126.   These colors are applied to tab menus (as seen on several pages, including
  127.   the member profile page).
  128.   */
  129.   theme_tabs_background_color: #e9f4fa;
  130.   theme_tabs_border_color: #cad9e1;
  131.   theme_tabs_border_color_hover: #cad9e1;
  132.   theme_tabs_font_color: #838e9a;
  133.   theme_tabs_font_color_active: #fff;
  134.   theme_tabs_background_color_active: #263836;
  135.   theme_tabs_background_color_hover: #263836;
  136.  
  137.   /*
  138.   LISTS
  139.   These colors are applied to some lists, especially in pull-down menus.
  140.   */
  141.   theme_list_background_color: #17302B;
  142.   theme_list_background_color_alt: #142825;
  143.   theme_list_background_color_hover: #172D2A;
  144.  
  145.   /*
  146.   TAGS
  147.   These colors are applied to tags, which appear on blogs, messages, etc.
  148.   */
  149.   theme_tag_background_color: #1B312E;
  150.  
  151.   /*
  152.   INLINE PULLDOWN MENUS
  153.   These colors style the inline pulldown menus that appear throughout the layout.
  154.   */
  155.   theme_pulldown_background_color: #142321;
  156.   theme_pulldown_background_color_hover: #233B3B;
  157.   theme_pulldown_background_color_active: #233B3B;
  158.   theme_pulldown_font_color_active: #fff;
  159.   theme_pulldown_border_color: #162925;
  160.   theme_pulldown_contents_background_color: transparent;
  161.   theme_pulldown_contents_list_background_color_hover: #121F1F;
  162.   theme_pulldown_contents_list_background_color_active: #1C3232;
  163. }
  164.  
  165.  
  166.  
  167.  
  168.  
  169.  
  170.  
  171.  
  172.  
  173.  
  174.  
  175. /* Global member photos and icons */
  176. img.main
  177. {
  178.   max-width: 720px;
  179.   max-height: 720px;
  180. }
  181. img.thumb_normal
  182. {
  183.   max-width: 140px;
  184.   max-height: 160px;
  185. }
  186. img.thumb_profile
  187. {
  188.   max-width: 200px;
  189.   max-height: 400px;
  190. }
  191. img.thumb_icon
  192. {
  193.   width: 48px;
  194.   height: 48px;
  195. }
  196. img.main,
  197. img.thumb_normal,
  198. img.thumb_profile,
  199. img.thumb_icon
  200. {
  201.   border: none;
  202. }
  203.  
  204. /*
  205. GLOBAL MIXINS
  206. These groups of styles called "mixins" are included in other
  207. classes throughout the stylesheet.
  208. */
  209.  
  210. /* Gives an element a background and/or border */
  211. =foreground
  212. {
  213.   background-color: $theme_foreground_background_color;
  214.   background-image: url(images/ss_foreground_bg.png);
  215.   background-repeat: repeat;
  216. }
  217.  
  218. /* Gives an element a drop shadow */
  219. =shadow($offset_x = 0, $offset_y = 0, $blur_radius = 0, $spread_radius = 0, $shadow_color = "#aaa")
  220. {
  221.   -moz-box-shadow: $offset_x $offset_y $blur_radius $spread_radius $shadow_color;
  222.   -webkit-box-shadow: $offset_x $offset_y $blur_radius $spread_radius $shadow_color;
  223.   box-shadow: $offset_x $offset_y $blur_radius $spread_radius $shadow_color;
  224. }
  225.  
  226. /* Gives an element rounded corners. */
  227. =rounded($radius = 6px, $hidecorner1 = false, $hidecorner2 = false, $hidecorner3 = false, $hidecorner4 = false)
  228. {
  229.   -moz-border-radius: $radius;
  230.   -webkit-border-radius: $radius;
  231.   border-radius: $radius;
  232.  
  233.   @if($hidecorner1 == true)
  234.   {
  235.     -moz-border-radius-topleft: 0px;
  236.     -webkit-border-top-left-radius: 0px;
  237.     border-top-left-radius: 0px;
  238.   }
  239.   @if($hidecorner2 == true)
  240.   {
  241.     -moz-border-radius-topright: 0px;
  242.     -webkit-border-top-right-radius: 0px;
  243.     border-top-right-radius: 0px;
  244.   }
  245.   @if($hidecorner3 == true)
  246.   {
  247.     -moz-border-radius-bottomright: 0px;
  248.     -webkit-border-bottom-right-radius: 0px;
  249.     border-bottom-right-radius: 0px;
  250.   }
  251.   @if($hidecorner4 == true)
  252.   {
  253.     -moz-border-radius-bottomleft: 0px;
  254.     -webkit-border-bottom-left-radius: 0px;
  255.     border-bottom-left-radius: 0px;
  256.   }
  257. }
RAW Paste Data
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
 
Top