Просмотр исходного кода

Improved: implement CSS variable --frss-padding-flux-items (#4789)

* frss.css

* mobile view: a bit compacter cols
maTh 3 лет назад
Родитель
Сommit
301d3c81ba
2 измененных файлов с 28 добавлено и 6 удалено
  1. 14 3
      p/themes/base-theme/frss.css
  2. 14 3
      p/themes/base-theme/frss.rtl.css

+ 14 - 3
p/themes/base-theme/frss.css

@@ -38,6 +38,8 @@
 
 	--frss-loading-image: url("loader.gif");
 
+	--frss-padding-flux-items: 0.75rem;
+
 	line-height: 1.5;
 }
 
@@ -1129,15 +1131,20 @@ input[type="search"] {
 	line-height: 1.5rem;
 }
 
+.flux .flux_header .item.manage .item-element,
+.flux .flux_header .item.website .item-element,
+.flux .flux_header .item.link .item-element {
+	padding-left: var(--frss-padding-flux-items);
+	padding-right: var(--frss-padding-flux-items);
+}
+
 .flux .item.manage,
 .flux .item.link {
-	width: 40px;
-	text-align: center;
+	width: calc(1rem + 2 * var(--frss-padding-flux-items));
 }
 
 .flux .item.website {
 	width: 200px;
-	padding-right: 10px;
 }
 
 .website a:hover .favicon,
@@ -1910,6 +1917,10 @@ input:checked + .slide-container .properties {
 /*===========*/
 
 @media (max-width: 840px) {
+	:root {
+		--frss-padding-flux-items: 0.5rem;
+	}
+
 	.flux_header .item.website span,
 	.item.date, .day .date,
 	.dropdown-menu > .no-mobile,

+ 14 - 3
p/themes/base-theme/frss.rtl.css

@@ -38,6 +38,8 @@
 
 	--frss-loading-image: url("loader.gif");
 
+	--frss-padding-flux-items: 0.75rem;
+
 	line-height: 1.5;
 }
 
@@ -1129,15 +1131,20 @@ input[type="search"] {
 	line-height: 1.5rem;
 }
 
+.flux .flux_header .item.manage .item-element,
+.flux .flux_header .item.website .item-element,
+.flux .flux_header .item.link .item-element {
+	padding-right: var(--frss-padding-flux-items);
+	padding-left: var(--frss-padding-flux-items);
+}
+
 .flux .item.manage,
 .flux .item.link {
-	width: 40px;
-	text-align: center;
+	width: calc(1rem + 2 * var(--frss-padding-flux-items));
 }
 
 .flux .item.website {
 	width: 200px;
-	padding-left: 10px;
 }
 
 .website a:hover .favicon,
@@ -1910,6 +1917,10 @@ input:checked + .slide-container .properties {
 /*===========*/
 
 @media (max-width: 840px) {
+	:root {
+		--frss-padding-flux-items: 0.5rem;
+	}
+
 	.flux_header .item.website span,
 	.item.date, .day .date,
 	.dropdown-menu > .no-mobile,