css-writing-mode/css/writing-mode.css

Css module of single purpose classes for writing mode

/*
   WRITING MODE
*/


.wm-horizontal-tb { writing-mode: horizontal-tb; }
.wm-rl-tb {         writing-mode: rl-tb; }
.wm-vertical-lr {   writing-mode: vertical-lr; }
.wm-vertical-rl {   writing-mode: vertical-rl;}
.wm-bt-rl {         writing-mode: bt-rl; }
.wm-bt-lr {         writing-mode: bt-lr; }
.wm-lr-bt {         writing-mode: lr-bt; }
.wm-rl-bt {         writing-mode: rl-bt; }

@media screen and (min-width: 48em) {
  .wm-horizontal-tb-ns { writing-mode: horizontal-tb; }
  .wm-rl-tb-ns {         writing-mode: rl-tb; }
  .wm-vertical-lr-ns {   writing-mode: vertical-lr; }
  .wm-vertical-rl-ns {   writing-mode: vertical-rl;}
  .wm-bt-rl-ns {         writing-mode: bt-rl; }
  .wm-bt-lr-ns {         writing-mode: bt-lr; }
  .wm-lr-bt-ns {         writing-mode: lr-bt; }
  .wm-rl-bt-ns {         writing-mode: rl-bt; }
}

@media screen and (min-width:48em) and (max-width: 64em) {
  .wm-horizontal-tb-m { writing-mode: horizontal-tb; }
  .wm-rl-tb-m {         writing-mode: rl-tb; }
  .wm-vertical-lr-m {   writing-mode: vertical-lr; }
  .wm-vertical-rl-m {   writing-mode: vertical-rl;}
  .wm-bt-rl-m {         writing-mode: bt-rl; }
  .wm-bt-lr-m {         writing-mode: bt-lr; }
  .wm-lr-bt-m {         writing-mode: lr-bt; }
  .wm-rl-bt-m {         writing-mode: rl-bt; }
}

@media screen and (min-width: 64em) {
  .wm-horizontal-tb-l { writing-mode: horizontal-tb; }
  .wm-rl-tb-l {         writing-mode: rl-tb; }
  .wm-vertical-lr-l {   writing-mode: vertical-lr; }
  .wm-vertical-rl-l {   writing-mode: vertical-rl;}
  .wm-bt-rl-l {         writing-mode: bt-rl; }
  .wm-bt-lr-l {         writing-mode: bt-lr; }
  .wm-lr-bt-l {         writing-mode: lr-bt; }
  .wm-rl-bt-l {         writing-mode: rl-bt; }
}