Show four blog cards per row and let editors crop thumbnails as 1:1 or 3:2.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-09-01 10:15:08 +03:30
parent c962fe524b
commit d9bdfbbb12
4 changed files with 88 additions and 3 deletions
@@ -283,6 +283,49 @@
  color: var(--primary);
 }

+.aspectSwitch {
+  display: inline-flex;
+  align-self: center;
+  margin-top: 4px;
+  padding: 3px;
+  gap: 2px;
+  background: rgba(148, 163, 184, 0.14);
+  border: 1px solid rgba(148, 163, 184, 0.28);
+  border-radius: 50px;
+}
+
+.aspectSwitchBtn {
+  min-width: 52px;
+  padding: 6px 12px;
+  font-size: 12px;
+  font-weight: 600;
+  line-height: 1.2;
+  font-family: var(--font-en), var(--font-ui);
+  color: var(--text-secondary);
+  background: transparent;
+  border-radius: 50px;
+  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
+}
+
+.aspectSwitchBtn:hover:not(:disabled) {
+  color: var(--primary);
+}
+
+.aspectSwitchBtn:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+
+.aspectSwitchBtnSelected {
+  background: var(--primary);
+  color: #fff;
+  box-shadow: 0 1px 3px rgba(var(--primary-rgb) / 0.35);
+}
+
+.aspectSwitchBtnSelected:hover:not(:disabled) {
+  color: #fff;
+}
+
 .videoEmbedRow {
  grid-column: span 12;
  display: grid;