Class: Playbook::PbOverlay::Overlay

Inherits:
KitBase
  • Object
show all
Defined in:
app/pb_kits/playbook/pb_overlay/overlay.rb

Constant Summary

Constants included from Playbook::PositionPropsCss

Playbook::PositionPropsCss::POSITION_VALUES

Instance Attribute Summary

Attributes included from Playbook::Props

#values

Instance Method Summary collapse

Methods inherited from KitBase

#combined_html_options, #global_inline_props, #object, #pb_content_tag

Methods included from MaxHeight

included, #max_height_options, #max_height_props, #max_height_values

Methods included from MinHeight

included, #min_height_options, #min_height_props, #min_height_values

Methods included from Height

#height_options, #height_props, #height_values, included

Methods included from VerticalAlign

included, #vertical_align_options, #vertical_align_props, #vertical_align_values

Methods included from Bottom

#bottom_options, #bottom_values, included

Methods included from Playbook::PositionPropsCss

#positioning_css

Methods included from Right

included, #right_options, #right_values

Methods included from Top

included, #top_options, #top_values

Methods included from Left

included, #left_options, #left_values

Methods included from Truncate

included, #truncate_options, #truncate_props, #truncate_values

Methods included from Overflow

included, #overflow_options, #overflow_props, #overflow_values

Methods included from TextAlign

included, #text_align_options, #text_align_props, #text_align_values

Methods included from BorderRadius

#border_radius_options, #border_radius_props, #border_radius_values, included

Methods included from Hover

#hover_attributes, #hover_background_values, #hover_color_values, #hover_options, #hover_props, #hover_scale_values, #hover_shadow_values, #hover_underline_values, #hover_values, included

Methods included from Playbook::Position

included, #position_options, #position_values

Methods included from Order

included, #order_options, #order_props, #order_values

Methods included from FlexShrink

#flex_shrink_options, #flex_shrink_props, #flex_shrink_values, included

Methods included from FlexGrow

#flex_grow_options, #flex_grow_props, #flex_grow_values, included

Methods included from Flex

#flex_options, #flex_props, #flex_values, included

Methods included from AlignSelf

#align_self_options, #align_self_props, #align_self_values, included

Methods included from AlignContent

#align_content_options, #align_content_props, #align_content_values, included

Methods included from AlignItems

#align_items_options, #align_items_props, #align_items_values, included

Methods included from JustifySelf

included, #justify_self_options, #justify_self_props, #justify_self_values

Methods included from JustifyContent

included, #justify_content_options, #justify_content_props, #justify_content_values

Methods included from FlexWrap

#flex_wrap_options, #flex_wrap_props, #flex_wrap_values, included

Methods included from FlexDirection

#flex_direction_options, #flex_direction_props, #flex_direction_values, included

Methods included from Cursor

#cursor_options, #cursor_props, #cursor_values, included

Methods included from Display

#display_options, #display_props, #display_size_values, #display_values, included

Methods included from LineHeight

included, #line_height_options, #line_height_props, #line_height_values

Methods included from Shadow

included, #shadow_options, #shadow_props, #shadow_values

Methods included from NumberSpacing

included, #number_spacing_options, #number_spacing_values

Methods included from ZIndex

included, #screen_size_values, #z_index_options, #z_index_props, #z_index_values

Methods included from Spacing

#break_method_values, #filter_classname, #gap_options, #gap_props, #gap_values, included, #max_width_options, #max_width_props, #max_width_values, #min_width_options, #min_width_props, #min_width_values, #screen_size_values, #spacing_options, #spacing_props, #spacing_values, #width_options, #width_props, #width_values

Methods included from Classnames

#generate_classname, #generate_classname_without_spacing, included

Methods included from Playbook::Props

#initialize, #prop

Methods included from Playbook::PbKitHelper

#pb_rails

Methods included from Playbook::PbFormsHelper

#pb_form_with

Instance Method Details

#classnameObject

[View source]

16
17
18
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 16

def classname
  generate_classname("pb_overlay", hide_scroll_bar_class)
end

#color_mapObject

[View source]

104
105
106
107
108
109
110
111
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 104

def color_map
  {
    "card_light": "#fff",
    "bg_light": "#F3F7FB",
    "card_dark": "#231E3D",
    "bg_dark": "#0a0527",
  }
end

#data_attributesObject

[View source]

113
114
115
116
117
118
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 113

def data_attributes
  data ||= {}
  data.merge!("data-pb-overlay" => true)
  data.merge!("data-overlay-dynamic" => true) if dynamic
  data
end

#has_subsequent_overlayObject

[View source]

100
101
102
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 100

def has_subsequent_overlay
  position == "x".to_sym || position == "y".to_sym
end

#hide_scroll_bar_classObject

[View source]

120
121
122
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 120

def hide_scroll_bar_class
  scroll_bar_none ? " overlay-hide-scrollbar" : ""
end

#is_size_percentageObject

[View source]

28
29
30
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 28

def is_size_percentage
  size.include?("%")
end

#positionObject

[View source]

20
21
22
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 20

def position
  layout.keys[0]
end

#previous_overlayObject

[View source]

32
33
34
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 32

def previous_overlay
  "linear-gradient(#{previous_overlay_direction}, #{color_map[color.to_sym]} 0%, transparent #{size})"
end

#previous_overlay_class_nameObject

[View source]

40
41
42
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 40

def previous_overlay_class_name
  "overlay_#{color}_#{previous_overlay_direction_token}_#{size}"
end

#previous_overlay_directionObject

[View source]

48
49
50
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 48

def previous_overlay_direction
  previous_overlay_direction_map[position.to_sym]
end

#previous_overlay_direction_mapObject

[View source]

64
65
66
67
68
69
70
71
72
73
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 64

def previous_overlay_direction_map
  {
    "bottom": "to top",
    "top": "to bottom",
    "left": "to right",
    "right": "to left",
    "x": "to right",
    "y": "to top",
  }
end

#previous_overlay_direction_map_tokenObject

[View source]

86
87
88
89
90
91
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 86

def previous_overlay_direction_map_token
  {
    "x": "left",
    "y": "top",
  }
end

#previous_overlay_direction_tokenObject

[View source]

56
57
58
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 56

def previous_overlay_direction_token
  has_subsequent_overlay ? previous_overlay_direction_map_token[position.to_sym] : position
end

#sizeObject

[View source]

24
25
26
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 24

def size
  layout.values[0]
end

#subsequent_overlayObject

[View source]

36
37
38
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 36

def subsequent_overlay
  "linear-gradient(#{subsequent_overlay_direction}, #{color_map[color.to_sym]} 0%, transparent #{size})"
end

#subsequent_overlay_class_nameObject

[View source]

44
45
46
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 44

def subsequent_overlay_class_name
  "overlay_#{color}_#{subsequent_overlay_direction_token}_#{size}"
end

#subsequent_overlay_directionObject

[View source]

52
53
54
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 52

def subsequent_overlay_direction
  subsequent_overlay_direction_map[position.to_sym]
end

#subsequent_overlay_direction_mapObject

[View source]

75
76
77
78
79
80
81
82
83
84
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 75

def subsequent_overlay_direction_map
  {
    "bottom": "to top",
    "top": "to bottom",
    "left": "to right",
    "right": "to left",
    "x": "to left",
    "y": "to bottom",
  }
end

#subsequent_overlay_direction_map_tokenObject

[View source]

93
94
95
96
97
98
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 93

def subsequent_overlay_direction_map_token
  {
    "x": "right",
    "y": "bottom",
  }
end

#subsequent_overlay_direction_tokenObject

[View source]

60
61
62
# File 'app/pb_kits/playbook/pb_overlay/overlay.rb', line 60

def subsequent_overlay_direction_token
  has_subsequent_overlay ? subsequent_overlay_direction_map_token[position.to_sym] : position
end