roleplay.css/scss/_definitions.scss

/* --- 01. DEFINITIONS --- */

/*
 * Les définitions globales de la stylesheet.
 * Elle permette de rapidement modifier le style globale de la fiche en modifiant les éléments centraux
 * D'autres définitions importantes sont visibles dans les autres parties de la fiche.
 *
 * Pour customiser les couleurs, voyez _palette.scss
 */

// A modifier pour customiser le style facilement :

$large-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
$narrow-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
$inset-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0.2);
$inset-shadow-inverted: inset 0px 2px 0px rgba(0, 0, 0, 0.2);
$inset-relief: inset 0px 2px 0px rgba(255, 255, 255, 0.1);

$border-radius: 3px;
$border-size: 1px;

$baseline: 1.5;
$baselinerem: $baseline * 1rem;
$baseheight: 18px;

// MIXINS RESPONSIVES

// Small tablets and large smartphones (landscape view)
$screen-sm-min: 576px;

// Small tablets (portrait view)
$screen-md-min: 768px;

// Tablets and small desktops
$screen-lg-min: 992px;

// Large tablets and desktops
$screen-xl-min: 1200px;

// Very large desktops
$screen-xxl-min: 1600px;


// Small devices
@mixin sm {
   @media (min-width: #{$screen-sm-min}) {
       @content;
   }
}

// Medium devices
@mixin md {
   @media (min-width: #{$screen-md-min}) {
       @content;
   }
}

// Large devices
@mixin lg {
   @media (min-width: #{$screen-lg-min}) {
       @content;
   }
}

// Extra large devices
@mixin xl {
   @media (min-width: #{$screen-xl-min}) {
       @content;
   }
}

// Extra large desktops
@mixin xxl {
   @media (min-width: #{$screen-xxl-min}) {
       @content;
   }
}

// Custom devices
@mixin rwd($screen) {
   @media (min-width: $screen+'px' ) {
      @content;
   }
}

// MIXINS AUTRES

@mixin borders() {
  border: $border-size solid rgba(0, 0, 0, 0.3);
}

@mixin border-radius() {
  border-radius: $border-radius $border-radius $border-radius $border-radius;
}

@mixin border-radius-top($value) {
    border-top-left-radius: $value;
    border-top-right-radius: $value;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

@mixin border-radius-bottom($value) {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: $value;
    border-bottom-right-radius: $value;
}

@mixin border-radius-left($value) {
    border-top-left-radius: $value;
    border-top-right-radius: 0;
    border-bottom-left-radius: $value;
    border-bottom-right-radius: 0;
}

@mixin border-radius-right($value) {
    border-top-left-radius: 0;
    border-top-right-radius: $value;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: $value;
}

/* 01.1 - Commons elements */

@mixin li-no-margin() {
  li {
    margin: 0;
  }
}

.no-pills {
	list-style:none;
}

.align {
  &-center {text-align: center;}
  &-left {text-align: left;}
  &-right {text-align: right;}
}

h1, h2, h3, h4, h5, h6, h7, h8, h9, h10  {
	color:white;
	text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4);
}