aboutsummaryrefslogtreecommitdiff
path: root/src/main/scala/reading/component/index/style/Header.scala
blob: 643dd8e15611708b48c9be98ef7ad03c719f3568 (plain)
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
73
74
75
76
77
78
79
80
package reading.component.index.style

import scalacss.Defaults._

import reading.Media
import reading.component.style.{ Color => C }

object Header extends StyleSheet.Inline {
  import dsl._

  val header = style(
    Media.desktop(margin(40.px)),
    Media.mobile(margin(30.px))
  )

  val showFiltersMenu = style(
    Media.desktop(display.none),
    Media.mobile(
      display.flex,
      justifyContent.center,
      alignItems.center,
      width(100.%%),
      backgroundColor(C.englishWalnut.value),
      color(C.white.value),
      border(1.px, solid, C.congoBrown.value),
      borderRadius(4.px),
      marginBottom(20.px),
      padding(10.px, 0.px),
      cursor.pointer
    )
  )

  val filtersCount = style(
    Count.count
  )

  val filters = style(
    display.flex,
    marginBottom(30.px),
    Media.mobile(display.none)
  )

  private val box = style(
    display.flex,
    alignItems.center,
    padding(15.px),
    marginRight(20.px),
    borderRadius(2.px),
    border(1.px, solid, C.gray.lighten(80).value),
    fontSize(18.px),
    &.hover(cursor.pointer)
  )

  val clear = style(
    box,
    backgroundColor(C.mickado.value),
    color(C.white.value),
    &.hover(backgroundColor(C.mickado.lighten(20).value))
  )

  val filter = style(
    box,
    &.hover(borderColor(C.gray.lighten(50).value))
  )

  val name = style(
    marginRight(10.px)
  )

  val cross = style(
    width(15.px),
    height(15.px)
  )

  val booksCount = style(
    fontSize(20.px),
    color(C.gray.value),
    Media.mobile(textAlign.center)
  )
}