chore: remove 3000 css conditionals (#20234)

frontend/src/exporter/Exporter.scss

@@ -1,9 +1,7 @@
 @import '../styles/mixins';
 
 body.ExporterBody {
-    &.posthog-3000 {
-        overflow: initial;
-    }
+    overflow: initial;
 }
 
 .Exporter {

frontend/src/layout/navigation-3000/components/KeyboardShortcut.scss

@@ -8,21 +8,17 @@
     justify-content: center;
     min-width: 1.25rem;
     height: 1.25rem;
-    padding: 0 0.1875rem;
+    padding: 0.125rem 0.25rem;
+    font-size: 0.75rem;
     color: var(--default);
     text-transform: capitalize;
     user-select: none;
     background: var(--accent-3000);
+    border-color: var(--secondary-3000-button-border-hover);
     border-width: 1px;
+    border-bottom-width: 2px;
     border-radius: 0.25rem;
 
-    .posthog-3000 & {
-        padding: 0.125rem 0.25rem;
-        font-size: 0.75rem;
-        border-color: var(--secondary-3000-button-border-hover);
-        border-bottom-width: 2px;
-    }
-
     .KeyboardShortcut--muted > & {
         color: var(--muted);
         background: none;

frontend/src/lib/components/CommandBar/index.scss

@@ -1,4 +1,4 @@
-.CommandBar__input {
+.LemonInput.CommandBar__input {
     height: 2.75rem;
     padding-right: 0.375rem;
     padding-left: 0.75rem;

frontend/src/lib/components/CommandPalette/DebugCHQueries.tsx

@@ -157,7 +157,6 @@ function DebugCHQueries(): JSX.Element {
                 dataSource={filteredQueries}
                 loading={queriesLoading}
                 loadingSkeletonRows={5}
-                size="small"
                 pagination={undefined}
             />
         </>

frontend/src/lib/components/DateFilter/RollingDateRangeFilter.scss

@@ -1,7 +1,7 @@
 .RollingDateRangeFilter {
     display: flex;
     align-items: center;
-    height: 2rem;
+    height: 1.6875rem;
     min-height: 2rem;
     padding: 1.25rem 0.5rem;
     font-size: 0.875rem;
@@ -11,10 +11,6 @@
     cursor: pointer;
     transition: background 0.3s ease;
 
-    .posthog-3000 & {
-        height: 1.6875rem;
-    }
-
     &:hover {
         background-color: var(--mid);
     }
@@ -40,69 +36,47 @@
     box-sizing: border-box;
     display: flex;
     align-items: center;
-    height: 2rem;
+    height: 1.6875rem;
     margin: 0;
     margin-right: 0.25rem;
     margin-left: 0.25rem;
-    line-height: 1.25rem;
+    line-height: 1.5rem;
     background-color: var(--bg-light);
     border: 1px solid var(--border);
     border-radius: var(--radius);
 
-    .posthog-3000 & {
-        height: 1.6875rem;
-        line-height: 1.5rem;
-    }
-
     .LemonInput {
         width: 3rem;
+        height: unset;
         min-height: 0;
         padding: 0;
         border: none;
 
-        .posthog-3000 & {
-            height: unset;
-        }
-
         input {
             text-align: center;
         }
     }
 
     .RollingDateRangeFilter__counter__step {
-        padding: 0.25rem;
-        margin: 0 0.25rem;
-        border-radius: var(--radius);
+        width: 1.25rem;
+        height: 100%;
+        padding: 0;
+        margin: 0;
+        text-align: center;
+        border-radius: calc(var(--radius) - 1px);
 
         &:first-child {
-            .posthog-3000 & {
-                border-top-right-radius: 0;
-                border-bottom-right-radius: 0;
-            }
+            border-top-right-radius: 0;
+            border-bottom-right-radius: 0;
         }
 
         &:last-child {
-            .posthog-3000 & {
-                border-top-left-radius: 0;
-                border-bottom-left-radius: 0;
-            }
-        }
-
-        .posthog-3000 & {
-            width: 1.25rem;
-            height: 100%;
-            padding: 0;
-            margin: 0;
-            text-align: center;
-            border-radius: calc(var(--radius) - 1px);
+            border-top-left-radius: 0;
+            border-bottom-left-radius: 0;
         }
 
         &:hover {
-            background-color: var(--primary-highlight);
-
-            .posthog-3000 & {
-                background-color: var(--accent-3000);
-            }
+            background-color: var(--accent-3000);
         }
     }
 }

frontend/src/lib/components/DatePicker.scss

@@ -1,130 +1,101 @@
 .ant-picker {
+    color: var(--default);
+    background: var(--lemon-button-bg-color);
+    border-color: var(--secondary-3000-button-border);
     box-shadow: none !important;
-}
 
-.posthog-3000 {
-    .ant-picker {
+    .ant-picker-suffix {
         color: var(--default);
-        background: var(--lemon-button-bg-color);
-        border-color: var(--secondary-3000-button-border);
-
-        .ant-picker-suffix {
-            color: var(--default);
-        }
     }
 
-    .ant-picker:hover {
+    &:hover {
         border-color: var(--secondary-3000-button-border-hover);
     }
+}
 
-    .ant-picker-panel-container {
-        color: var(--default);
-        background: var(--bg-3000);
-        border: 1px solid var(--border);
+.ant-picker-panel-container {
+    color: var(--default);
+    background: var(--bg-3000);
+    border: 1px solid var(--border);
 
-        * {
-            border-color: var(--border);
-        }
+    * {
+        border-color: var(--border);
     }
+}
 
-    .ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner {
-        background: var(--primary-highlight);
-    }
+.ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner {
+    background: var(--primary-highlight);
 
-    .ant-picker-time-panel .ant-picker-time-panel-column:nth-child(3)::after {
-        // :HACKY: fix to keep the whole am/pm section in view
-        display: none;
+    [theme='dark'] & {
+        background: rgba(#f7a503, 0.4);
     }
+}
 
-    .ant-picker-cell .ant-picker-cell-inner {
-        border-radius: var(--radius);
-    }
+.ant-picker-time-panel .ant-picker-time-panel-column:nth-child(3)::after {
+    // :HACKY: fix to keep the whole am/pm section in view
+    display: none;
+}
 
-    .ant-picker-cell.ant-picker-cell-selected .ant-picker-cell-inner {
-        color: var(--default);
-        background: var(--primary-highlight);
-    }
+.ant-picker-cell .ant-picker-cell-inner {
+    border-radius: var(--radius);
+}
 
-    .ant-picker-cell.ant-picker-cell-today .ant-picker-cell-inner::before {
-        background: none;
-        border-color: var(--text-secondary-3000);
-    }
+.ant-picker-cell.ant-picker-cell-selected .ant-picker-cell-inner {
+    color: var(--default);
+    background: var(--primary-highlight);
 
-    .ant-picker-cell:hover:not(
-            .ant-picker-cell-selected,
-            .ant-picker-cell-range-start,
-            .ant-picker-cell-range-end,
-            .ant-picker-cell-range-hover-start,
-            .ant-picker-cell-range-hover-end
-        )
-        .ant-picker-cell-inner {
-        background: var(--secondary-3000);
+    [theme='dark'] & {
+        color: var(--default);
+        background: rgba(#f7a503, 0.4);
     }
+}
 
-    .ant-picker-cell:hover:not(.ant-picker-cell-in-view) .ant-picker-cell-inner,
-    .ant-picker-cell:hover:not(
-            .ant-picker-cell-today,
-            .ant-picker-cell-selected,
-            .ant-picker-cell-range-start,
-            .ant-picker-cell-range-end,
-            .ant-picker-cell-range-hover-start,
-            .ant-picker-cell-range-hover-end
-        )
-        .ant-picker-cell-inner,
-    .ant-picker-time-panel-column > li.ant-picker-time-panel-cell .ant-picker-time-panel-cell-inner:hover {
-        background: var(--secondary-3000);
-    }
+.ant-picker-cell.ant-picker-cell-today .ant-picker-cell-inner::before {
+    background: none;
+    border-color: var(--text-secondary-3000);
 
-    .ant-picker-footer .ant-btn-primary {
-        color: var(--primary);
-        text-shadow: none;
+    [theme='dark'] & {
         background: none;
-        border-color: var(--primary);
-        border-radius: 0.25rem;
-        box-shadow: none;
-    }
-
-    .ant-picker-footer .ant-btn-primary:not(:disabled):hover {
-        color: #fff;
-        background: var(--primary);
-    }
-
-    .ant-picker-footer .ant-picker-now-btn:hover {
-        color: var(--primary);
-    }
-
-    .ant-picker-ok .ant-btn-primary span {
-        text-transform: uppercase;
+        border-color: var(--text-secondary-3000);
     }
 }
 
-.posthog-3000[theme='dark'] {
-    .ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner {
-        background: rgba(#f7a503, 0.4);
-    }
-
-    .ant-picker-cell:hover:not(
-            .ant-picker-cell-selected,
-            .ant-picker-cell-range-start,
-            .ant-picker-cell-range-end,
-            .ant-picker-cell-range-hover-start,
-            .ant-picker-cell-range-hover-end
-        )
-        .ant-picker-cell-inner {
+.ant-picker-cell:hover:not(.ant-picker-cell-in-view) .ant-picker-cell-inner,
+.ant-picker-cell:hover:not(
+        .ant-picker-cell-today,
+        .ant-picker-cell-selected,
+        .ant-picker-cell-range-start,
+        .ant-picker-cell-range-end,
+        .ant-picker-cell-range-hover-start,
+        .ant-picker-cell-range-hover-end
+    )
+    .ant-picker-cell-inner,
+.ant-picker-time-panel-column > li.ant-picker-time-panel-cell .ant-picker-time-panel-cell-inner:hover {
+    background: var(--secondary-3000);
+
+    [theme='dark'] & {
         background: var(--muted-3000-dark);
     }
+}
 
-    .ant-picker-cell.ant-picker-cell-selected .ant-picker-cell-inner {
-        color: var(--default);
-        background: rgba(#f7a503, 0.4);
-    }
+.ant-picker-footer .ant-btn-primary {
+    color: var(--primary);
+    text-shadow: none;
+    background: none;
+    border-color: var(--primary);
+    border-radius: 0.25rem;
+    box-shadow: none;
+}
 
-    .ant-picker-time-panel-column > li.ant-picker-time-panel-cell .ant-picker-time-panel-cell-inner:hover {
-        background: var(--muted-3000-dark);
-    }
+.ant-picker-footer .ant-btn-primary:not(:disabled):hover {
+    color: #fff;
+    background: var(--primary);
+}
 
-    .ant-picker-cell.ant-picker-cell-today .ant-picker-cell-inner::before {
-        background: none;
-        border-color: var(--text-secondary-3000);
-    }
+.ant-picker-footer .ant-picker-now-btn:hover {
+    color: var(--primary);
+}
+
+.ant-picker-ok .ant-btn-primary span {
+    text-transform: uppercase;
 }

frontend/src/lib/components/PropertiesTable/PropertiesTable.scss

@@ -22,21 +22,15 @@
     }
 
     .editable {
-        text-decoration: underline dotted;
-        text-decoration-color: var(--primary-3000);
+        padding: 0.125rem 0.25rem;
+        margin-left: -0.25rem;
         cursor: pointer;
+        border: 1px solid transparent;
+        border-radius: calc(var(--radius) * 0.75);
 
-        .posthog-3000 & {
-            padding: 0.125rem 0.25rem;
-            margin-left: -0.25rem;
-            text-decoration: none;
-            border: 1px solid transparent;
-            border-radius: calc(var(--radius) * 0.75);
-
-            &:hover {
-                background: var(--bg-light);
-                border: 1px solid var(--border-light);
-            }
+        &:hover {
+            background: var(--bg-light);
+            border: 1px solid var(--border-light);
         }
     }
 }

frontend/src/lib/components/PropertiesTable/PropertiesTable.tsx

@@ -402,7 +402,6 @@ export function PropertiesTable({
                 <LemonTable
                     columns={columns}
                     showHeader={!embedded}
-                    size="small"
                     rowKey="0"
                     embedded={embedded}
                     dataSource={objectProperties}