You are here

Home » API reference » AT Tools 8.3

STARTERKIT.layout.page.css in AT Tools 8.3

Same filename and directory in other branches
  1. 8.2 at_theme_generator/starterkits/starterkit/styles/css/generated/STARTERKIT.layout.page.css
/* Layout CSS for: page.html.twig, generated: Sat, 15 Oct 16 22:11:51 +1300 */
.l-rw {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  max-width: 75em;
  width: 100%;
}

.l-r {
  flex: 0 0 auto;
  padding: 0 0.625em;
  width: 100%;
}
@media all and (min-width: 60.063em) {
.pr-header .arc--2 .l-r {
  width: 50%;
}
.pr-features .hr--1-2 .l-r:first-child {
  width: 83.33333%;
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2;
}

.pr-features .hr--1-2 .l-r:last-child {
  width: 16.66667%;
  -webkit-order: 1;
      -ms-flex-order: 1;
          order: 1;
}

.pr-features .hr--1-3 .l-r:first-child {
  width: 83.33333%;
  -webkit-order: 1;
      -ms-flex-order: 1;
          order: 1;
}

.pr-features .hr--1-3 .l-r:last-child {
  width: 16.66667%;
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2;
}

.pr-features .hr--2-3 .l-r {
  width: 50%;
}

.pr-features .arc--3 .l-r:first-child {
  width: 66.66667%;
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2;
}

.pr-features .arc--3 .l-r:nth-child(2) {
  width: 16.66667%;
  -webkit-order: 1;
      -ms-flex-order: 1;
          order: 1;
}

.pr-features .arc--3 .l-r:last-child {
  width: 16.66667%;
  -webkit-order: 3;
      -ms-flex-order: 3;
          order: 3;
}
.pr-main .hr--1-2 .l-r:first-child {
  width: 75%;
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2;
}

.pr-main .hr--1-2 .l-r:last-child {
  width: 25%;
  -webkit-order: 1;
      -ms-flex-order: 1;
          order: 1;
}

.pr-main .hr--1-3 .l-r:first-child {
  width: 75%;
  -webkit-order: 1;
      -ms-flex-order: 1;
          order: 1;
}

.pr-main .hr--1-3 .l-r:last-child {
  width: 25%;
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2;
}

.pr-main .hr--2-3 .l-r {
  width: 50%;
}

.pr-main .arc--3 .l-r:first-child {
  width: 50%;
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2;
}

.pr-main .arc--3 .l-r:nth-child(2) {
  width: 25%;
  -webkit-order: 1;
      -ms-flex-order: 1;
          order: 1;
}

.pr-main .arc--3 .l-r:last-child {
  width: 25%;
  -webkit-order: 3;
      -ms-flex-order: 3;
          order: 3;
}
.pr-subfeatures .arc--2 .l-r {
  width: 50%;
}

.pr-subfeatures .arc--3 .l-r {
  width: 33.33333%;
}

.pr-subfeatures .arc--4 .l-r {
  width: 25%;
}
}
@media all and (min-width: 45.063em) and (max-width: 60em) {
.pr-features .hr--2-3 .l-r,
.pr-features .arc--3 .l-r:nth-child(2) {
  width: 50%;
}

.pr-features .hr--2-3 .l-r:last-child,
.pr-features .arc--3 .l-r:last-child {
  width: 50%;
}
.pr-main .hr--2-3 .l-r,
.pr-main .arc--3 .l-r:nth-child(2) {
  width: 50%;
}

.pr-main .hr--2-3 .l-r:last-child,
.pr-main .arc--3 .l-r:last-child {
  width: 50%;
}
.pr-subfeatures .arc--2 .l-r,
.pr-subfeatures .arc--3 .l-r:first-child,
.pr-subfeatures .arc--4 .l-r {
  width: 50%;
}

.pr-subfeatures .arc--3 .l-r:nth-child(2) {
  width: 50%;
}
}

File

at_theme_generator/starterkits/starterkit/styles/css/generated/STARTERKIT.layout.page.css
View source 
  1. /* Layout CSS for: page.html.twig, generated: Sat, 15 Oct 16 22:11:51 +1300 */

  2. .l-rw {

  3.   display: flex;

  4.   flex-wrap: wrap;

  5.   flex-direction: row;

  6.   max-width: 75em;

  7.   width: 100%;

  8. }

  9. 

  10. .l-r {

  11.   flex: 0 0 auto;

  12.   padding: 0 0.625em;

  13.   width: 100%;

  14. }

  15. @media all and (min-width: 60.063em) {

  16. .pr-header .arc--2 .l-r {

  17.   width: 50%;

  18. }

  19. .pr-features .hr--1-2 .l-r:first-child {

  20.   width: 83.33333%;

  21.   -webkit-order: 2;

  22.       -ms-flex-order: 2;

  23.           order: 2;

  24. }

  25. 

  26. .pr-features .hr--1-2 .l-r:last-child {

  27.   width: 16.66667%;

  28.   -webkit-order: 1;

  29.       -ms-flex-order: 1;

  30.           order: 1;

  31. }

  32. 

  33. .pr-features .hr--1-3 .l-r:first-child {

  34.   width: 83.33333%;

  35.   -webkit-order: 1;

  36.       -ms-flex-order: 1;

  37.           order: 1;

  38. }

  39. 

  40. .pr-features .hr--1-3 .l-r:last-child {

  41.   width: 16.66667%;

  42.   -webkit-order: 2;

  43.       -ms-flex-order: 2;

  44.           order: 2;

  45. }

  46. 

  47. .pr-features .hr--2-3 .l-r {

  48.   width: 50%;

  49. }

  50. 

  51. .pr-features .arc--3 .l-r:first-child {

  52.   width: 66.66667%;

  53.   -webkit-order: 2;

  54.       -ms-flex-order: 2;

  55.           order: 2;

  56. }

  57. 

  58. .pr-features .arc--3 .l-r:nth-child(2) {

  59.   width: 16.66667%;

  60.   -webkit-order: 1;

  61.       -ms-flex-order: 1;

  62.           order: 1;

  63. }

  64. 

  65. .pr-features .arc--3 .l-r:last-child {

  66.   width: 16.66667%;

  67.   -webkit-order: 3;

  68.       -ms-flex-order: 3;

  69.           order: 3;

  70. }

  71. .pr-main .hr--1-2 .l-r:first-child {

  72.   width: 75%;

  73.   -webkit-order: 2;

  74.       -ms-flex-order: 2;

  75.           order: 2;

  76. }

  77. 

  78. .pr-main .hr--1-2 .l-r:last-child {

  79.   width: 25%;

  80.   -webkit-order: 1;

  81.       -ms-flex-order: 1;

  82.           order: 1;

  83. }

  84. 

  85. .pr-main .hr--1-3 .l-r:first-child {

  86.   width: 75%;

  87.   -webkit-order: 1;

  88.       -ms-flex-order: 1;

  89.           order: 1;

  90. }

  91. 

  92. .pr-main .hr--1-3 .l-r:last-child {

  93.   width: 25%;

  94.   -webkit-order: 2;

  95.       -ms-flex-order: 2;

  96.           order: 2;

  97. }

  98. 

  99. .pr-main .hr--2-3 .l-r {

  100.   width: 50%;

  101. }

  102. 

  103. .pr-main .arc--3 .l-r:first-child {

  104.   width: 50%;

  105.   -webkit-order: 2;

  106.       -ms-flex-order: 2;

  107.           order: 2;

  108. }

  109. 

  110. .pr-main .arc--3 .l-r:nth-child(2) {

  111.   width: 25%;

  112.   -webkit-order: 1;

  113.       -ms-flex-order: 1;

  114.           order: 1;

  115. }

  116. 

  117. .pr-main .arc--3 .l-r:last-child {

  118.   width: 25%;

  119.   -webkit-order: 3;

  120.       -ms-flex-order: 3;

  121.           order: 3;

  122. }

  123. .pr-subfeatures .arc--2 .l-r {

  124.   width: 50%;

  125. }

  126. 

  127. .pr-subfeatures .arc--3 .l-r {

  128.   width: 33.33333%;

  129. }

  130. 

  131. .pr-subfeatures .arc--4 .l-r {

  132.   width: 25%;

  133. }

  134. }

  135. @media all and (min-width: 45.063em) and (max-width: 60em) {

  136. .pr-features .hr--2-3 .l-r,

  137. .pr-features .arc--3 .l-r:nth-child(2) {

  138.   width: 50%;

  139. }

  140. 

  141. .pr-features .hr--2-3 .l-r:last-child,

  142. .pr-features .arc--3 .l-r:last-child {

  143.   width: 50%;

  144. }

  145. .pr-main .hr--2-3 .l-r,

  146. .pr-main .arc--3 .l-r:nth-child(2) {

  147.   width: 50%;

  148. }

  149. 

  150. .pr-main .hr--2-3 .l-r:last-child,

  151. .pr-main .arc--3 .l-r:last-child {

  152.   width: 50%;

  153. }

  154. .pr-subfeatures .arc--2 .l-r,

  155. .pr-subfeatures .arc--3 .l-r:first-child,

  156. .pr-subfeatures .arc--4 .l-r {

  157.   width: 50%;

  158. }

  159. 

  160. .pr-subfeatures .arc--3 .l-r:nth-child(2) {

  161.   width: 50%;

  162. }

  163. }