You are here

node.css in AT Tools 8.3

/**
 * Content Types (nodes)
 *  - in Drupal a content type is a bunch of fields we use to enter and display
 *    content, such as pages, blog posts, forum posts and so on. Each of those
 *    is usually a content type you create in the Drupal admin.
 *  - an instance of a content type (e.g. a single blog post) is called a node,
 *    the root template is node.html.twig and the base selector is .node {}
 ============================================================================ */
.node {
  margin-bottom: 1.25em;
  padding: 1.25em;
  border-radius: 2px;
}

.node p:last-child {
  margin-bottom: 0;
}

.node__status {
  float: right;
}

.node--view-mode-full__title {
  margin: 0 0 1rem;
}

.node--view-mode-teaser ul:last-of-type {
  margin-bottom: 0;
}

.node__meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 1rem 0;
}

.node__meta .field-type-image {
  margin: 0 0.75rem 0 0;
}

.node__meta .field-type-image__figure {
  margin: 0;
  padding: 0;
}

.node__meta .field-type-image img {
  width: auto;
  height: 3rem;
}

.node__meta article:empty {
  display: none;
}

.node .node__author:after {
  content: "-";
  display: inline-block;
}

.node__meta--has-author-picture .node__submitted {
  margin-top: 0.25rem;
}

.node__meta--has-author-picture .node__author:after {
  display: none;
}

.node__meta--has-author-picture .node__author,
.node__meta--has-author-picture .node__pubdate {
  margin: 0;
  display: block;
}

@media screen and (max-width: 60em) {
  .node .node__author:after {
    display: none;
  }
  .node .node__author,
  .node .node__pubdate {
    margin: 0;
    display: block;
  }
}

.node__links {
  clear: both;
}

.node--sticky {
  padding: 0;
}
/*# sourceMappingURL=node.css.map */

File

at_theme_generator/starterkits/starterkit/styles/css/components/node.css
View source
  1. /**
  2. * Content Types (nodes)
  3. * - in Drupal a content type is a bunch of fields we use to enter and display
  4. * content, such as pages, blog posts, forum posts and so on. Each of those
  5. * is usually a content type you create in the Drupal admin.
  6. * - an instance of a content type (e.g. a single blog post) is called a node,
  7. * the root template is node.html.twig and the base selector is .node {}
  8. ============================================================================ */
  9. .node {
  10. margin-bottom: 1.25em;
  11. padding: 1.25em;
  12. border-radius: 2px;
  13. }
  14. .node p:last-child {
  15. margin-bottom: 0;
  16. }
  17. .node__status {
  18. float: right;
  19. }
  20. .node--view-mode-full__title {
  21. margin: 0 0 1rem;
  22. }
  23. .node--view-mode-teaser ul:last-of-type {
  24. margin-bottom: 0;
  25. }
  26. .node__meta {
  27. display: -webkit-box;
  28. display: -ms-flexbox;
  29. display: flex;
  30. -webkit-box-align: center;
  31. -ms-flex-align: center;
  32. align-items: center;
  33. margin: 1rem 0;
  34. }
  35. .node__meta .field-type-image {
  36. margin: 0 0.75rem 0 0;
  37. }
  38. .node__meta .field-type-image__figure {
  39. margin: 0;
  40. padding: 0;
  41. }
  42. .node__meta .field-type-image img {
  43. width: auto;
  44. height: 3rem;
  45. }
  46. .node__meta article:empty {
  47. display: none;
  48. }
  49. .node .node__author:after {
  50. content: "-";
  51. display: inline-block;
  52. }
  53. .node__meta--has-author-picture .node__submitted {
  54. margin-top: 0.25rem;
  55. }
  56. .node__meta--has-author-picture .node__author:after {
  57. display: none;
  58. }
  59. .node__meta--has-author-picture .node__author,
  60. .node__meta--has-author-picture .node__pubdate {
  61. margin: 0;
  62. display: block;
  63. }
  64. @media screen and (max-width: 60em) {
  65. .node .node__author:after {
  66. display: none;
  67. }
  68. .node .node__author,
  69. .node .node__pubdate {
  70. margin: 0;
  71. display: block;
  72. }
  73. }
  74. .node__links {
  75. clear: both;
  76. }
  77. .node--sticky {
  78. padding: 0;
  79. }
  80. /*# sourceMappingURL=node.css.map */