lenta.less 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. .news-link{
  2. text-decoration: none;
  3. color: #3e3e3e;
  4. outline: none;
  5. transition: .3s cubic-bezier(.645,.045,.355,1);
  6. font: 700 18px/32px "Golos Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Ubuntu,Arial,sans-serif;
  7. margin-bottom: 10px;
  8. display: block;
  9. }
  10. .lenta{
  11. background: white;
  12. font: 14px/20px "Golos Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Ubuntu,Arial,sans-serif;
  13. min-height: 100%;
  14. h3{
  15. font: 14px/20px "Golos Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Ubuntu,Arial,sans-serif;
  16. margin: 0;
  17. display: flex;
  18. .published_at{
  19. transition: .3s;
  20. display: flex;
  21. min-height: 100%;
  22. min-width: 82px;
  23. font: 12px/17px "Golos Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Ubuntu,Arial,sans-serif;
  24. color: #a8a8a8;
  25. align-items: center;
  26. justify-content: center;
  27. flex-direction: column;
  28. align-content: center;
  29. justify-items: center;
  30. text-align: center;
  31. .commnets{
  32. display: block;
  33. .icon{
  34. width: 10px;
  35. height: 10px;
  36. fill: #a8a8a8;
  37. margin-right: 5px;
  38. }
  39. }
  40. }
  41. }
  42. .list-wrapper{
  43. &>div{
  44. padding: 12px 2px 12px 10px;
  45. transition: background-color 0.3s;
  46. a{
  47. transition: 0.3s;
  48. }
  49. &:hover{
  50. .published_at{
  51. color: hsla(0,0%,100%,.5)
  52. }
  53. background: #f6911f;
  54. a{
  55. color: white;
  56. }
  57. }
  58. }
  59. }
  60. .all-news{
  61. display: flex;
  62. padding: 30px;
  63. justify-content: center;
  64. a{
  65. display: block;
  66. padding: 10px 20px;
  67. border-radius: 50px;
  68. background: #f5f5f5;
  69. color: #f6911f;
  70. }
  71. }
  72. }