nodebb-theme-ror
Version:
NodeBB theme (styling, custom templates) for RoR gaming clan.
221 lines (168 loc) • 6.75 kB
text/less
@import "../nodebb-theme-persona/theme";
@import url(https://fonts.googleapis.com/css?family=Lato:400,400italic,700,700italic);
@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:400,400italic,700,700italic);
// Variables
// --------------------------------------------------
/* Largely based off Flatly 3.3.6 */
//== Colors
//
//## Gray and brand colors for use across Bootstrap.
@gray-base: #000;
@gray-darker: lighten(@gray-base, 13.5%); // #222
@gray-dark: lighten(@gray-base, 20%); // #333
@gray: lighten(@gray-base, 33.5%); // #555
@gray-light: lighten(@gray-base, 46.7%); // #777
@gray-lighter: lighten(@gray-base, 93.5%); // #eee
@brand-primary: #1454A1;
@brand-success: #1454A1;
@brand-info: #3498DB;
@brand-warning: #F39C12;
@brand-danger: #E74C3C;
//== Scaffolding
//
//## Settings for some of the most global styles.
//** Background color for `<body>`.
@body-bg: #fff;
//** Global text color on `<body>`.
@text-color: #000
//** Global textual link color.
@link-color: @brand-success;
//** Link hover color set via `darken()` function.
@link-hover-color: @link-color;
//** Link hover decoration.
@link-hover-decoration: underline;
//== Typography
//
//## Font, line-height, and color for body text, headings, and more.
@font-family-sans-serif: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-size-base: 16px;
@font-size-large: ceil((@font-size-base * 1.25));
@font-size-small: ceil((@font-size-base * 0.85));
@font-size-h1: floor((@font-size-base * 2.6));
@font-size-h2: floor((@font-size-base * 2.15));
@font-size-h3: ceil((@font-size-base * 1.7));
@font-size-h4: ceil((@font-size-base * 1.25));
@font-size-h5: @font-size-base;
@font-size-h6: ceil((@font-size-base * 0.85));
//** Unit-less `line-height` for use in components like buttons.
@line-height-base: 1.428571429; // 20/14
//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
@line-height-computed: floor((@font-size-base * @line-height-base)); // ~20px
//** By default, this inherits from the `<body>`.
@headings-font-family: @font-family-base;
@headings-font-weight: 400;
@headings-line-height: 1.1;
@headings-color: inherit;
//== Components
//
//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
@border-radius-base: 0px;
@border-radius-large: 6px;
@border-radius-small: 3px;
//== Buttons
//
//## For each of Bootstrap's buttons, define text, background and border color.
@btn-font-weight: normal;
@btn-default-color: #fff;
@btn-default-bg: @gray;
@btn-default-border: @btn-default-bg;
@btn-primary-color: @btn-default-color;
@btn-primary-bg: @brand-primary;
@btn-primary-border: @btn-primary-bg;
@btn-success-color: @btn-default-color;
@btn-success-bg: @brand-success;
@btn-success-border: @btn-success-bg;
@btn-info-color: @btn-default-color;
@btn-info-bg: @brand-info;
@btn-info-border: @btn-info-bg;
@btn-warning-color: @btn-default-color;
@btn-warning-bg: @brand-warning;
@btn-warning-border: @btn-warning-bg;
@btn-danger-color: @btn-default-color;
@btn-danger-bg: @brand-danger;
@btn-danger-border: @btn-danger-bg;
@btn-link-disabled-color: @gray-light;
// Allows for customizing button radius independently from global border radius
@btn-border-radius-base: @border-radius-base;
@btn-border-radius-large: @border-radius-large;
@btn-border-radius-small: @border-radius-small;
//== Navbar
//
//##
// Basics of a navbar
@navbar-height: 44px;
@navbar-margin-bottom: @line-height-computed;
@navbar-border-radius: @border-radius-base;
@navbar-padding-horizontal: floor((@grid-gutter-width / 2));
@navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2);
@navbar-collapse-max-height: 340px;
@navbar-default-color: #000;
@navbar-default-bg: #fff;
@navbar-default-border: transparent;
// Navbar links
@navbar-default-link-color: #000;
@navbar-default-link-hover-color: @brand-success;
@navbar-default-link-hover-bg: transparent;
@navbar-default-link-active-color: #000;
@navbar-default-link-active-bg: darken(@navbar-default-bg, 10%);
@navbar-default-link-disabled-color: #ccc;
@navbar-default-link-disabled-bg: transparent;
// Navbar brand label
@navbar-default-brand-color: @navbar-default-link-color;
@navbar-default-brand-hover-color: @navbar-default-link-hover-color;
@navbar-default-brand-hover-bg: transparent;
// Navbar toggle
@navbar-default-toggle-hover-bg: darken(@navbar-default-bg, 10%);
@navbar-default-toggle-icon-bar-bg: #000;
@navbar-default-toggle-border-color: darken(@navbar-default-bg, 10%);
// Styles
// --------------------------------------------------
/* NOTE: For proper overrides, all styles should be re-applied in the admin
"Custom CSS" section. So you can't use LESS, really. We just define styles here
to benefit from Git's version control. */
html, body {
height: 100%;
}
body {
background-image: linear-gradient(#EEE, #FFF 20%);
background-color: #FFF;
-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 {
font-family: "Josefin Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 700;
}
.navbar.navbar-fixed-top {
box-shadow: 0 1px 2px 0 rgba(34,36,38,.15);
}
.navbar-brand.forum-title {
display: none;
}
.navbar-nav>li>a {
padding-top: 14px;
padding-bottom: 14px;
}
.btn {
font-family: "Josefin Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: .8em;
font-weight: bold;
text-transform: uppercase;
}
.categories>li .content h2,
.category>ul>li .content h2 {
font-size: 26px;
line-height: 38px;
}
.categories>li .content h2 a,
.category>ul>li .content h2 a {
color: #000;
}
.categories>li small,
.categories>li .card p, .category>ul>li .card p {
font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.categories>li .card, .category>ul>li .card {
font-size: 14px;
height: 74px;
line-height: 18px;
}