yumemi - v0.11.8

framework/front/css

Types

Animation

</> 
pub type Animation {
  Fade
  SlideUp
  Pulse
}

Constructors 

  • Fade
  • SlideUp
  • Pulse

BorderEdge

</> 
pub type BorderEdge {
  AllEdges
  BottomEdge
}

Constructors 

  • AllEdges
  • BottomEdge

BorderStyle

</> 
pub type BorderStyle {
  Solid
  Dashed
  Dotted
}

Constructors 

  • Solid
  • Dashed
  • Dotted

BoxSizing

</>

箱の寸法の数え方(box-sizing)。BorderBox は width・min-height に padding と border を含める ── min-height: 48px と padding を持つ入力が 48px のまま出る。

pub type BoxSizing {
  BorderBox
  ContentBox
}

Constructors 

  • BorderBox
  • ContentBox

Breakpoint

</> 
pub type Breakpoint {
  SP
  PC
  Tablet
}

Constructors 

  • SP
  • PC
  • Tablet

Flow

</> 
pub type Flow {
  Stack(gap: Length)
  Row(gap: Length, wrap: Bool)
  Grid(cols: Int, gap: Length)
  GridTracks(cols: List(track.Track), gap: Length)
  Scroller
}

Constructors

FontFamily

</> 
pub type FontFamily {
  System
  SansSerif
  Serif
  Monospace
  Named(String)
}

Constructors 

  • System
  • SansSerif
  • Serif
  • Monospace
  • Named(String)

FontWeight

</> 
pub type FontWeight {
  Normal
  Medium
  SemiBold
  Bold
}

Constructors 

  • Normal
  • Medium
  • SemiBold
  • Bold

Img

</> 
pub type Img(blob, media) {
  Img(blob: blob, media: media)
}

Constructors 

  • Img(blob: blob, media: media)

Interaction

</> 
pub type Interaction {
  Hover
  Focus
  Disabled
}

Constructors 

  • Hover
  • Focus
  • Disabled

Length

</> 
pub type Length {
  Px(Float)
  Rem(Float)
}

Constructors 

  • Px(Float)
  • Rem(Float)

ListMarker

</>

並びの印(list-style)。いま書けるのは印を消す NoMarker だけ。

pub type ListMarker {
  NoMarker
}

Constructors 

  • NoMarker

ObjectFit

</> 
pub type ObjectFit {
  Cover
  Contain
  Fill
  ScaleDown
  FitNone
}

Constructors 

  • Cover
  • Contain
  • Fill
  • ScaleDown
  • FitNone

Pin

</> 
pub type Pin {
  Top
  Bottom
  NoPin
  Overlay
}

Constructors 

  • Top
  • Bottom
  • NoPin
  • Overlay

Ratio

</> 
pub type Ratio {
  Ratio(width: Float, height: Float)
}

Constructors 

  • Ratio(width: Float, height: Float)

SpaceProperty

</> 
pub type SpaceProperty {
  Margin
  Padding
  Gap
  Width
  Height
  Radius
  MinWidth
  MinHeight
  MaxWidth
}

Constructors 

  • Margin
  • Padding
  • Gap
  • Width
  • Height
  • Radius
  • MinWidth
  • MinHeight
  • MaxWidth

Style

</> 
pub type Style {
  Color(value: String)
  Background(value: String)
  Border(
    edge: BorderEdge,
    width: Length,
    style: BorderStyle,
    color: String,
  )
  Outline(width: Length, offset: Length, color: String)
  Crop(fit: ObjectFit, ratio: Ratio)
  Sizing(box: BoxSizing)
  Marker(marker: ListMarker)
  Decoration(line: TextDecoration)
  Space(property: SpaceProperty, value: Length)
  Text(
    family: FontFamily,
    size: Length,
    weight: FontWeight,
    line_height: Length,
  )
  Flow(flow: Flow)
  State(state: Interaction, styles: List(Style))
  Responsive(at: Breakpoint, styles: List(Style))
  Animation(animation: Animation)
}

Constructors

TextDecoration

</>

文字の飾り(text-decoration)。

pub type TextDecoration {
  NoDecoration
  Underline
}

Constructors 

  • NoDecoration
  • Underline
✨ Search Document