diff --git a/.github/workflows/container-images-ci.yml b/.github/workflows/container-images-ci.yml
index 4dcd81d3da6a5..e37d2e730efb3 100644
--- a/.github/workflows/container-images-ci.yml
+++ b/.github/workflows/container-images-ci.yml
@@ -14,7 +14,7 @@ jobs:
permissions:
id-token: write # allow issuing OIDC tokens for this workflow run
contents: read # allow at least reading the repo contents, add other permissions if necessary
-
+
steps:
# If this run wasn't initiated by PostHog Bot (meaning: snapshot update),
# cancel previous runs of snapshot update-inducing workflows
diff --git a/.github/workflows/pr-cleanup.yml b/.github/workflows/pr-cleanup.yml
index a2374f1e1d245..528cca898ad72 100644
--- a/.github/workflows/pr-cleanup.yml
+++ b/.github/workflows/pr-cleanup.yml
@@ -43,23 +43,23 @@ jobs:
- name: Delete hobby deployment
id: cleanup
run: |
- aws eks update-kubeconfig --name "posthog-dev"
- kubectl config set-cluster arn:aws:eks:us-east-1:169684386827:cluster/posthog-dev --server=https://eks-posthog-dev --tls-server-name 8BD6E1D2FEBDE47C8177E29CAC9E6C61.gr7.us-east-1.eks.amazonaws.com
+ aws eks update-kubeconfig --name "posthog-dev"
+ kubectl config set-cluster arn:aws:eks:us-east-1:169684386827:cluster/posthog-dev --server=https://eks-posthog-dev --tls-server-name 8BD6E1D2FEBDE47C8177E29CAC9E6C61.gr7.us-east-1.eks.amazonaws.com
- export PR_NUM=${{ github.event.number }}
- export BRANCH_NAME=${{ github.head_ref }}
- export BRANCH_NAME_HASH=$(echo -n ${{ github.head_ref }} | md5sum | cut -c 1-8)
- export HOSTNAME=pr-$PR_NUM-${BRANCH_NAME_HASH}
- export HOSTNAME=${HOSTNAME:0:38}
- export HOSTNAME=${HOSTNAME%%-}
- export NAMESPACE="hobby"
- export REGISTRY_URL=${{ steps.aws-ecr.outputs.registry }}/pr-test
- export DOCKER_TAG=${{ github.event.pull_request.head.sha }}
+ export PR_NUM=${{ github.event.number }}
+ export BRANCH_NAME=${{ github.head_ref }}
+ export BRANCH_NAME_HASH=$(echo -n ${{ github.head_ref }} | md5sum | cut -c 1-8)
+ export HOSTNAME=pr-$PR_NUM-${BRANCH_NAME_HASH}
+ export HOSTNAME=${HOSTNAME:0:38}
+ export HOSTNAME=${HOSTNAME%%-}
+ export NAMESPACE="hobby"
+ export REGISTRY_URL=${{ steps.aws-ecr.outputs.registry }}/pr-test
+ export DOCKER_TAG=${{ github.event.pull_request.head.sha }}
- envsubst < .github/pr-deploy/hobby.yaml.tmpl > .github/pr-deploy/hobby.yaml
+ envsubst < .github/pr-deploy/hobby.yaml.tmpl > .github/pr-deploy/hobby.yaml
- #Clean and deploy
- kubectl -n $NAMESPACE delete -f .github/pr-deploy/hobby.yaml || true
+ #Clean and deploy
+ kubectl -n $NAMESPACE delete -f .github/pr-deploy/hobby.yaml || true
- name: delete deployment
uses: bobheadxi/deployments@v1.4.0
diff --git a/.github/workflows/pr-deploy.yml b/.github/workflows/pr-deploy.yml
index 867dafd60e263..9b0182079e9b8 100644
--- a/.github/workflows/pr-deploy.yml
+++ b/.github/workflows/pr-deploy.yml
@@ -35,7 +35,7 @@ jobs:
with:
username: ${{ secrets.DOCKERHUB_USERNAME }}
password: ${{ secrets.DOCKERHUB_TOKEN }}
-
+
- uses: aws-actions/configure-aws-credentials@v1
with:
aws-region: us-east-1
diff --git a/frontend/__snapshots__/scenes-app-sidepanels--side-panel-activation.png b/frontend/__snapshots__/scenes-app-sidepanels--side-panel-activation.png
index ff5e1453ba095..0c9167f291960 100644
Binary files a/frontend/__snapshots__/scenes-app-sidepanels--side-panel-activation.png and b/frontend/__snapshots__/scenes-app-sidepanels--side-panel-activation.png differ
diff --git a/frontend/__snapshots__/scenes-app-sidepanels--side-panel-docs.png b/frontend/__snapshots__/scenes-app-sidepanels--side-panel-docs.png
index cb63608d2c237..5bff4d4e19952 100644
Binary files a/frontend/__snapshots__/scenes-app-sidepanels--side-panel-docs.png and b/frontend/__snapshots__/scenes-app-sidepanels--side-panel-docs.png differ
diff --git a/frontend/__snapshots__/scenes-app-sidepanels--side-panel-settings.png b/frontend/__snapshots__/scenes-app-sidepanels--side-panel-settings.png
index acab7b5f0b51d..6eb36ca35efc6 100644
Binary files a/frontend/__snapshots__/scenes-app-sidepanels--side-panel-settings.png and b/frontend/__snapshots__/scenes-app-sidepanels--side-panel-settings.png differ
diff --git a/frontend/src/layout/navigation-3000/sidepanel/SidePanel.scss b/frontend/src/layout/navigation-3000/sidepanel/SidePanel.scss
index 1bd256dfe3cce..19f18390369b9 100644
--- a/frontend/src/layout/navigation-3000/sidepanel/SidePanel.scss
+++ b/frontend/src/layout/navigation-3000/sidepanel/SidePanel.scss
@@ -34,44 +34,66 @@
// Stop the content from stealing focus whilst resizing
pointer-events: none;
}
+}
- .SidePanel3000__bar {
- display: flex;
- flex-direction: column;
- align-items: center;
- width: var(--side-panel-bar-width);
- height: 100vh;
- overflow: hidden;
- user-select: none;
- border-left-width: 1px;
+.SidePanel3000__bar {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ width: var(--side-panel-bar-width);
+ height: 100vh;
+ overflow: hidden;
+ user-select: none;
+ border-left-width: 1px;
+}
- .SidePanel3000__tabs {
- flex: 1;
- width: var(--side-panel-bar-width);
- overflow: hidden auto;
+.SidePanel3000__tabs {
+ flex: 1;
+ width: var(--side-panel-bar-width);
+ overflow: hidden auto;
- &::-webkit-scrollbar {
- display: none;
- }
+ &::-webkit-scrollbar {
+ display: none;
+ }
+}
- .SidePanel3000__tabsrotation {
- display: flex;
- gap: 0.25rem;
- align-items: center;
- height: var(--side-panel-bar-width);
- margin-top: calc(calc(var(--side-panel-bar-width) - 0.25rem) * -1);
- transform: rotate(90deg);
- transform-origin: bottom left;
- }
- }
+.SidePanel3000__tabs-content {
+ display: flex;
+ gap: 0.25rem;
+ align-items: center;
+ height: var(--side-panel-bar-width);
+ margin-top: calc(calc(var(--side-panel-bar-width) - 0.25rem) * -1);
+ transform: rotate(90deg);
+ transform-origin: bottom left;
+
+ // NOTE: The below overrides make is to that the shadows are below the buttons after rotation
+ // This is very very specific to SidePanel, hence !important is used universally
+ .LemonButton {
+ padding-right: 1px !important; // padding-bottom in regular buttons
+ padding-bottom: 0 !important;
}
- .SidePanel3000__content {
- display: flex;
- flex: 1;
- flex-direction: column;
- height: 100vh;
- overflow-y: auto;
- border-left-width: 1px;
+ .LemonButton__chrome {
+ top: 0 !important;
+ left: -1px !important; // top in regular buttons
+ margin: -1px 0 !important; // x and y axes swapped from regular buttons
+ &:hover {
+ top: 0 !important;
+ left: -1.5px !important; // top in regular buttons
+ }
+
+ &:active {
+ top: 0 !important;
+ left: -0.5px !important; // top in regular buttons
+ }
}
}
+
+.SidePanel3000__content {
+ display: flex;
+ flex: 1;
+ flex-direction: column;
+ height: 100vh;
+ overflow-y: auto;
+ border-left-width: 1px;
+}
diff --git a/frontend/src/layout/navigation-3000/sidepanel/SidePanel.tsx b/frontend/src/layout/navigation-3000/sidepanel/SidePanel.tsx
index 35215a4acce6e..8320ee506611c 100644
--- a/frontend/src/layout/navigation-3000/sidepanel/SidePanel.tsx
+++ b/frontend/src/layout/navigation-3000/sidepanel/SidePanel.tsx
@@ -136,7 +136,7 @@ export function SidePanel(): JSX.Element | null {