recent-posts.css 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. .recent-posts-section .container {
  2. padding-top: 1rem;
  3. }
  4. .recent-posts-section h1 > span{
  5. margin-top: -55px; /* Size of fixed header */
  6. padding-bottom:55px;
  7. display: block;
  8. }
  9. .recent-posts-section .card .card-footer span {
  10. font-size: 10pt;
  11. color: #6c757d !important;
  12. padding-top: 5px;
  13. }
  14. .recent-posts-section .card .card-footer {
  15. background: #fff;
  16. margin-top: auto;
  17. }
  18. .recent-posts-section .post-card-link {
  19. text-decoration: none;
  20. }
  21. .post-summary {
  22. overflow: hidden;
  23. text-overflow: ellipsis;
  24. display: -webkit-box;
  25. /* line-height: 24px; fallback */
  26. max-height: 144px; /* fallback */
  27. -webkit-line-clamp: 5; /* number of lines to show */
  28. -webkit-box-orient: vertical;
  29. }
  30. /* ============= Device specific fixes ======= */
  31. /* Large screens such as TV */
  32. @media only screen and (min-width: 1824px) {
  33. }
  34. /* Extra large devices (large desktops, 1200px and up) */
  35. @media (max-width: 1400px) {
  36. }
  37. @media (max-width: 1200px) {
  38. }
  39. /* IPad Pro */
  40. @media (max-width: 1024px) {
  41. }
  42. /* Large devices (desktops, 992px and up) */
  43. @media (max-width: 992px) {
  44. }
  45. /* Medium devices (tablets, 768px and up) */
  46. @media only screen and (max-width: 768px) {
  47. .recent-posts-section .container {
  48. max-width: 100%;
  49. }
  50. .recent-posts-section .post-card {
  51. width: 50%;
  52. }
  53. }
  54. /* Small devices (landscape phones, 576px and up) */
  55. @media only screen and (max-width: 576px) {
  56. .recent-posts-section .post-card {
  57. width: 100%;
  58. }
  59. }
  60. /* iPhoneX, iPhone 6,7,8 */
  61. @media only screen and (max-width: 375px) {
  62. }
  63. /* Galaxy S5, Moto G4 */
  64. @media only screen and (max-width: 360px) {
  65. }
  66. /* iPhone 5 or before */
  67. @media only screen and (max-width: 320px) {
  68. }