You are here

media.css in Open Social 8.5

.media-wrapper {
  position: relative;
  margin-top: 15px;
}

.media-wrapper:first-of-type {
  margin-top: 0;
}

.media {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.media-body {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 85px;
}

.media-object {
  display: block;
}

.media-right,
.media > .pull-right {
  padding-left: 8px;
}

.media-left,
.media > .pull-left {
  padding-right: 8px;
}

.media-middle {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.media-bottom {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.media-heading {
  margin-top: 0;
  margin-bottom: 5px;
  padding-right: 40px;
}

.media-heading p {
  margin: 0;
}

.media-list {
  padding-left: 0;
  list-style: none;
}

@media (min-width: 600px) {
  .media-right,
  .media > .pull-right {
    padding-left: 20px;
  }
  .media-left,
  .media > .pull-left {
    padding-right: 20px;
  }
}

File

themes/socialbase/assets/css/media.css
View source
  1. .media-wrapper {
  2. position: relative;
  3. margin-top: 15px;
  4. }
  5. .media-wrapper:first-of-type {
  6. margin-top: 0;
  7. }
  8. .media {
  9. display: -webkit-box;
  10. display: -ms-flexbox;
  11. display: flex;
  12. -webkit-box-align: start;
  13. -ms-flex-align: start;
  14. align-items: flex-start;
  15. }
  16. .media-body {
  17. -webkit-box-flex: 1;
  18. -ms-flex: 1;
  19. flex: 1;
  20. min-width: 85px;
  21. }
  22. .media-object {
  23. display: block;
  24. }
  25. .media-right,
  26. .media > .pull-right {
  27. padding-left: 8px;
  28. }
  29. .media-left,
  30. .media > .pull-left {
  31. padding-right: 8px;
  32. }
  33. .media-middle {
  34. -webkit-box-align: center;
  35. -ms-flex-align: center;
  36. align-items: center;
  37. }
  38. .media-bottom {
  39. -webkit-box-align: end;
  40. -ms-flex-align: end;
  41. align-items: flex-end;
  42. }
  43. .media-heading {
  44. margin-top: 0;
  45. margin-bottom: 5px;
  46. padding-right: 40px;
  47. }
  48. .media-heading p {
  49. margin: 0;
  50. }
  51. .media-list {
  52. padding-left: 0;
  53. list-style: none;
  54. }
  55. @media (min-width: 600px) {
  56. .media-right,
  57. .media > .pull-right {
  58. padding-left: 20px;
  59. }
  60. .media-left,
  61. .media > .pull-left {
  62. padding-right: 20px;
  63. }
  64. }