FEM-SinglePriceGridComponent/styles.css at master · g4gr-dev/FEM-SinglePriceGridComponent · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
@charset 'UTF-8' ;

@layer Reset, Base ;
@layer Header ;
@layer Aside ;
@layer Main ;
@layer Footer ;
@layer MediaQuery ;

:root {
  /* Layout */
  --l_maxWidth : 1440px ;
  --l_minWidth : 375px ;

  /* Fonts */
  --f_fontSize : 16px ;
  --f_lineHeight : 1.5 ;
  --f_fontStyle : normal ;
  --f_fontWeight : 400 ;
  --f_fontFamily : "" ;

  /* Colors */
}

/* --- Reset --- */
@layer Reset {
  * {
    margin : 0 ;
    padding : 0 ;
  }
}

/* --- Base --- */
@layer Base {
  html {
    font-size : var( --f_fontSize ) ;
    font-family : var( --f_fontFamily ) ;
  }

  .Body {
    max-width : var( --l_maxWidth , 1440px ) ;
    margin-inline : auto ;

    font-size : clamp( 100% , .75rem + .75vw , 25px ) ;
    line-height: var( --f_lineHeight ) ;
    font-style : var( --f_fontStyle ) ;
    font-weight : var( --f_fontWeight ) ;
  }
}

/* --- Header --- */
@layer Header {
  .Header {}
}

/* --- Aside --- */
@layer Aside {
  .Aside {}
}

/* --- Main --- */
@layer Main {
  .Main {}
}

/* --- Footer --- */
@layer Footer {
  .Footer {}
}

/* --- MediaQuery --- */
@layer MediaQuery {}