wip

.circleci/config.yml

@@ -0,0 +1,101 @@
+version: 2
+jobs:
+  build:
+    docker:
+      - image: penpotapp/devenv:latest
+      - image: cimg/postgres:14.5
+        environment:
+          POSTGRES_USER: penpot_test
+          POSTGRES_PASSWORD: penpot_test
+          POSTGRES_DB: penpot_test
+      - image: cimg/redis:7.0.5
+
+    working_directory: ~/repo
+    resource_class: large
+
+    environment:
+      # Customize the JVM maximum heap limit
+      JVM_OPTS: -Xmx4g
+
+    steps:
+      - checkout
+
+      # Download and cache dependencies
+      - restore_cache:
+         keys:
+           - v1-dependencies-{{ checksum "backend/deps.edn" }}-{{ checksum "frontend/deps.edn"}}-{{ checksum "common/deps.edn"}}
+           # fallback to using the latest cache if no exact match is found
+           - v1-dependencies-
+
+      - run: cd .clj-kondo && cat config.edn
+
+      - run:
+          name: frontend styles prettier
+          working_directory: "./frontend"
+          command: |
+            yarn install
+            yarn run lint-scss
+
+      - run:
+          name: common lint
+          working_directory: "./common"
+          command: |
+            clj-kondo --version
+            clj-kondo --parallel --lint src/
+
+      - run:
+          name: frontend lint
+          working_directory: "./frontend"
+          command: |
+            clj-kondo --version
+            clj-kondo --parallel --lint src/
+
+      - run:
+          name: backend lint
+          working_directory: "./backend"
+          command: |
+            clj-kondo --version
+            clj-kondo --parallel --lint src/
+
+      - run:
+          working_directory: "./common"
+          name: common tests
+          command: |
+            yarn install
+            yarn test
+            clojure -X:dev:test :patterns '["common-tests.*-test"]'
+
+          environment:
+            PATH: /usr/local/nodejs/bin/:/usr/local/bin:/bin:/usr/bin
+            JVM_OPTS: -Xmx4g
+            NODE_OPTIONS: --max-old-space-size=4096
+
+      - run:
+          name: backend test
+          working_directory: "./backend"
+          command: |
+            clojure -X:dev:test :patterns '["backend-tests.*-test"]'
+
+          environment:
+            PENPOT_TEST_DATABASE_URI: "postgresql://localhost/penpot_test"
+            PENPOT_TEST_DATABASE_USERNAME: penpot_test
+            PENPOT_TEST_DATABASE_PASSWORD: penpot_test
+            PENPOT_TEST_REDIS_URI: "redis://localhost/1"
+            JVM_OPTS: -Xmx4g
+
+      - run:
+          name: frontend tests
+          working_directory: "./frontend"
+          command: |
+            yarn install
+            yarn test
+
+          environment:
+            PATH: /usr/local/nodejs/bin/:/usr/local/bin:/bin:/usr/bin
+            NODE_OPTIONS: --max-old-space-size=4096
+
+      - save_cache:
+         paths:
+           - ~/.m2
+         key: v1-dependencies-{{ checksum "backend/deps.edn" }}-{{ checksum "frontend/deps.edn"}}-{{ checksum "common/deps.edn"}}
+

.clj-kondo/config.edn

@@ -2,10 +2,10 @@
  {promesa.core/let clojure.core/let
   promesa.core/->> clojure.core/->>
   promesa.core/-> clojure.core/->
-  promesa.exec.csp/go-loop clojure.core/loop
-  promesa.util/with-open clojure.core/with-open
-  app.common.schema.generators/let clojure.core/let
+  rumext.v2/defc clojure.core/defn
+  rumext.v2/fnc clojure.core/fn
   app.common.data/export clojure.core/def
+  app.db/with-atomic clojure.core/with-open
   app.common.data.macros/get-in clojure.core/get-in
   app.common.data.macros/with-open clojure.core/with-open
   app.common.data.macros/select-keys clojure.core/select-keys
@@ -14,29 +14,16 @@
  :hooks
  {:analyze-call
   {app.common.data.macros/export hooks.export/export
+   potok.core/reify hooks.export/potok-reify
    app.util.services/defmethod hooks.export/service-defmethod
-   app.common.record/defrecord hooks.export/penpot-defrecord
-   app.db/with-atomic hooks.export/penpot-with-atomic
-   potok.v2.core/reify hooks.export/potok-reify
-   rumext.v2/fnc hooks.export/rumext-fnc
-   rumext.v2/defc hooks.export/rumext-defc
-   rumext.v2/lazy-component hooks.export/rumext-lazycomponent
-   shadow.lazy/loadable hooks.export/rumext-lazycomponent
    }}
 
  :output
  {:exclude-files
   ["data_readers.clj"
-   "src/app/util/perf.cljs"
-   "src/app/common/logging.cljc"
-   "src/app/common/exceptions.cljc"
-   "^(?:backend|frontend|exporter|common)/build.clj"
-   "^(?:backend|frontend|exporter|common)/deps.edn"
-   "^(?:backend|frontend|exporter|common)/scripts/"
-   "^(?:backend|frontend|exporter|common)/dev/"
-   "^(?:backend|frontend|exporter|common)/test/"]
-
-  :linter-name true}
+   "app/util/perf.cljs"
+   "app/common/logging.cljc"
+   "app/common/exceptions.cljc"]}
 
  :linters
  {:unsorted-required-namespaces
@@ -45,16 +32,10 @@
   :potok/reify-type
   {:level :error}
 
-  :missing-protocol-method
-  {:level :off}
-
   :unresolved-namespace
   {:level :warning
    :exclude [data_readers]}
 
-  :unused-value
-  {:level :off}
-
   :single-key-in
   {:level :warning}
 
@@ -64,15 +45,6 @@
   :redundant-do
   {:level :off}
 
-  :redundant-ignore
-  {:level :off}
-
-  :redundant-nested-call
-  {:level :off}
-
-  :redundant-str-call
-  {:level :off}
-
   :earmuffed-var-not-dynamic
   {:level :off}
 
@@ -87,3 +59,4 @@
    :exclude-destructured-keys-in-fn-args false
    }
   }}
+

.clj-kondo/hooks/export.clj

@@ -12,7 +12,6 @@
 
 (def registry (atom {}))
 
-
 (defn potok-reify
   [{:keys [:node :filename] :as params}]
   (let [[rnode rtype & other] (:children node)
@@ -38,150 +37,8 @@
                           (api/token-node rsym)
                           (api/vector-node [])]
                          other))]
-
-      ;; (prn (api/sexpr result))
-
       {:node result})))
 
-(defn penpot-with-atomic
-  [{:keys [node]}]
-  (let [[params & body] (rest (:children node))]
-    (if (api/vector-node? params)
-      (let [[sym val opts] (:children params)]
-        (when-not (and sym val)
-          (throw (ex-info "No sym and val provided" {})))
-        {:node (api/list-node
-                (list*
-                 (api/token-node 'let)
-                 (api/vector-node [sym val])
-                 opts
-                 body))})
-
-      {:node (api/list-node
-              (into [(api/token-node 'let)
-                     (api/vector-node [params params])]
-                    body))})))
-
-(defn rumext-fnc
-  [{:keys [node]}]
-  (let [[cname mdata params & body] (rest (:children node))
-        [params body] (if (api/vector-node? mdata)
-                        [mdata (cons params body)]
-                        [params body])
-
-        result (api/list-node
-                (into [(api/token-node 'fn) params]
-                      (cons mdata body)))]
-
-    {:node result}))
-
-
-(defn- parse-defc
-  [{:keys [children] :as node}]
-  (let [args (rest children)
-
-        [cname args]
-        (if (api/token-node? (first args))
-          [(first args) (rest args)]
-          (throw (ex-info "unexpected1" {})))
-
-        [docs args]
-        (if (api/string-node? (first args))
-          [(first args) (rest args)]
-          ["" args])
-
-        [mdata args]
-        (if (api/map-node? (first args))
-          [(first args) (rest args)]
-          [(api/map-node []) args])
-
-        [params body]
-        (if (api/vector-node? (first args))
-          [(first args) (rest args)]
-          (throw (ex-info "unexpected2" {})))]
-
-    [cname docs mdata params body]))
-
-(defn rumext-defc
-  [{:keys [node]}]
-  (let [[cname docs mdata params body] (parse-defc node)
-
-        param1        (first (:children params))
-        paramN        (rest (:children params))
-
-        param1        (if (api/map-node? param1)
-                        (let [param1    (into {} (comp
-                                                  (partition-all 2)
-                                                  (map (fn [[k v]]
-                                                         [(if (api/keyword-node? k)
-                                                            (:k k)
-                                                            k)
-                                                          (if (api/vector-node? v)
-                                                            (vec (:children v))
-                                                            v)])))
-                                              (:children param1))
-
-                              binding   (:rest param1)
-                              param1    (if binding
-                                          (if (contains? param1 :as)
-                                            (update param1 :keys (fnil conj []) binding)
-                                            (assoc param1 :as binding))
-                                          param1)]
-                          (->> (dissoc param1 :rest)
-                               (mapcat (fn [[k v]]
-                                         [(if (keyword? k)
-                                            (api/keyword-node k)
-                                            k)
-                                          (if (vector? v)
-                                            (api/vector-node v)
-                                            v)]))
-                               (api/map-node)))
-                        param1)
-
-        result (api/list-node
-                (into [(api/token-node 'defn)
-                       cname
-                       (api/vector-node (filter some? (cons param1 paramN)))]
-                      (cons mdata body)))]
-
-    ;; (prn (api/sexpr result))
-
-    {:node result}))
-
-
-(defn rumext-lazycomponent
-  [{:keys [node]}]
-  (let [[cname mdata params & body] (rest (:children node))
-        [params body] (if (api/vector-node? mdata)
-                        [mdata (cons params body)]
-                        [params body])]
-    (let [result (api/list-node [(api/token-node 'constantly) nil])]
-      ;; (prn (api/sexpr result))
-      {:node result})))
-
-
-(defn penpot-defrecord
-  [{:keys [:node]}]
-  (let [[rnode rtype rparams & other] (:children node)
-
-        nodes [(api/token-node (symbol "do"))
-               (api/list-node
-                (into [(api/token-node (symbol (name (:value rnode)))) rtype rparams] other))
-               (api/list-node
-                [(api/token-node (symbol "defn"))
-                 (api/token-node (symbol (str "pos->" (:string-value rtype))))
-                 (api/vector-node
-                  (->> (:children rparams)
-                       (mapv (fn [t]
-                               (api/token-node (symbol (str "_" (:string-value t))))))))
-                 (api/token-node nil)])]
-
-        result (api/list-node nodes)]
-
-    ;; (prn "=====>" (into {} rparams))
-    ;; (prn (api/sexpr result))
-    {:node result}))
-
 (defn clojure-specify
   [{:keys [:node]}]
   (let [[rnode rtype & other] (:children node)
@@ -191,6 +48,7 @@
                        other))]
     {:node result}))
 
+
 (defn service-defmethod
   [{:keys [:node]}]
   (let [[rnode rtype ?meta & other] (:children node)

.cljfmt.edn

@@ -1,9 +0,0 @@
-{:sort-ns-references? true
- :remove-multiple-non-indenting-spaces? false
- :remove-surrounding-whitespace? true
- :remove-consecutive-blank-lines? false
- :extra-indents {rumext.v2/fnc [[:inner 0]]
-                 cljs.test/async [[:inner 0]]
-                 promesa.exec/thread [[:inner 0]]
-                 specify! [[:inner 0] [:inner 1]]}
- }

.editorconfig

@@ -1,19 +0,0 @@
-root = true
-
-[*.{cljs,cljc,clj,js,css,scss,html,yml,yaml,json,mustache}]
-charset = utf-8
-
-indent_size = 2
-indent_style = space
-
-end_of_line = lf
-
-insert_final_newline = true
-
-trim_trailing_whitespace = true
-
-[*.{rs}]
-indent_size = 4
-indent_style = space
-
-end_of_line = lf

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,20 +1,29 @@
-### Related Ticket
+<!--
 
-<!-- Reference the related GitHub/Taiga ticket. -->
+Some key notes before you open a PR:
 
-### Summary
+ 1. Select which branch should this PR be merged in? By default, you should always merge to the develop branch.
+ 2. PR name follows [convention](http://karma-runner.github.io/4.0/dev/git-commit-msg.html)
+ 3. All tests pass locally, UI and Unit tests
+ 4. All business logic and validations must be on the server-side
+ 5. Update necessary Documentation
+ 6. Put `closes #XXXX` in your comment to auto-close the issue that your PR fixes
 
-### Steps to reproduce 
 
-### Checklist
+Also, if you're new here
 
-- [ ] Choose the correct target branch; use `develop` by default.
-- [ ] Provide a brief summary of the changes introduced.
-- [ ] Add a detailed explanation of how to reproduce the issue and/or verify the fix, if applicable.
-- [ ] Include screenshots or videos, if applicable.
-- [ ] Add or modify existing integration tests in case of bugs or new features, if applicable.
-- [ ] Refactor any modified SCSS files following the refactor guide.
-- [ ] Check CI passes successfully.
-- [ ] Update the `CHANGES.md` file, referencing the related GitHub issue, if applicable.
+- Contribution Guide => https://github.com/uxbox/uxbox/blob/develop/CONTRIBUTING.md
 
-<!-- For more details, check the contribution guidelines: https://github.com/penpot/penpot/blob/develop/CONTRIBUTING.md -->
+-->
+
+> Please provide enough information so that others can review your pull request:
+
+<!-- You can skip this if you're fixing a typo or updating existing documentation -->
+
+> Explain the **details** for making this change. What existing problem does the pull request solve?
+
+<!-- Example: When "Adding a function to do X", explain why it is necessary to have a way to do X. -->
+
+> Screenshots/GIFs
+
+<!-- Add images/recordings to better visualize the change: expected/current behviour -->

.github/workflows/build-bundle.yml

@@ -1,93 +0,0 @@
-name: Bundles Builder
-
-on:
-  # Create bundle from manual action
-  workflow_dispatch:
-    inputs:
-      gh_ref:
-        description: 'Name of the branch or ref'
-        type: string
-        required: true
-        default: 'develop'
-      build_wasm:
-        description: 'BUILD_WASM. Valid values: yes, no'
-        type: string
-        required: false
-        default: 'yes'
-      build_storybook:
-        description: 'BUILD_STORYBOOK. Valid values: yes, no'
-        type: string
-        required: false
-        default: 'yes'
-  workflow_call:
-    inputs:
-      gh_ref:
-        description: 'Name of the branch or ref'
-        type: string
-        required: true
-        default: 'develop'
-      build_wasm:
-        description: 'BUILD_WASM. Valid values: yes, no'
-        type: string
-        required: false
-        default: 'yes'
-      build_storybook:
-        description: 'BUILD_STORYBOOK. Valid values: yes, no'
-        type: string
-        required: false
-        default: 'yes'
-
-jobs:
-  build-bundle:
-    name: Build and Upload Penpot Bundle
-    runs-on: ubuntu-24.04
-    env:
-      AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
-      AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
-      AWS_DEFAULT_REGION: ${{ secrets.AWS_REGION }}
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-          ref: ${{ inputs.gh_ref }}
-
-      - name: Extract some useful variables
-        id: vars
-        run: |
-          echo "gh_ref=${{ inputs.gh_ref || github.ref_name }}" >> $GITHUB_OUTPUT
-          echo "bundle_version=$(git describe --tags --always)" >> $GITHUB_OUTPUT
-
-      - name: Build bundle
-        env:
-          BUILD_WASM: ${{ inputs.build_wasm }}
-          BUILD_STORYBOOK: ${{ inputs.build_storybook }}
-        run: ./manage.sh build-bundle
-
-      - name: Prepare directories for zipping
-        run: |
-          mkdir zips
-          mv bundles penpot
-
-      - name: Create zip bundle
-        run: |
-          echo "📦 Packaging Penpot bundle..."
-          zip -r zips/penpot.zip penpot
-
-      - name: Upload Penpot bundle to S3
-        run: |
-          aws s3 cp zips/penpot.zip s3://${{ secrets.S3_BUCKET }}/penpot-${{ steps.vars.outputs.gh_ref }}.zip --metadata bundle-version=${{ steps.vars.outputs.bundle_version }}
-
-      - name: Notify Mattermost
-        if: failure()
-        uses: mattermost/action-mattermost-notify@master
-        with:
-          MATTERMOST_WEBHOOK_URL: ${{ secrets.MATTERMOST_WEBHOOK }}
-          MATTERMOST_CHANNEL: bot-alerts-cicd
-          TEXT: |
-            ❌ 📦 *[PENPOT] Error building penpot bundles.*
-            📄 Triggered from ref: `${{ steps.vars.outputs.gh_ref }}`
-               Bundle version: `${{ steps.vars.outputs.bundle_version }}`
-            🔗 Run: https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }}
-            @infra

.github/workflows/build-develop.yml

@@ -1,21 +0,0 @@
-name: _DEVELOP
-
-on:
-  schedule:
-    - cron: '16 5-20 * * 1-5'
-
-jobs:
-  build-bundle:
-    uses: ./.github/workflows/build-bundle.yml
-    secrets: inherit
-    with:
-      gh_ref: "develop"
-      build_wasm: "yes"
-      build_storybook: "yes"
-
-  build-docker:
-    needs: build-bundle
-    uses: ./.github/workflows/build-docker.yml
-    secrets: inherit
-    with:
-      gh_ref: "develop"

.github/workflows/build-docker-devenv.yml

@@ -1,36 +0,0 @@
-name: DevEnv Docker Image Builder
-
-on:
-  workflow_dispatch:
-
-jobs:
-  build-and-push:
-    name: Build and push DevEnv Docker image
-    environment: release-admins
-    runs-on: ubuntu-24.04
-
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
-
-      - name: Login to Docker Registry
-        uses: docker/login-action@v3
-        with:
-          username: ${{ secrets.PUB_DOCKER_USERNAME }}
-          password: ${{ secrets.PUB_DOCKER_PASSWORD }}
-
-      - name: Build and push DevEnv Docker image
-        uses: docker/build-push-action@v6
-        env:
-          DOCKER_IMAGE: 'penpotapp/devenv'
-        with:
-          context: ./docker/devenv/
-          file: ./docker/devenv/Dockerfile
-          platforms: linux/amd64,linux/arm64
-          push: true
-          tags: ${{ env.DOCKER_IMAGE }}:latest
-          cache-from: type=registry,ref=${{ env.DOCKER_IMAGE }}:buildcache
-          cache-to: type=registry,ref=${{ env.DOCKER_IMAGE }}:buildcache,mode=max

.github/workflows/build-docker.yml

@@ -1,152 +0,0 @@
-name: Docker Images Builder
-
-on:
-  workflow_dispatch:
-    inputs:
-      gh_ref:
-        description: 'Name of the branch or ref'
-        type: string
-        required: true
-        default: 'develop'
-  workflow_call:
-    inputs:
-      gh_ref:
-        description: 'Name of the branch or ref'
-        type: string
-        required: true
-        default: 'develop'
-
-jobs:
-  build-and-push:
-    name: Build and Push Penpot Docker Images
-    runs-on: ubuntu-24.04-arm
-
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-          ref: ${{ inputs.gh_ref }}
-
-      - name: Extract some useful variables
-        id: vars
-        run: |
-          echo "gh_ref=${{ inputs.gh_ref || github.ref_name }}" >> $GITHUB_OUTPUT
-
-      - name: Download Penpot Bundles
-        id: bundles
-        env:
-          FILE_NAME: penpot-${{ steps.vars.outputs.gh_ref }}.zip
-          AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
-          AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
-          AWS_DEFAULT_REGION: ${{ secrets.AWS_REGION }}
-        run: |
-          tmp=$(aws s3api head-object \
-            --bucket ${{ secrets.S3_BUCKET }} \
-            --key "$FILE_NAME" \
-            --query 'Metadata."bundle-version"' \
-            --output text)
-          echo "bundle_version=$tmp" >> $GITHUB_OUTPUT
-          pushd docker/images
-          aws s3 cp s3://${{ secrets.S3_BUCKET }}/$FILE_NAME .
-          unzip $FILE_NAME > /dev/null
-          mv penpot/backend bundle-backend
-          mv penpot/frontend bundle-frontend
-          mv penpot/exporter bundle-exporter
-          mv penpot/storybook bundle-storybook
-          popd
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
-
-      - name: Login to Docker Registry
-        uses: docker/login-action@v3
-        with:
-          registry: ${{ secrets.DOCKER_REGISTRY }}
-          username: ${{ secrets.DOCKER_USERNAME }}
-          password: ${{ secrets.DOCKER_PASSWORD }}
-
-      - name: Extract metadata (tags, labels)
-        id: meta
-        uses: docker/metadata-action@v5
-        with:
-          images:
-            frontend
-            backend
-            exporter
-            storybook
-          labels: |
-            bundle_version=${{ steps.bundles.outputs.bundle_version }}
-
-      - name: Build and push Backend Docker image
-        uses: docker/build-push-action@v6
-        env:
-          DOCKER_IMAGE: 'backend'
-          BUNDLE_PATH: './bundle-backend'
-        with:
-          context: ./docker/images/
-          file: ./docker/images/Dockerfile.backend
-          platforms: linux/amd64,linux/arm64
-          push: true
-          tags: ${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:${{ steps.vars.outputs.gh_ref }}
-          labels: ${{ steps.meta.outputs.labels }}
-          cache-from: type=registry,ref=${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:buildcache
-          cache-to: type=registry,ref=${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:buildcache,mode=max
-
-      - name: Build and push Frontend Docker image
-        uses: docker/build-push-action@v6
-        env:
-          DOCKER_IMAGE: 'frontend'
-          BUNDLE_PATH: './bundle-frontend'
-        with:
-          context: ./docker/images/
-          file: ./docker/images/Dockerfile.frontend
-          platforms: linux/amd64,linux/arm64
-          push: true
-          tags: ${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:${{ steps.vars.outputs.gh_ref }}
-          labels: ${{ steps.meta.outputs.labels }}
-          cache-from: type=registry,ref=${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:buildcache
-          cache-to: type=registry,ref=${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:buildcache,mode=max
-
-      - name: Build and push Exporter Docker image
-        uses: docker/build-push-action@v6
-        env:
-          DOCKER_IMAGE: 'exporter'
-          BUNDLE_PATH: './bundle-exporter'
-        with:
-          context: ./docker/images/
-          file: ./docker/images/Dockerfile.exporter
-          platforms: linux/amd64,linux/arm64
-          push: true
-          tags: ${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:${{ steps.vars.outputs.gh_ref }}
-          labels: ${{ steps.meta.outputs.labels }}
-          cache-from: type=registry,ref=${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:buildcache
-          cache-to: type=registry,ref=${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:buildcache,mode=max
-
-      - name: Build and push Storybook Docker image
-        uses: docker/build-push-action@v6
-        env:
-          DOCKER_IMAGE: 'storybook'
-          BUNDLE_PATH: './bundle-storybook'
-        with:
-          context: ./docker/images/
-          file: ./docker/images/Dockerfile.storybook
-          platforms: linux/amd64,linux/arm64
-          push: true
-          tags: ${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:${{ steps.vars.outputs.gh_ref }}
-          labels: ${{ steps.meta.outputs.labels }}
-          cache-from: type=registry,ref=${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:buildcache
-          cache-to: type=registry,ref=${{ secrets.DOCKER_REGISTRY }}/${{ env.DOCKER_IMAGE }}:buildcache,mode=max
-
-      - name: Notify Mattermost
-        if: failure()
-        uses: mattermost/action-mattermost-notify@master
-        with:
-          MATTERMOST_WEBHOOK_URL: ${{ secrets.MATTERMOST_WEBHOOK }}
-          MATTERMOST_CHANNEL: bot-alerts-cicd
-          TEXT: |
-            ❌ 🐳 *[PENPOT] Error building penpot docker images.*
-            📄 Triggered from ref: `${{ steps.vars.outputs.gh_ref }}`
-            📦 Bundle: `${{ steps.bundles.outputs.bundle_version }}`
-            🔗 Run: https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }}
-            @infra

.github/workflows/build-nitrate-module.yml

@@ -1,21 +0,0 @@
-name: _NITRATE MODULE
-
-on:
-  schedule:
-    - cron: '36 5-20 * * 1-5'
-
-jobs:
-  build-bundle:
-    uses: ./.github/workflows/build-bundle.yml
-    secrets: inherit
-    with:
-      gh_ref: "nitrate-module"
-      build_wasm: "yes"
-      build_storybook: "yes"
-
-  build-docker:
-    needs: build-bundle
-    uses: ./.github/workflows/build-docker.yml
-    secrets: inherit
-    with:
-      gh_ref: "nitrate-module"

.github/workflows/build-staging.yml

@@ -1,21 +0,0 @@
-name: _STAGING
-
-on:
-  schedule:
-    - cron: '36 5-20 * * 1-5'
-
-jobs:
-  build-bundle:
-    uses: ./.github/workflows/build-bundle.yml
-    secrets: inherit
-    with:
-      gh_ref: "staging"
-      build_wasm: "yes"
-      build_storybook: "yes"
-
-  build-docker:
-    needs: build-bundle
-    uses: ./.github/workflows/build-docker.yml
-    secrets: inherit
-    with:
-      gh_ref: "staging"

.github/workflows/build-tag.yml

@@ -1,46 +0,0 @@
-name: _TAG
-
-on:
-  push:
-    tags:
-      - '*'
-
-jobs:
-  build-bundle:
-    uses: ./.github/workflows/build-bundle.yml
-    secrets: inherit
-    with:
-      gh_ref: ${{ github.ref_name }}
-      build_wasm: "yes"
-      build_storybook: "yes"
-
-  build-docker:
-    needs: build-bundle
-    uses: ./.github/workflows/build-docker.yml
-    secrets: inherit
-    with:
-      gh_ref: ${{ github.ref_name }}
-
-  notify:
-    name: Notifications
-    runs-on: ubuntu-24.04
-    needs: build-docker
-
-    steps:
-      - name: Notify Mattermost
-        uses: mattermost/action-mattermost-notify@master
-        with:
-          MATTERMOST_WEBHOOK_URL: ${{ secrets.MATTERMOST_WEBHOOK }}
-          MATTERMOST_CHANNEL: bot-alerts-cicd
-          TEXT: |
-            🐳 *[PENPOT] Docker image available.*
-            🔗 Run: https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }}
-            @infra
-
-  publish-final-tag:
-    if: ${{ !contains(github.ref_name, '-RC') && !contains(github.ref_name, '-alpha') && !contains(github.ref_name, '-beta')  && contains(github.ref_name, '.') }}
-    needs: build-docker
-    uses: ./.github/workflows/release.yml
-    secrets: inherit
-    with:
-      gh_ref: ${{ github.ref_name }}

.github/workflows/commit-checker.yml

@@ -1,50 +0,0 @@
-name: 'Commit Message Check'
-on:
-  pull_request:
-    types:
-      - opened
-      - edited
-      - reopened
-      - synchronize
-  pull_request_target:
-    types:
-      - opened
-      - edited
-      - reopened
-      - synchronize
-  push:
-    branches:
-      - main
-      - develop
-      - staging
-
-jobs:
-  check-commit-message:
-    name: Check Commit Message
-    runs-on: ubuntu-latest
-    steps:
-      - name: Check Commit Type
-        uses: gsactions/commit-message-checker@v2
-        with:
-          pattern: '^(((:(lipstick|globe_with_meridians|wrench|books|arrow_up|arrow_down|zap|ambulance|construction|boom|fire|whale|bug|sparkles|paperclip|tada|recycle|rewind|construction_worker):)\s[A-Z].*[^.])|(Merge|Revert).+[^.])$'
-          flags: 'gm'
-          error: 'Commit should match CONTRIBUTING.md guideline'
-          checkAllCommitMessages: 'true' # optional: this checks all commits associated with a pull request
-          accessToken: ${{ secrets.GITHUB_TOKEN }} # github access token is only required if checkAllCommitMessages is true
-
-      # - name: Check Line Length
-      #   uses: gsactions/commit-message-checker@v2
-      #   with:
-      #     pattern: '^[^#].{74}'
-      #     error: 'The maximum line length of 74 characters is exceeded.'
-      #     excludeDescription: 'true' # optional: this excludes the description body of a pull request
-      #     excludeTitle: 'true' # optional: this excludes the title of a pull request
-      #     checkAllCommitMessages: 'true' # optional: this checks all commits associated with a pull request
-      #     accessToken: ${{ secrets.GITHUB_TOKEN }} # github access token is only required if checkAllCommitMessages is ue
-      # - name: Check for Resolves / Fixes
-      #   uses: gsactions/commit-message-checker@v2
-      #   with:
-      #     pattern: '^.+(Resolves|Fixes): \#[0-9]+$'
-      #     error: 'You need at least one "Resolves|Fixes: #<issue number>" line.'
-
-

.github/workflows/release.yml

@@ -1,114 +0,0 @@
-name: Release Publisher
-
-on:
-  workflow_dispatch:
-    inputs:
-      gh_ref:
-        description: 'Tag to release'
-        type: string
-        required: true
-  workflow_call:
-    inputs:
-      gh_ref:
-        description: 'Tag to release'
-        type: string
-        required: true
-
-permissions:
-  contents: write
-
-jobs:
-  release:
-    environment: release-admins
-    runs-on: ubuntu-24.04
-    outputs:
-      version: ${{ steps.vars.outputs.gh_ref }}
-      release_notes: ${{ steps.extract_release_notes.outputs.release_notes }}
-    steps:
-      - name: Extract some useful variables
-        id: vars
-        run: |
-          echo "gh_ref=${{ inputs.gh_ref || github.ref_name }}" >> $GITHUB_OUTPUT
-
-      - name: Checkout code
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-          ref: ${{ steps.vars.outputs.gh_ref }}
-
-      # --- Publicly release the docker images ---
-      - name: Configure ECR credentials
-        uses: aws-actions/configure-aws-credentials@v4
-        with:
-          aws-access-key-id: ${{ secrets.DOCKER_USERNAME }}
-          aws-secret-access-key: ${{ secrets.DOCKER_PASSWORD }}
-          aws-region: ${{ secrets.AWS_REGION }}
-
-      - name: Install Skopeo
-        run: |
-          sudo apt-get update -y
-          sudo apt-get install -y skopeo
-
-      - name: Copy images from AWS ECR to Docker Hub
-        env:
-          AWS_REGION: ${{ secrets.AWS_REGION }}
-          DOCKER_REGISTRY: ${{ secrets.DOCKER_REGISTRY }}
-          PUB_DOCKER_USERNAME: ${{ secrets.PUB_DOCKER_USERNAME }}
-          PUB_DOCKER_PASSWORD: ${{ secrets.PUB_DOCKER_PASSWORD }}
-          TAG: ${{ steps.vars.outputs.gh_ref }}
-        run: |
-          aws ecr get-login-password --region $AWS_REGION | \
-            skopeo login --username AWS --password-stdin \
-            $DOCKER_REGISTRY
-
-          echo "$PUB_DOCKER_PASSWORD" | skopeo login --username "$PUB_DOCKER_USERNAME" --password-stdin docker.io
-
-          IMAGES=("frontend" "backend" "exporter" "storybook")
-
-          for image in "${IMAGES[@]}"; do
-            skopeo copy --all \
-              docker://$DOCKER_REGISTRY/$image:$TAG \
-              docker://docker.io/penpotapp/$image:$TAG
-
-            for alias in main latest; do
-              skopeo copy --all \
-                docker://$DOCKER_REGISTRY/$image:$TAG \
-                docker://docker.io/penpotapp/$image:$alias
-            done
-          done
-
-      # --- Release notes extraction ---
-      - name: Extract release notes from CHANGES.md
-        id: extract_release_notes
-        env:
-          TAG: ${{ steps.vars.outputs.gh_ref }}
-        run: |
-          RELEASE_NOTES=$(awk "/^## $TAG$/{flag=1; next} /^## /{flag=0} flag" CHANGES.md | awk '{$1=$1};1')
-          if [ -z "$RELEASE_NOTES" ]; then
-            RELEASE_NOTES="No changes for $TAG according to CHANGES.md"
-          fi
-          echo "release_notes<<EOF" >> $GITHUB_OUTPUT
-          echo "$RELEASE_NOTES" >> $GITHUB_OUTPUT
-          echo "EOF" >> $GITHUB_OUTPUT
-
-      # --- Create GitHub release ---
-      - name: Create GitHub release
-        uses: softprops/action-gh-release@v1
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        with:
-          tag_name: ${{ steps.vars.outputs.gh_ref }}
-          name: ${{ steps.vars.outputs.gh_ref }}
-          body: ${{ steps.extract_release_notes.outputs.release_notes }}
-
-      - name: Notify Mattermost
-        if: failure()
-        uses: mattermost/action-mattermost-notify@master
-        with:
-          MATTERMOST_WEBHOOK_URL: ${{ secrets.MATTERMOST_WEBHOOK }}
-          MATTERMOST_CHANNEL: bot-alerts-cicd
-          TEXT: |
-            ❌ 🚀 *[PENPOT] Error releasing penpot.*
-            📄 Triggered from ref: `${{ steps.vars.outputs.gh_ref }}`
-            🔗 Run: https://github.com/${{ github.repository }}/actions/runs/${{ github.run_id }}
-            @infra

.github/workflows/tests.yml

@@ -1,289 +0,0 @@
-name: "CI"
-
-defaults:
-  run:
-    shell: bash
-
-on:
-  pull_request:
-    types:
-      - opened
-      - synchronize
-  push:
-    branches:
-      - develop
-      - staging
-
-concurrency:
-  group: ${{ github.event.pull_request.number || github.ref }}
-  cancel-in-progress: true
-
-jobs:
-  lint:
-    name: "Linter"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Check clojure code format
-        run: |
-          ./scripts/lint
-
-  test-common:
-    name: "Common Tests"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Run tests on JVM
-        working-directory: ./common
-        run: |
-          clojure -M:dev:test
-
-      - name: Run tests on NODE
-        working-directory: ./common
-        run: |
-          ./scripts/test
-
-  test-frontend:
-    name: "Frontend Tests"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Unit Tests
-        working-directory: ./frontend
-        run: |
-          ./scripts/test
-
-      - name: Component Tests
-        working-directory: ./frontend
-        run: |
-          ./scripts/test-components
-
-  test-render-wasm:
-    name: "Render WASM Tests"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Format
-        working-directory: ./render-wasm
-        run: |
-          cargo fmt --check
-
-      - name: Lint
-        working-directory: ./render-wasm
-        run: |
-          ./lint
-
-      - name: Test
-        working-directory: ./render-wasm
-        run: |
-          ./test
-
-  test-backend:
-    name: "Backend Tests"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-
-    services:
-      postgres:
-        image: postgres:17
-        # Provide the password for postgres
-        env:
-          POSTGRES_USER: penpot_test
-          POSTGRES_PASSWORD: penpot_test
-          POSTGRES_DB: penpot_test
-
-        # Set health checks to wait until postgres has started
-        options: >-
-          --health-cmd pg_isready
-          --health-interval 10s
-          --health-timeout 5s
-          --health-retries 5
-
-      redis:
-        image: valkey/valkey:9
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Run tests
-        working-directory: ./backend
-        env:
-          PENPOT_TEST_DATABASE_URI: "postgresql://postgres/penpot_test"
-          PENPOT_TEST_DATABASE_USERNAME: penpot_test
-          PENPOT_TEST_DATABASE_PASSWORD: penpot_test
-          PENPOT_TEST_REDIS_URI: "redis://redis/1"
-
-        run: |
-          clojure -M:dev:test --reporter kaocha.report/documentation
-
-  test-library:
-    name: "Library Tests"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Run tests
-        working-directory: ./library
-        run: |
-          ./scripts/test
-
-  build-integration:
-    name: "Build Integration Bundle"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Build Bundle
-        working-directory: ./frontend
-        run: |
-          ./scripts/build 0.0.0
-
-      - name: Store Bundle Cache
-        uses: actions/cache@v4
-        with:
-          key: "integration-bundle-${{ github.sha }}"
-          path: frontend/resources/public
-
-
-  test-integration-1:
-    name: "Integration Tests 1/4"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-    needs: build-integration
-
-    steps:
-      - name: Checkout Repository
-        uses: actions/checkout@v4
-
-      - name: Restore Cache
-        uses: actions/cache/restore@v4
-        with:
-          key: "integration-bundle-${{ github.sha }}"
-          path: frontend/resources/public
-
-      - name: Run Tests
-        working-directory: ./frontend
-        run: |
-          ./scripts/test-e2e --shard="1/4";
-
-      - name: Upload test result
-        uses: actions/upload-artifact@v4
-        if: always()
-        with:
-          name: integration-tests-result-1
-          path: frontend/test-results/
-          overwrite: true
-          retention-days: 3
-
-  test-integration-2:
-    name: "Integration Tests 2/4"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-    needs: build-integration
-
-    steps:
-      - name: Checkout Repository
-        uses: actions/checkout@v4
-
-      - name: Restore Cache
-        uses: actions/cache/restore@v4
-        with:
-          key: "integration-bundle-${{ github.sha }}"
-          path: frontend/resources/public
-
-      - name: Run Tests
-        working-directory: ./frontend
-        run: |
-          ./scripts/test-e2e --shard="2/4";
-
-      - name: Upload test result
-        uses: actions/upload-artifact@v4
-        if: always()
-        with:
-          name: integration-tests-result-2
-          path: frontend/test-results/
-          overwrite: true
-          retention-days: 3
-
-  test-integration-3:
-    name: "Integration Tests 3/4"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-    needs: build-integration
-
-    steps:
-      - name: Checkout Repository
-        uses: actions/checkout@v4
-
-      - name: Restore Cache
-        uses: actions/cache/restore@v4
-        with:
-          key: "integration-bundle-${{ github.sha }}"
-          path: frontend/resources/public
-
-      - name: Run Tests
-        working-directory: ./frontend
-        run: |
-          ./scripts/test-e2e --shard="3/4";
-
-      - name: Upload test result
-        uses: actions/upload-artifact@v4
-        if: always()
-        with:
-          name: integration-tests-result-3
-          path: frontend/test-results/
-          overwrite: true
-          retention-days: 3
-
-  test-integration-4:
-    name: "Integration Tests 4/4"
-    runs-on: ubuntu-24.04
-    container: penpotapp/devenv:latest
-    needs: build-integration
-
-    steps:
-      - name: Checkout Repository
-        uses: actions/checkout@v4
-
-      - name: Restore Cache
-        uses: actions/cache/restore@v4
-        with:
-          key: "integration-bundle-${{ github.sha }}"
-          path: frontend/resources/public
-
-      - name: Run Tests
-        working-directory: ./frontend
-        run: |
-          ./scripts/test-e2e --shard="4/4";
-
-      - name: Upload test result
-        uses: actions/upload-artifact@v4
-        if: always()
-        with:
-          name: integration-tests-result-4
-          path: frontend/test-results/
-          overwrite: true
-          retention-days: 3

.gitignore

@@ -1,16 +1,7 @@
-.pnp.*
-.yarn/*
-!.yarn/patches
-!.yarn/plugins
-!.yarn/releases
-!.yarn/sdks
-!.yarn/versions
 *-init.clj
-*.css.json
 *.jar
 *.orig
 *.penpot
-*.css.json
 .calva
 .clj-kondo
 .cpcache
@@ -23,15 +14,12 @@
 /*.jpg
 /*.md
 /*.png
-/*.svg
 /*.sql
 /*.txt
 /*.yml
 /*.zip
 /.clj-kondo/.cache
 /_dump
-/notes
-/playground/
 /backend/*.md
 /backend/*.sql
 /backend/*.txt
@@ -42,7 +30,6 @@
 /backend/resources/public/assets
 /backend/resources/public/media
 /backend/target/
-/backend/experiments
 /bundle*
 /cd.md
 /clj-profiler/
@@ -51,15 +38,15 @@
 /deploy
 /docker/images/bundle*
 /exporter/target
-/frontend/.storybook/preview-body.html
-/frontend/.storybook/preview-head.html
+/frontend/cypress/fixtures/validuser.json
+/frontend/cypress/videos/*/
+/frontend/cypress/videos/*/
 /frontend/dist/
 /frontend/npm-debug.log
 /frontend/out/
 /frontend/package-lock.json
 /frontend/resources/fonts/experiments
 /frontend/resources/public/*
-/frontend/storybook-static/
 /frontend/target/
 /other/
 /scripts/
@@ -68,16 +55,5 @@
 /vendor/**/target
 /vendor/svgclean/bundle*.js
 /web
-/library/target/
-/library/*.zip
-/external
-
 clj-profiler/
 node_modules
-/test-results/
-/playwright-report/
-/blob-report/
-/playwright/.cache/
-/render-wasm/target/
-/**/.yarn/*
-/.pnpm-store

.nvmrc

@@ -1 +0,0 @@
-v22.19.0

.vscode/settings.json

@@ -1,9 +0,0 @@
-{
-  "files.exclude": {
-    "**/.clj-kondo": true,
-    "**/.cpcache": true,
-    "**/.lsp": true,
-    "**/.shadow-cljs": true,
-    "**/node_modules": true
-  }
-}

.yarnrc.yml

@@ -1,11 +0,0 @@
-enableGlobalCache: true
-
-enableImmutableCache: false
-
-enableImmutableInstalls: false
-
-enableTelemetry: false
-
-httpTimeout: 600000
-
-nodeLinker: node-modules

CODE_OF_CONDUCT.md

@@ -1,3 +0,0 @@
-# Penpot's Code of Conduct
-
-Check it at: https://help.penpot.app/contributing-guide/coc/

CONTRIBUTING.md

@@ -1,59 +1,62 @@
 # Contributing Guide #
 
 Thank you for your interest in contributing to Penpot. This is a
-generic guide that details how to contribute to the project in a way that
-is efficient for everyone. If you are looking for specific documentation on
-different parts of the platform, please refer to the `docs/` directory,
-or the rendered version at the [Help Center](https://help.penpot.app/).
+generic guide that details how to contribute to Penpot in a way that
+is efficient for everyone. If you want a specific documentation for
+different parts of the platform, please refer to `docs/` directory.
+
 
 ## Reporting Bugs ##
 
 We are using [GitHub Issues](https://github.com/penpot/penpot/issues)
-for our public bugs. We keep a close eye on them and try to make it
+for our public bugs. We keep a close eye on this and try to make it
 clear when we have an internal fix in progress. Before filing a new
 task, try to make sure your problem doesn't already exist.
 
-If you found a bug, please report it, as far as possible, with:
+If you found a bug, please report it, as far as possible with:
 
 - a detailed explanation of steps to reproduce the error
-- the browser and browser version used
-- a dev tools console exception stack trace (if available)
+- a browser and the browser version used
+- a dev tools console exception stack trace (if it is available)
 
-If you found a bug which you think is better to discuss in private (for
-example, security bugs), consider first sending an email to
+If you found a bug that you consider better discuss in private (for
+example: security bugs), consider first send an email to
 `support@penpot.app`.
 
-**We don't have a formal bug bounty program for security reports; this
-is an open source application, and your contribution will be recognized
+**We don't have formal bug bounty program for security reports; this
+is an open source application and your contribution will be recognized
 in the changelog.**
 
 
-## Pull Requests ##
+## Pull requests ##
 
-If you want to propose a change or bug fix via a pull request (PR),
-you should first carefully read the section **Developer's Certificate of
-Origin**. You must also format your code and commits according to the
-instructions below.
+If you want propose a change or bug fix with the Pull-Request system
+firstly you should carefully read the **DCO** section and format your
+commits accordingly.
 
-If you intend to fix a bug, it's fine to submit a pull request right
-away, but we still recommend filing an issue detailing what you're
+If you intend to fix a bug it's fine to submit a pull request right
+away but we still recommend to file an issue detailing what you're
 fixing. This is helpful in case we don't accept that specific fix but
 want to keep track of the issue.
 
-If you want to implement or start working on a new feature, please
-open a **question*- / **discussion*- issue for it. No PR
-will be accepted without a prior discussion about the changes,
-whether it is a new feature, an already planned one, or a quick win.
+If you want to implement or start working in a new feature, please
+open a **question** / **discussion** issue for it. No pull-request
+will be accepted without previous chat about the changes,
+independently if it is a new feature, already planned feature or small
+quick win.
 
-If it is your first PR, you can learn how to proceed from
-[this free video
-series](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github)
+If is going to be your first pull request, You can learn how from this
+free video series:
+
+https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github
+
+We will use the `easy fix` mark for tag for indicate issues that are
+easy for beginners.
 
-We use the `easy fix` tag to indicate issues that are appropriate for beginners.
 
 ## Commit Guidelines ##
 
-We have very precise rules on how our git commit messages must be formatted.
+We have very precise rules over how our git commit messages can be formatted.
 
 The commit message format is:
 
@@ -68,73 +71,47 @@ The commit message format is:
 Where type is:
 
 - :bug: `:bug:` a commit that fixes a bug
-- :sparkles: `:sparkles:` a commit that adds an improvement
-- :tada: `:tada:` a commit with a new feature
+- :sparkles: `:sparkles:` a commit that an improvement
+- :tada: `:tada:` a commit with new feature
 - :recycle: `:recycle:` a commit that introduces a refactor
 - :lipstick: `:lipstick:` a commit with cosmetic changes
-- :ambulance: `:ambulance:` a commit that fixes a critical bug
+- :ambulance: `:ambulance:` a commit that fixes critical bug
 - :books: `:books:` a commit that improves or adds documentation
-- :construction: `:construction:` a WIP commit
+- :construction: `:construction:`: a wip commit
 - :boom: `:boom:` a commit with breaking changes
 - :wrench: `:wrench:` a commit for config updates
 - :zap: `:zap:` a commit with performance improvements
-- :whale: `:whale:` a commit for Docker-related stuff
-- :paperclip: `:paperclip:` a commit with other non-relevant changes
-- :arrow_up: `:arrow_up:` a commit with dependency updates
-- :arrow_down: `:arrow_down:` a commit with dependency downgrades
-- :fire: `:fire:` a commit that removes files or code
-- :globe_with_meridians: `:globe_with_meridians:` a commit that adds or updates
-  translations
+- :whale: `:whale:` a commit for docker related stuff
+- :rewind: `:rewind:` a commit that reverts changes
+- :paperclip: `:paperclip:` a commit with other not relevant changes
+- :arrow_up: `:arrow_up:` a commit with dependencies updates
 
 More info:
-
  - https://gist.github.com/parmentf/035de27d6ed1dce0b36a
  - https://gist.github.com/rxaviers/7360908
 
 Each commit should have:
 
-- A concise subject using the imperative mood.
-- The subject should capitalize the first letter, omit the period
-  at the end, and be no longer than 65 characters.
+- A concise subject using imperative mood.
+- The subject should have capitalized the first letter, without period
+  at the end and no larger than 65 characters.
 - A blank line between the subject line and the body.
-- An entry in the CHANGES.md file if applicable, referencing the
-  GitHub or Taiga issue/user story using these same rules.
+- An entry on the CHANGES.md file if applicable, referencing the
+  github or taiga issue/user-story using the these same rules.
 
 Examples of good commit messages:
 
-- `:bug: Fix unexpected error on launching modal`
-- `:bug: Set proper error message on generic error`
-- `:sparkles: Enable new modal for profile`
-- `:zap: Improve performance of dashboard navigation`
-- `:wrench: Update default backend configuration`
-- `:books: Add more documentation for authentication process`
-- `:ambulance: Fix critical bug on user registration process`
-- `:tada: Add new approach for user registration`
+- :bug: Fix unexpected error on launching modal
+- :bug: Set proper error message on generic error
+- :sparkles: Enable new modal for profile
+- :zap: Improve performance of dashboard navigation
+- :wrench: Update default backend configuration
+- :books: Add more documentation for authentication process
+- :ambulance: Fix critical bug on user registration process
+- :tada: Add new approach for user registration
 
-## Formatting and Linting ##
 
-You will want to make sure your code is formatted and linted before submitting
-a PR. We use [cljfmt](https://github.com/weavejester/cljfmt) and
-[clj-kondo](https://github.com/clj-kondo/clj-kondo) for this. After installing
-them on your system, you can run them with:
-
-```bash
-# Check formatting
-yarn fmt:clj:check
-
-# Check and fix formatting
-yarn fmt:clj
-
-# Run the linter
-yarn lint:clj
-```
-
-There are more choices in `package.json`.
-
-Ideally, you should run these commands as git pre-commit hooks. A convenient way
-of defining them is to use [Husky](https://typicode.github.io/husky/#/).
-
-## Code of Conduct ##
+## Code of conduct ##
 
 As contributors and maintainers of this project, we pledge to respect
 all people who contribute through reporting issues, posting feature
@@ -154,11 +131,11 @@ unprofessional conduct.
 
 Project maintainers have the right and responsibility to remove, edit,
 or reject comments, commits, code, wiki edits, issues, and other
-contributions that are not aligned with this Code of Conduct. Project
+contributions that are not aligned to this Code of Conduct. Project
 maintainers who do not follow the Code of Conduct may be removed from
 the project team.
 
-This Code of Conduct applies both within project spaces and in public
+This code of conduct applies both within project spaces and in public
 spaces when an individual is representing the project or its
 community.
 
@@ -167,11 +144,12 @@ may be reported by opening an issue or contacting one or more of the
 project maintainers.
 
 This Code of Conduct is adapted from the Contributor Covenant, version
-1.1.0, available from [http://contributor-covenant.org/version/1/1/0/](http://contributor-covenant.org/version/1/1/0/)
+1.1.0, available from http://contributor-covenant.org/version/1/1/0/
 
-## Developer's Certificate of Origin (DCO)
 
-By submitting code you agree to and can certify the following:
+## Developer's Certificate of Origin (DCO) ##
+
+By submitting code you are agree and can certify the below:
 
     Developer's Certificate of Origin 1.1
 
@@ -199,15 +177,13 @@ By submitting code you agree to and can certify the following:
         maintained indefinitely and may be redistributed consistent with
         this project or the open source license(s) involved.
 
-Then, all your code patches (**documentation is excluded**) should
+Then, all your code patches (**documentation are excluded**) should
 contain a sign-off at the end of the patch/commit description body. It
-can be automatically added by adding the `-s` parameter to `git commit`.
+can be automatically added on adding `-s` parameter to `git commit`.
 
-This is an example of what the line should look like:
+This is an example of the aspect of the line:
 
-```
-Signed-off-by: Andrey Antukh <niwi@niwi.nz>
-```
+	Signed-off-by: Andrey Antukh <niwi@niwi.nz>
 
 Please, use your real name (sorry, no pseudonyms or anonymous
 contributions are allowed).

README.md

@@ -2,108 +2,84 @@
 [uri_license]: https://www.mozilla.org/en-US/MPL/2.0
 [uri_license_image]: https://img.shields.io/badge/MPL-2.0-blue.svg
 
-<picture>
-  <source media="(prefers-color-scheme: dark)" srcset="https://penpot.app/images/readme/github-dark-mode.png">
-  <source media="(prefers-color-scheme: light)" srcset="https://penpot.app/images/readme/github-light-mode.png">
-  <img alt="penpot header image" src="https://penpot.app/images/readme/github-light-mode.png">
-</picture>
+<h1 align="center">
+  <br>
+  <img src="https://penpot.app/images/readme/readme-logo.jpg" alt="PENPOT">
+</h1>
+
+<p align="center"><a href="https://www.mozilla.org/en-US/MPL/2.0" rel="nofollow"><img src="https://camo.githubusercontent.com/3fcf3d6b678ea15fde3cf7d6af0e242160366282d62a7c182d83a50bfee3f45e/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4d504c2d322e302d626c75652e737667" alt="License: MPL-2.0" data-canonical-src="https://img.shields.io/badge/MPL-2.0-blue.svg" style="max-width:100%;"></a>
+<a href="https://gitter.im/penpot/community" rel="nofollow"><img src="https://camo.githubusercontent.com/5b0aecb33434f82a7b158eab7247544235ada0cf7eeb9ce8e52562dd67f614b7/68747470733a2f2f6261646765732e6769747465722e696d2f736572656e6f2d78797a2f636f6d6d756e6974792e737667" alt="Gitter" data-canonical-src="https://badges.gitter.im/sereno-xyz/community.svg" style="max-width:100%;"></a>
+<a href="https://tree.taiga.io/project/penpot/" title="Managed with Taiga.io" rel="nofollow"><img src="https://camo.githubusercontent.com/4a1d1112f0272e3393b1e8da312ff4435418e9e2eb4c0964881e3680f90a653c/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6d616e61676564253230776974682d54414947412e696f2d3730396631342e737667" alt="Managed with Taiga.io" data-canonical-src="https://img.shields.io/badge/managed%20with-TAIGA.io-709f14.svg" style="max-width:100%;"></a>
+<a href="https://gitpod.io/#https://github.com/penpot/penpot" rel="nofollow"><img src="https://camo.githubusercontent.com/daadb4894128d1e19b72d80236f5959f1f2b47f9fe081373f3246131f0189f6c/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f476974706f642d72656164792d2d746f2d2d636f64652d626c75653f6c6f676f3d676974706f64" alt="Gitpod ready-to-code" data-canonical-src="https://img.shields.io/badge/Gitpod-ready--to--code-blue?logo=gitpod" style="max-width:100%;"></a></p>
 
 <p align="center">
-<a href="https://www.mozilla.org/en-US/MPL/2.0" rel="nofollow"><img alt="License: MPL-2.0" src="https://img.shields.io/badge/MPL-2.0-blue.svg" style="max-width:100%;"></a>
-<a href="https://community.penpot.app" rel="nofollow"><img alt="Penpot Community" src="https://img.shields.io/discourse/posts?server=https%3A%2F%2Fcommunity.penpot.app" style="max-width:100%;"></a>
-<a href="https://tree.taiga.io/project/penpot/" title="Managed with Taiga.io" rel="nofollow"><img alt="Managed with Taiga.io" src="https://img.shields.io/badge/managed%20with-TAIGA.io-709f14.svg" style="max-width:100%;"></a>
-<a href="https://gitpod.io/#https://github.com/penpot/penpot" rel="nofollow"><img alt="Gitpod ready-to-code" src="https://img.shields.io/badge/Gitpod-ready--to--code-blue?logo=gitpod" style="max-width:100%;"></a>
+    <a href="https://penpot.app/"><b>Website</b></a> •
+    <a href="https://help.penpot.app/technical-guide/getting-started/"><b>Getting Started</b></a> •
+    <a href="https://help.penpot.app/user-guide/"><b>User Guide</b></a> •
+    <a href="https://help.penpot.app/user-guide/introduction/info/"><b>Tutorials & Info</b></a> •
+    <a href="https://community.penpot.app/"><b>Community</b></a> •
+    <a href="https://twitter.com/penpotapp"><b>Twitter</b></a> •
+    <a href="https://instagram.com/penpot.app"><b>Instagram</b></a> •
+    <a href="https://fosstodon.org/@penpot/"><b>Mastodon</b></a> •
+    <a href="https://www.youtube.com/channel/UCAqS8G72uv9P5HG1IfgnQ9g"><b>Youtube</b></a>
 </p>
 
-<p align="center">
-    <a href="https://penpot.app/"><b>Website</b></a>  •
-    <a href="https://help.penpot.app/user-guide/"><b>User Guide</b></a>  •
-    <a href="https://penpot.app/learning-center"><b>Learning Center</b></a>  •
-    <a href="https://community.penpot.app/"><b>Community</b></a>
-</p>
-<p align="center">
-    <a href="https://www.youtube.com/@Penpot"><b>Youtube</b></a>  •
-    <a href="https://peertube.kaleidos.net/a/penpot_app/video-channels"><b>Peertube</b></a>  •
-    <a href="https://www.linkedin.com/company/penpot/"><b>Linkedin</b></a>  •
-    <a href="https://instagram.com/penpot.app"><b>Instagram</b></a>  •
-    <a href="https://fosstodon.org/@penpot/"><b>Mastodon</b></a>  •
-    <a href="https://bsky.app/profile/penpot.app"><b>Bluesky</b></a>  •
-    <a href="https://twitter.com/penpotapp"><b>X</b></a>
+![feature-readme](https://user-images.githubusercontent.com/1045247/189871786-0b44f7cf-3a0a-4445-a87b-9919ec398bf7.gif)
 
-</p>
-
-<br />
-
-[Penpot video](https://github.com/user-attachments/assets/7c67fd7c-04d3-4c9b-88ec-b6f5e23f8332
-)
-
-<br />
-
-Penpot is the first **open-source** design tool for design and code collaboration. Designers can create stunning designs, interactive prototypes, design systems at scale, while developers enjoy ready-to-use code and make their workflow easy and fast. And all of this with no handoff drama.
-
-Available on browser or self-hosted, Penpot works with open standards like SVG, CSS, HTML and JSON, and it’s free!
-
-The latest updates take Penpot even further. It’s the first design tool to integrate native [design tokens](https://penpot.dev/collaboration/design-tokens)—a single source of truth to improve efficiency and collaboration between product design and development.
-With the [huge 2.0 release](https://penpot.app/dev-diaries), Penpot took the platform to a whole new level. This update introduces the ground-breaking [CSS Grid Layout feature](https://penpot.app/penpot-2.0), a complete UI redesign, a new Components system, and much more.
-For organizations that need extra service for its teams, [get in touch](https://cal.com/team/penpot/talk-to-us)
-
-🎇 Design, code, and Open Source meet at [Penpot Fest](https://penpot.app/penpotfest)! Be part of the 2025 edition in Madrid, Spain, on October 9-10.
+Penpot is the first **Open Source** design and prototyping platform meant for cross-domain teams. Non dependent on operating systems, Penpot is web based and works with open standards (SVG). Penpot invites designers all over the world to fall in love with open source while getting developers excited about the design process in return.
 
 ## Table of contents ##
 
 - [Why Penpot](#why-penpot)
 - [Getting Started](#getting-started)
 - [Community](#community)
-- [Contributing](#contributing)
 - [Resources](#resources)
 - [License](#license)
 
 ## Why Penpot ##
 
-Penpot expresses designs as code. Designers can do their best work and see it will be beautifully implemented by developers in a two-way collaboration.
+Penpot makes design and prototyping accessible to every team in the world.
 
-### Plugin system ###
-[Penpot plugins](https://penpot.app/penpothub/plugins) let you expand the platform's capabilities, give you the flexibility to integrate it with other apps, and design custom solutions.
+### For cross-domain teams ###
+We have a clear focus on design and code teams and our capabilities reflect exactly that. The less hand-off mindset, the more fun for everyone.
 
-### Designed for developers ###
-Penpot was built to serve both designers and developers and create a fluid design-code process. You have the choice to enjoy real-time collaboration or play "solo".
+### Multiplatform ###
+Being web based, Penpot is not dependent on operating systems or local installations, you will only need to run a modern browser.
 
-### Inspect mode ###
-Work with ready-to-use code and make your workflow easy and fast. The inspect tab gives instant access to SVG, CSS and HTML code.
-
-### Self host your own instance ###
-Provide your team or organization with a completely owned collaborative design tool. Use Penpot's cloud service or deploy your own Penpot server.
-
-### Integrations ###
-Penpot offers integration into the development toolchain, thanks to its support for webhooks and an API accessible through access tokens.
-
-###  Building Design Systems: design tokens, components and variants  ###
-Penpot brings design systems to code-minded teams: a single source of truth with native Design Tokens, Components, and Variants for scalable, reusable, and consistent UI across projects and platforms.
-
-
-<br />
+### Open Standards ###
+Using SVG as no other design and prototyping tool does, Penpot files sport compatibility with most of the vectorial tools, are tech friendly and extremely easy to use on the web. We make sure you will always own your work.
 
 <p align="center">
- <img src="https://github.com/user-attachments/assets/cce75ad6-f783-473f-8803-da9eb8255fef">
+  <img src="https://penpot.app/images/open-source.png" alt="Open Source">
 </p>
 
-<br />
 
 ## Getting started ##
 
-Penpot is the only design & prototype platform that is deployment agnostic. You can use it in our [SAAS](https://design.penpot.app) or deploy it anywhere.
+### Install with Elestio ###
+[Elestio](https://elest.io/) offers a fully managed service for on-premise instances of a selection of open-source software! This means you can deploy a dedicated instance of Penpot in just 3 minutes with no technical knowledge needed.
 
-Learn how to install it with Docker, Kubernetes, Elestio or other options on [our website](https://penpot.app/self-host).
-<br />
+You don’t need to worry about DNS configuration, SMTP, backups, SSL certificates, OS & Penpot upgrades, and much more.
+
+[Get started with Elestio.](https://help.penpot.app/technical-guide/getting-started/#install-with-elestio)
+
+### Install with Docker ###
+
+You can also get started with Penpot locally or self-host it with **docker** and **docker-compose**.
+
+Here’s a step-by-step guide on [getting started with Docker.](https://help.penpot.app/technical-guide/getting-started/#install-with-docker)
+
+### Penpot cloud app ###
+
+If you prefer not to install Penpot in a local environment, [login or register on our Penpot cloud app](https://design.penpot.app). Create a team to work together on projects and share design assets or jump right away into Penpot and **start designing** on your own.
 
 <p align="center">
-  <img src="https://site-assets.plasmic.app/2168cf524dd543caeff32384eb9ea0a1.svg" alt="Open Source" style="width: 65%;">
+  <img src="https://help.penpot.app/img/home-techguide.png" alt="Getting started">
 </p>
-<br />
 
 ## Community ##
 
-We love the Open Source software community. Contributing is our passion and if it’s yours too, participate and [improve](https://community.penpot.app/c/help-us-improve-penpot/7) Penpot. All your designs, code and ideas are welcome!
+We love the open source software community. Contributing is our passion and if it’s yours too, [participate](https://community.penpot.app/) and [improve](https://community.penpot.app/c/help-us-improve-penpot/7) Penpot. All your ideas and code are welcome!
 
 If you need help or have any questions; if you’d like to share your experience using Penpot or get inspired; if you’d rather meet our community of developers and designers, [join our Community](https://community.penpot.app/)!
 
@@ -115,47 +91,29 @@ You will find the following categories:
 - [Events and Announcements](https://community.penpot.app/c/announcements/5)
 - [Inside Penpot](https://community.penpot.app/c/inside-penpot/21)
 - [Penpot in your language](https://community.penpot.app/c/penpot-in-your-language/12)
-- [Design and Code Essentials](https://community.penpot.app/c/design-and-code-essentials/22)
-
-
-<br />
 
 <p align="center">
-  <img src="https://github.com/penpot/penpot/assets/5446186/6ac62220-a16c-46c9-ab21-d24ae357ed03" alt="Community" style="width: 65%;">
+  <img src="https://penpot.app/images/cross-teams.webp" alt="Community">
 </p>
-<br />
-
-### Code of Conduct ###
-
-Anyone who contributes to Penpot, whether through code, in the community, or at an event, must adhere to the
-[code of conduct](https://help.penpot.app/contributing-guide/coc/) and foster a positive and safe environment.
-
 
 ## Contributing ##
 
-Any contribution will make a difference to improve Penpot. How can you get involved?
+Every sort of contribution will be very helpful to enhance Penpot. How you’ll participate? All your ideas, designs and code are welcome:
 
-Choose your way:
-
-- Create and [share Libraries & Templates](https://penpot.app/libraries-templates.html) that will be helpful for the community
 - Invite your [team to join](https://design.penpot.app/#/auth/register)
-- Give this repo a star and follow us on Social Media: [Mastodon](https://fosstodon.org/@penpot/), [Youtube](https://www.youtube.com/c/Penpot), [Instagram](https://instagram.com/penpot.app), [Linkedin](https://www.linkedin.com/company/penpotdesign),  [Peertube](https://peertube.kaleidos.net/a/penpot_app), [X](https://twitter.com/penpotapp) and [BlueSky](https://bsky.app/profile/penpot.app)
-- Participate in the [Community](https://community.penpot.app/) space by asking and answering questions; reacting to others’ articles;  opening your own conversations and following along on decisions affecting the project.
+- Star this repo and follow us on Social Media:  [Twitter](https://twitter.com/penpotapp), [Instagram](https://instagram.com/penpot.app), [Youtube](https://www.youtube.com/c/Penpot) or [Mastodon](https://fosstodon.org/@penpot/).
+- Participate in the [Community](https://community.penpot.app/) asking and answering questions, reacting to others’ articles or opening your own conversations.
 - Report bugs with our easy [guide for bugs hunting](https://help.penpot.app/contributing-guide/reporting-bugs/) or [GitHub issues](https://github.com/penpot/penpot/issues)
+- Create and [share Libraries & templates](https://penpot.app/libraries-templates.html) that will be helpful for the community
 - Become a [translator](https://help.penpot.app/contributing-guide/translations)
-- Give feedback: [Email us](mailto:support@penpot.app)
-- **Contribute to Penpot's code:** [Watch this video](https://www.youtube.com/watch?v=TpN0osiY-8k) by Alejandro Alonso, CIO and developer at Penpot, where he gives us a hands-on demo of how to use Penpot’s repository and make changes in both front and back end
+- Give feedback: [Mail us](mailto:support@penpot.app)
 
-To find (almost) everything you need to know on how to contribute to Penpot, refer to the [contributing guide](https://help.penpot.app/contributing-guide/).
-
-<br />
+To find (almost) everything you need to know on how to contribute to Penpot, refer to the [contributing-guide](https://help.penpot.app/contributing-guide/).
 
 <p align="center">
-  <img src="https://github.com/penpot/penpot/assets/5446186/fea18923-dc06-49be-86ad-c3496a7956e6" alt="Libraries and templates" style="width: 65%;">
+  <img src="https://help.penpot.app/img/home-contributing.png" alt="Contributing">
 </p>
 
-<br />
-
 ## Resources ##
 
 You can ask and answer questions, have open-ended conversations, and follow along on decisions affecting the project.
@@ -166,7 +124,7 @@ You can ask and answer questions, have open-ended conversations, and follow alon
 
 ✏️ [Tutorials](https://www.youtube.com/playlist?list=PLgcCPfOv5v54WpXhHmNO7T-YC7AE-SRsr)
 
-🏘️ [Architecture](https://help.penpot.app/technical-guide/developer/architecture/)
+🏘️ [Architecture](https://help.penpot.app/technical-guide/architecture/)
 
 📚 [Dev Diaries](https://penpot.app/dev-diaries.html)
 
@@ -180,4 +138,4 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
 Copyright (c) KALEIDOS INC
 ```
-Penpot is a Kaleidos’ [open source project](https://kaleidos.net/)
+Penpot is a Kaleidos’ [open source project](https://kaleidos.net/products)

THANKYOU.md

@@ -2,35 +2,27 @@
 
 We want to thank to the amazing people that help us! Thank you! You're the best!
 
-Feel free you make a PR updating this file if you miss you in the
-list.
-
 ## Security
-
 * Husnain Iqbal (CEO OF ALPHA INFERNO PVT LTD)
 * [Shiraz Ali Khan](https://www.linkedin.com/in/shiraz-ali-khan-1ba508180/)
-* Vaibhav Shukla
-* Hassan Ahmed (Alias Xen Lee)
-* Michal Biesiada (@mbiesiad)
 
 ## Internationalization
-
 * [00ff88](https://hosted.weblate.org/user/00ff88)
 * [AhmadHB](https://hosted.weblate.org/user/AhmadHB)
 * [Aimee](https://hosted.weblate.org/user/Aimee)
-* [alejandro.alonso](https://hosted.weblate.org/user/alejandro.alonso)
+* [alejandro.alonso](alejandro.https://hosted.weblate.org/user/alonso)
 * [alexpawlak](https://hosted.weblate.org/user/alexpawlak)
 * [allytiago](https://hosted.weblate.org/user/allytiago)
-* [alonso.torres](https://hosted.weblate.org/user/alonso.torres)
-* [andres.moya](https://hosted.weblate.org/user/andres.moya)
+* [alonso.torres](alonso.https://hosted.weblate.org/user/torres)
+* [andres.moya](andres.https://hosted.weblate.org/user/moya)
 * [antoniofsm](https://hosted.weblate.org/user/antoniofsm)
 * [ascarida](https://hosted.weblate.org/user/ascarida)
 * [Bechii](https://hosted.weblate.org/user/Bechii)
 * [Beeby](https://hosted.weblate.org/user/Beeby)
-* [bingling-sama](https://hosted.weblate.org/user/bingling-sama)
+* [bingling-sama](bingling-https://hosted.weblate.org/user/sama)
 * [devadarta](https://hosted.weblate.org/user/devadarta)
 * [diacritica](https://hosted.weblate.org/user/diacritica)
-* [dundzys.vincas](https://hosted.weblate.org/user/dundzys.vincas)
+* [dundzys.vincas](dundzys.https://hosted.weblate.org/user/vincas)
 * [Eranot](https://hosted.weblate.org/user/Eranot)
 * [erral](https://hosted.weblate.org/user/erral)
 * [ersen](https://hosted.weblate.org/user/ersen)
@@ -96,7 +88,6 @@ list.
 * [zcraber](https://hosted.weblate.org/user/zcraber)
 
 ## Libraries & templates
-
 * systxema
 * plumilla
 * victor crespo

backend/.gitignore

@@ -1,7 +0,0 @@
-.pnp.*
-.yarn/*
-!.yarn/patches
-!.yarn/plugins
-!.yarn/releases
-!.yarn/sdks
-!.yarn/versions

backend/build.clj

@@ -16,11 +16,16 @@
    {:src-dirs ["src" "resources"]
     :target-dir class-dir})
 
+  (b/compile-clj
+   {:basis basis
+    :src-dirs ["src"]
+    :class-dir class-dir})
+
   (b/uber
    {:class-dir class-dir
     :uber-file jar-file
     :main 'clojure.main
-    :exclude [#".*Log4j2Plugins\.dat$"]
+    :exclude [#"goog.*" #"^javasist.*"]
     :basis basis}))
 
 (defn compile [_]

backend/deps.edn

@@ -1,12 +1,13 @@
-{:mvn/repos
- {"sonatype" {:url "https://oss.sonatype.org/content/repositories/snapshots/"}}
-
- :deps
+{:deps
  {penpot/common {:local/root "../common"}
-  org.clojure/clojure {:mvn/version "1.12.2"}
-  org.clojure/tools.namespace {:mvn/version "1.5.0"}
+  org.clojure/clojure {:mvn/version "1.11.1"}
+  org.clojure/core.async {:mvn/version "1.6.673"}
 
-  com.github.luben/zstd-jni {:mvn/version "1.5.7-4"}
+  ;; Logging
+  org.zeromq/jeromq {:mvn/version "0.5.3"}
+
+  com.github.luben/zstd-jni {:mvn/version "1.5.2-5"}
+  org.clojure/data.fressian {:mvn/version "1.0.0"}
 
   io.prometheus/simpleclient {:mvn/version "0.16.0"}
   io.prometheus/simpleclient_hotspot {:mvn/version "0.16.0"}
@@ -17,41 +18,28 @@
 
   io.prometheus/simpleclient_httpserver {:mvn/version "0.16.0"}
 
-  io.lettuce/lettuce-core {:mvn/version "6.8.1.RELEASE"}
-  ;; Minimal dependencies required by lettuce, we need to include them
-  ;; explicitly because clojure dependency management does not support
-  ;; yet the BOM format.
-  io.micrometer/micrometer-core {:mvn/version "1.14.2"}
-  io.micrometer/micrometer-observation {:mvn/version "1.14.2"}
-
+  io.lettuce/lettuce-core {:mvn/version "6.2.2.RELEASE"}
   java-http-clj/java-http-clj {:mvn/version "0.4.3"}
-  com.google.guava/guava {:mvn/version "33.4.8-jre"}
 
   funcool/yetti
-  {:git/tag "v11.8"
-   :git/sha "1d1b33f"
+  {:git/tag "v9.11"
+   :git/sha "6f9197a"
    :git/url "https://github.com/funcool/yetti.git"
    :exclusions [org.slf4j/slf4j-api]}
 
-  com.github.seancorfield/next.jdbc
-  {:mvn/version "1.3.1070"}
-
-  metosin/reitit-core {:mvn/version "0.9.1"}
-  nrepl/nrepl {:mvn/version "1.4.0"}
-
-  org.postgresql/postgresql {:mvn/version "42.7.7"}
-  org.xerial/sqlite-jdbc {:mvn/version "3.50.3.0"}
-
-  com.zaxxer/HikariCP {:mvn/version "7.0.2"}
+  com.github.seancorfield/next.jdbc {:mvn/version "1.3.847"}
+  metosin/reitit-core {:mvn/version "0.5.18"}
+  org.postgresql/postgresql {:mvn/version "42.5.1"}
+  com.zaxxer/HikariCP {:mvn/version "5.0.1"}
 
   io.whitfin/siphash {:mvn/version "2.0.0"}
 
-  buddy/buddy-hashers {:mvn/version "2.0.167"}
-  buddy/buddy-sign {:mvn/version "3.6.1-359"}
+  buddy/buddy-hashers {:mvn/version "1.8.158"}
+  buddy/buddy-sign {:mvn/version "3.4.333"}
 
-  com.github.ben-manes.caffeine/caffeine {:mvn/version "3.2.2"}
+  com.github.ben-manes.caffeine/caffeine {:mvn/version "3.1.2"}
 
-  org.jsoup/jsoup {:mvn/version "1.21.2"}
+  org.jsoup/jsoup {:mvn/version "1.15.3"}
   org.im4java/im4java
   {:git/tag "1.4.0-penpot-2"
    :git/sha "e2b3e16"
@@ -60,36 +48,41 @@
   org.lz4/lz4-java {:mvn/version "1.8.0"}
 
   org.clojars.pntblnk/clj-ldap {:mvn/version "0.0.17"}
+  integrant/integrant {:mvn/version "0.8.0"}
 
-  dawran6/emoji {:mvn/version "0.2.0"}
-  markdown-clj/markdown-clj {:mvn/version "1.12.4"}
+  dawran6/emoji {:mvn/version "0.1.5"}
+  markdown-clj/markdown-clj {:mvn/version "1.11.4"}
 
   ;; Pretty Print specs
   pretty-spec/pretty-spec {:mvn/version "0.1.4"}
-  software.amazon.awssdk/s3 {:mvn/version "2.33.10"}}
+  software.amazon.awssdk/s3 {:mvn/version "2.19.8"}
+  }
 
  :paths ["src" "resources" "target/classes"]
  :aliases
  {:dev
   {:extra-deps
    {com.bhauman/rebel-readline {:mvn/version "RELEASE"}
+    org.clojure/tools.namespace {:mvn/version "RELEASE"}
     clojure-humanize/clojure-humanize {:mvn/version "0.2.2"}
     org.clojure/data.csv {:mvn/version "RELEASE"}
     com.clojure-goes-fast/clj-async-profiler {:mvn/version "RELEASE"}
     mockery/mockery {:mvn/version "RELEASE"}}
    :extra-paths ["test" "dev"]}
 
+
   :build
   {:extra-deps
-   {io.github.clojure/tools.build {:mvn/version "0.10.10"}}
+   {io.github.clojure/tools.build {:git/tag "v0.9.0" :git/sha "8c93e0c"}}
    :ns-default build}
 
   :test
-  {:main-opts ["-m" "kaocha.runner"]
-   :jvm-opts ["-Dlog4j2.configurationFile=log4j2-devenv-repl.xml"
-              "--sun-misc-unsafe-memory-access=allow"
-              "--enable-native-access=ALL-UNNAMED"]
-   :extra-deps {lambdaisland/kaocha {:mvn/version "1.91.1392"}}}
+  {:extra-paths ["test"]
+   :extra-deps
+   {io.github.cognitect-labs/test-runner
+    {:git/tag "v0.5.1" :git/sha "dfb30dd"}}
+   :main-opts ["-m" "cognitect.test-runner"]
+   :exec-fn cognitect.test-runner.api/test}
 
   :outdated
   {:extra-deps {com.github.liquidz/antq {:mvn/version "RELEASE"}}

backend/dev/user.clj

@@ -6,65 +6,43 @@
 
 (ns user
   (:require
-   [app.binfile.common :as bfc]
    [app.common.data :as d]
-   [app.common.debug :as debug]
    [app.common.exceptions :as ex]
-   [app.common.files.helpers :as cfh]
-   [app.common.fressian :as fres]
    [app.common.geom.matrix :as gmt]
-   [app.common.json :as json]
    [app.common.logging :as l]
    [app.common.perf :as perf]
    [app.common.pprint :as pp]
-   [app.common.schema :as sm]
-   [app.common.schema.desc-js-like :as smdj]
-   [app.common.schema.desc-native :as smdn]
-   [app.common.schema.generators :as sg]
-   [app.common.schema.openapi :as oapi]
    [app.common.spec :as us]
-   [app.common.time :as ct]
    [app.common.transit :as t]
-   [app.common.types.file :as ctf]
    [app.common.uuid :as uuid]
-   [app.common.uri :as u]
-   [app.config :as cf]
-   [app.db :as db]
+   [app.config :as cfg]
    [app.main :as main]
-   [app.srepl.helpers :as h]
-   [app.srepl.main :refer :all]
+   [app.srepl.helpers]
+   [app.srepl.main :as srepl]
    [app.util.blob :as blob]
+   [app.util.fressian :as fres]
+   [app.util.json :as json]
+   [app.util.time :as dt]
    [clj-async-profiler.core :as prof]
    [clojure.contrib.humanize :as hum]
-   [clojure.datafy :refer [datafy]]
    [clojure.java.io :as io]
    [clojure.pprint :refer [pprint print-table]]
    [clojure.repl :refer :all]
    [clojure.spec.alpha :as s]
    [clojure.stacktrace :as trace]
    [clojure.test :as test]
-   [clojure.test.check.generators :as tgen]
+   [clojure.test.check.generators :as gen]
    [clojure.tools.namespace.repl :as repl]
    [clojure.walk :refer [macroexpand-all]]
    [criterium.core  :as crit]
    [cuerdas.core :as str]
-   [datoteka.fs :as fs]
-   [integrant.core :as ig]
-   [malli.core :as m]
-   [malli.dev.pretty :as mdp]
-   [malli.error :as me]
-   [malli.generator :as mg]
-   [malli.registry :as mr]
-   [malli.transform :as mt]
-   [malli.util :as mu]
-   [promesa.exec :as px]))
+   [datoteka.core]
+   [integrant.core :as ig]))
 
 (repl/disable-reload! (find-ns 'integrant.core))
-(repl/disable-reload! (find-ns 'app.common.debug))
-
 (set! *warn-on-reflection* true)
 
-(add-tap #'debug/tap-handler)
+(defonce system nil)
 
 ;; --- Benchmarking Tools
 
@@ -103,14 +81,20 @@
 (defn- start
   []
   (try
-    (main/start)
+    (alter-var-root #'system (fn [sys]
+                               (when sys (ig/halt! sys))
+                               (-> (merge main/system-config main/worker-config)
+                                   (ig/prep)
+                                   (ig/init))))
     :started
     (catch Throwable cause
       (ex/print-throwable cause))))
 
 (defn- stop
   []
-  (main/stop)
+  (alter-var-root #'system (fn [sys]
+                             (when sys (ig/halt! sys))
+                             nil))
   :stopped)
 
 (defn restart
@@ -123,28 +107,26 @@
   (stop)
   (repl/refresh-all :after 'user/start))
 
-;; (defn compression-bench
-;;   [data]
-;;   (let [humanize (fn [v] (hum/filesize v :binary true :format " %.4f "))
-;;         v1 (time (humanize (alength (blob/encode data {:version 1}))))
-;;         v3 (time (humanize (alength (blob/encode data {:version 3}))))
-;;         v4 (time (humanize (alength (blob/encode data {:version 4}))))
-;;         v5 (time (humanize (alength (blob/encode data {:version 5}))))
-;;         v6 (time (humanize (alength (blob/encode data {:version 6}))))
-;;         ]
-;;     (print-table
-;;      [{
-;;        :v1 v1
-;;        :v3 v3
-;;        :v4 v4
-;;        :v5 v5
-;;        :v6 v6
-;;        }])))
+(defn compression-bench
+  [data]
+  (let [humanize (fn [v] (hum/filesize v :binary true :format " %.4f "))
+        v1 (time (humanize (alength (blob/encode data {:version 1}))))
+        v3 (time (humanize (alength (blob/encode data {:version 3}))))
+        v4 (time (humanize (alength (blob/encode data {:version 4}))))
+        v5 (time (humanize (alength (blob/encode data {:version 5}))))
+        v6 (time (humanize (alength (blob/encode data {:version 6}))))
+        ]
+    (print-table
+     [{
+       :v1 v1
+       :v3 v3
+       :v4 v4
+       :v5 v5
+       :v6 v6
+       }])))
 
-(defn calculate-frames
-  [{:keys [data]}]
-  (->> (vals (:pages-index data))
-       (mapcat (comp vals :objects))
-       (filter cfh/is-direct-child-of-root?)
-       (filter cfh/frame-shape?)
-       (count)))
+(defonce debug-tap
+  (do
+    (add-tap #(locking debug-tap
+                (prn "tap debug:" %)))
+    1))

backend/package.json

@@ -1,26 +1,18 @@
 {
-  "name": "backend",
-  "version": "1.0.0",
-  "license": "MPL-2.0",
-  "author": "Kaleidos INC",
-  "private": true,
-  "packageManager": "yarn@4.9.2+sha512.1fc009bc09d13cfd0e19efa44cbfc2b9cf6ca61482725eb35bbc5e257e093ebf4130db6dfe15d604ff4b79efd8e1e8e99b25fa7d0a6197c9f9826358d4d65c3c",
+  "name": "uxbox-back",
+  "version": "0.1.0",
+  "description": "The Open-Source prototyping tool",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build-emails": "./scripts/build-email-templates.sh"
+  },
   "repository": {
     "type": "git",
-    "url": "https://github.com/penpot/penpot"
-  },
-  "dependencies": {
-    "luxon": "^3.4.4",
-    "sax": "^1.4.1"
+    "url": "git+https://github.com/uxbox/uxbox.git"
   },
+  "author": "Uxbox",
+  "license": "SEE LICENSE IN <LICENSE>",
   "devDependencies": {
-    "nodemon": "^3.1.2",
-    "source-map-support": "^0.5.21",
-    "ws": "^8.17.0"
-  },
-  "scripts": {
-    "fmt:clj:check": "cljfmt check --parallel=false src/ test/",
-    "fmt:clj": "cljfmt fix --parallel=true src/ test/",
-    "lint:clj": "clj-kondo --parallel --lint src/"
+    "mjml": "^4.6.3"
   }
 }

backend/resources/app/email/change-email/en.html

@@ -1,257 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello {{name|abbreviate:25}}!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        We received a request to change your current email to {{ pending-email }}.</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        Click the link below to confirm the change.</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%;">
-                        <tr>
-                          <td align="center" bgcolor="#31EFB8" role="presentation"
-                            style="border:none;border-radius:3px;cursor:auto;mso-padding-alt:10px 25px;background:#31EFB8;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/auth/verify-token?token={{token}}"
-                              style="display:inline-block;background:#31EFB8;color:#1F1F1F;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:3px;"
-                              target="_blank"> Confirm email change </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        If you did not request this change, consider changing your password for security reasons.</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        Enjoy!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/change-email/en.txt

@@ -1,12 +0,0 @@
-Hello {{name|abbreviate:25}}!
-
-We received a request to change your current email to {{ pending-email }}.
-
-Click the link below to confirm the change.
-
-{{ public-uri }}/#/auth/verify-token?token={{token}}
-
-If you did not request this change, consider changing your password for security reasons.
-
-Enjoy!
-The Penpot team.

backend/resources/app/email/comment-mention/en.html

@@ -1,244 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello {{name|abbreviate:25}}!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <span style="font-weight:bold;">{{ source-user }}</span> has mentioned you on a comment at "{{ comment-reference }}".</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;font-style:italic;line-height:150%;text-align:left;color:#212426;
-                                  border-top: 1px solid #bfbfbf; border-bottom: 1px solid #bfbfbf; padding: 32px 0px;">
-                        {{ comment-content }}
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%;">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                              style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                              valign="middle">
-                            <a href="{{ comment-url }}"
-                               style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                               target="_blank"> GO TO THE COMMENT </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/comment-mention/en.subj

@@ -1 +0,0 @@
-Mentioned in comment

backend/resources/app/email/comment-mention/en.txt

@@ -1,13 +0,0 @@
-Hello {{name|abbreviate:25}}!
-
-{{ source-user }} has mentioned you on a comment at "{{ comment-reference }}".
-
---
-
-{{ comment-content }}
-
---
-
-{{ comment-url }}
-
-The Penpot team.

backend/resources/app/email/comment-notification/en.html

@@ -1,244 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello {{name|abbreviate:25}}!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <span style="font-weight:bold;">{{ source-user }}</span> has commented at "{{ comment-reference }}".</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;font-style:italic;line-height:150%;text-align:left;color:#212426;
-                                  border-top: 1px solid #bfbfbf; border-bottom: 1px solid #bfbfbf; padding: 32px 0px;">
-                        {{ comment-content }}
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%;">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4#31EFB8" role="presentation"
-                              style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                              valign="middle">
-                            <a href="{{ comment-url }}"
-                               style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                               target="_blank"> GO TO THE COMMENT </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/comment-notification/en.subj

@@ -1 +0,0 @@
-New comment

backend/resources/app/email/comment-notification/en.txt

@@ -1,13 +0,0 @@
-Hello {{name|abbreviate:25}}!
-
-{{ source-user }} has commented at "{{ comment-reference }}".
-
---
-
-{{ comment-content }}
-
---
-
-{{ comment-url }}
-
-The Penpot team.

backend/resources/app/email/comment-thread/en.html

@@ -1,244 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello {{name|abbreviate:25}}!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <span style="font-weight:bold;">{{ source-user }}</span> has created a comment in a thread you've been mentioned at "{{ comment-reference }}".</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;font-style:italic;line-height:150%;text-align:left;color:#212426;
-                                  border-top: 1px solid #bfbfbf; border-bottom: 1px solid #bfbfbf; padding: 32px 0px;">
-                        {{ comment-content }}
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%;">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4#31EFB8" role="presentation"
-                              style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                              valign="middle">
-                            <a href="{{ comment-url }}"
-                               style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                               target="_blank"> GO TO THE COMMENT </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/comment-thread/en.subj

@@ -1 +0,0 @@
-New response in comment

backend/resources/app/email/comment-thread/en.txt

@@ -1,13 +0,0 @@
-Hello {{name|abbreviate:25}}!
-
-{{ source-user }} has created a comment in a thread you've been mentioned at "{{ comment-reference }}".
-
---
-
-{{ comment-content }}
-
---
-
-{{ comment-url }}
-
-The Penpot team.

backend/resources/app/email/feedback/en.html

@@ -1,48 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml">
-  <head>
-    <title></title>
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  </head>
-  <body>
-    <p>
-      <strong>Feedback from:</strong><br />
-      <span>
-        <span>Name: </span>
-        <span><code>{{profile.fullname|abbreviate:25}}</code></span>
-      </span>
-      <br />
-      <span>
-        <span>Email: </span>
-        <span>{{profile.email}}</span>
-      </span>
-      <br />
-      <span>
-        <span>ID: </span>
-        <span><code>{{profile.id}}</code></span>
-      </span>
-    </p>
-    <p>
-      <strong>Subject:</strong><br />
-      <span>{{feedback-subject|abbreviate:300}}</span>
-    </p>
-
-    <p>
-      <strong>Type:</strong><br />
-      <span>{{feedback-type|abbreviate:300}}</span>
-    </p>
-
-    {% if feedback-error-href %}
-    <p>
-      <strong>Error HREF:</strong><br />
-      <span>{{feedback-error-href|abbreviate:500}}</span>
-    </p>
-    {% endif %}
-
-    <p>
-      <strong>Message:</strong><br />
-      {{feedback-content|linebreaks-br}}
-    </p>
-  </body>
-</html>

backend/resources/app/email/feedback/en.subj

@@ -1 +0,0 @@
-[PENPOT FEEDBACK]: {{feedback-subject}}

backend/resources/app/email/feedback/en.txt

@@ -1,11 +0,0 @@
-From: {{profile.fullname}} <{{profile.email}}> / {{profile.id}}
-Subject: {{feedback-subject}}
-Type: {{feedback-type}}
-
-{% if feedback-error-href %}
-HREF: {{feedback-error-href}}
-{% endif -%}
-
-Message:
-
-{{feedback-content}}

backend/resources/app/email/includes/footer.html

@@ -1,323 +0,0 @@
-<!--[if mso | IE]>
-        </td>
-    </tr>
-    </table>
-
-    <table
-        align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-    >
-    <tr>
-        <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-    <![endif]-->
-<div style="margin:0px auto;max-width:600px;">
-    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-            <tr>
-                <td style="direction:ltr;font-size:0px;padding:24px 0 0 0;text-align:center;">
-                    <!--[if mso | IE]>
-                <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-                class="" style="vertical-align:top;width:425px;"
-            >
-        <![endif]-->
-                    <div class="mj-column-px-425 mj-outlook-group-fix"
-                        style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                        <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                            style="vertical-align:top;" width="100%">
-                            <tr>
-                                <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                                    <div
-                                        style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">
-                                        Penpot is the first Open Source design and prototyping platform meant for
-                                        cross-domain teams.
-                                    </div>
-                                </td>
-                            </tr>
-                        </table>
-                    </div>
-                    <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                </table>
-                <![endif]-->
-                </td>
-            </tr>
-        </tbody>
-    </table>
-</div>
-<!--[if mso | IE]>
-        </td>
-        </tr>
-    </table>
-
-
-
-    <table
-        align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-    >
-        <tr>
-        <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-    <![endif]-->
-<div style="margin:0px auto;max-width:600px;">
-    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-            <tr>
-                <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-                    <!--[if mso | IE]>
-                <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-                class="" style="vertical-align:top;width:600px;"
-            >
-        <![endif]-->
-                    <div class="mj-column-per-100 mj-outlook-group-fix"
-                        style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                        <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                            style="vertical-align:top;" width="100%">
-                            <tr>
-                                <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                                    <!--[if mso | IE]>
-    <table
-        align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-    >
-        <tr>
-
-            <td>
-            <![endif]-->
-                                    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                        style="float:none;display:inline-table;">
-                                        <tr>
-                                            <td style="padding:0 8px;">
-                                                <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                                    style="border-radius:3px;width:24px;">
-                                                    <tr>
-                                                        <td
-                                                            style="font-size:0;height:24px;vertical-align:middle;width:24px;">
-                                                            <a href="https://penpot.app/" target="_blank">
-                                                                <img height="24"
-                                                                    src="{{ public-uri }}/images/email/logo-uxbox.png"
-                                                                    style="border-radius:3px;display:block;"
-                                                                    width="24" />
-                                                            </a>
-                                                        </td>
-                                                    </tr>
-                                                </table>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                    <!--[if mso | IE]>
-            </td>
-
-            <td>
-            <![endif]-->
-                                    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                        style="float:none;display:inline-table;">
-                                        <tr>
-                                            <td style="padding:0 8px;">
-                                                <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                                    style="border-radius:3px;width:24px;">
-                                                    <tr>
-                                                        <td
-                                                            style="font-size:0;height:24px;vertical-align:middle;width:24px;">
-                                                            <a href="https://x.com/penpotapp" target="_blank">
-                                                                <img height="24"
-                                                                    src="{{ public-uri }}/images/email/logo-x.png"
-                                                                    style="border-radius:3px;display:block;"
-                                                                    width="24" />
-                                                            </a>
-                                                        </td>
-                                                    </tr>
-                                                </table>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                    <!--[if mso | IE]>
-            </td>
-
-            <td>
-            <![endif]-->
-                                    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                        style="float:none;display:inline-table;">
-                                        <tr>
-                                            <td style="padding:0 8px;">
-                                                <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                                    style="border-radius:3px;width:24px;">
-                                                    <tr>
-                                                        <td
-                                                            style="font-size:0;height:24px;vertical-align:middle;width:24px;">
-                                                            <a href="https://github.com/penpot/" target="_blank">
-                                                                <img height="24"
-                                                                    src="{{ public-uri }}/images/email/logo-github.png"
-                                                                    style="border-radius:3px;display:block;"
-                                                                    width="24" />
-                                                            </a>
-                                                        </td>
-                                                    </tr>
-                                                </table>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                    <!--[if mso | IE]>
-            </td>
-
-            <td>
-            <![endif]-->
-                                    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                        style="float:none;display:inline-table;">
-                                        <tr>
-                                            <td style="padding:0 8px;">
-                                                <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                                    style="border-radius:3px;width:24px;">
-                                                    <tr>
-                                                        <td
-                                                            style="font-size:0;height:24px;vertical-align:middle;width:24px;">
-                                                            <a href="https://www.linkedin.com/company/penpotdesign/"
-                                                                target="_blank">
-                                                                <img height="24"
-                                                                    src="{{ public-uri }}/images/email/logo-linkedin.png"
-                                                                    style="border-radius:3px;display:block;"
-                                                                    width="24" />
-                                                            </a>
-                                                        </td>
-                                                    </tr>
-                                                </table>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                    <!--[if mso | IE]>
-            </td>
-
-            <td>
-            <![endif]-->
-                                    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                        style="float:none;display:inline-table;">
-                                        <tr>
-                                            <td style="padding:0 8px;">
-                                                <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                                    style="border-radius:3px;width:24px;">
-                                                    <tr>
-                                                        <td
-                                                            style="font-size:0;height:24px;vertical-align:middle;width:24px;">
-                                                            <a href="https://fosstodon.org/@penpot/" target="_blank">
-                                                                <img height="24"
-                                                                    src="{{ public-uri }}/images/email/logo-mastodon.png"
-                                                                    style="border-radius:3px;display:block;"
-                                                                    width="24" />
-                                                            </a>
-                                                        </td>
-                                                    </tr>
-                                                </table>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                    <!--[if mso | IE]>
-            </td>
-
-            <td>
-            <![endif]-->
-                                    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                        style="float:none;display:inline-table;">
-                                        <tr>
-                                            <td style="padding:0 8px;">
-                                                <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                                                    style="border-radius:3px;width:24px;">
-                                                    <tr>
-                                                        <td
-                                                            style="font-size:0;height:24px;vertical-align:middle;width:24px;">
-                                                            <a href="https://tree.taiga.io/project/penpot"
-                                                                target="_blank">
-                                                                <img height="24"
-                                                                    src="{{ public-uri }}/images/email/logo-taiga.png"
-                                                                    style="border-radius:3px;display:block;"
-                                                                    width="24" />
-                                                            </a>
-                                                        </td>
-                                                    </tr>
-                                                </table>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                    <!--[if mso | IE]>
-            </td>
-
-        </tr>
-        </table>
-    <![endif]-->
-                                </td>
-                            </tr>
-                        </table>
-                    </div>
-                    <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                </table>
-                <![endif]-->
-                </td>
-            </tr>
-        </tbody>
-    </table>
-</div>
-<!--[if mso | IE]>
-        </td>
-        </tr>
-    </table>
-
-    <table
-        align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-    >
-        <tr>
-        <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-    <![endif]-->
-<div style="margin:0px auto;max-width:600px;">
-    <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-            <tr>
-                <td style="direction:ltr;font-size:0px;padding:0 0 24px 0;text-align:center;">
-                    <!--[if mso | IE]>
-                <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-                class="" style="vertical-align:top;width:600px;"
-            >
-        <![endif]-->
-                    <div class="mj-column-per-100 mj-outlook-group-fix"
-                        style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                        <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                            style="vertical-align:top;" width="100%">
-                            <tr>
-                                <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                                    <div
-                                        style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">
-                                        Penpot | Made with &lt;3 and Open Source</div>
-                                </td>
-                            </tr>
-                        </table>
-                    </div>
-                    <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                </table>
-                <![endif]-->
-                </td>
-            </tr>
-        </tbody>
-    </table>
-</div>
-<!--[if mso | IE]>
-        </td>
-        </tr>
-    </table>
-    <![endif]-->

backend/resources/app/email/invite-to-team/en.html

@@ -1,243 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        {{invited-by|abbreviate:25}} has invited you to join the team “{{ team|abbreviate:25 }}”.</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%;">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                            style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/auth/verify-token?token={{token}}"
-                              style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                              target="_blank"> ACCEPT INVITE </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        Enjoy!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/invite-to-team/en.subj

@@ -1 +0,0 @@
-{{invited-by|abbreviate:25}} has invited you to join the team “{{ team|abbreviate:25 }}”

backend/resources/app/email/invite-to-team/en.txt

@@ -1,10 +0,0 @@
-Hello!
-
-{{invited-by|abbreviate:25}} has invited you to join the team “{{ team|abbreviate:25 }}”.
-
-Accept invitation using this link:
-
-{{ public-uri }}/#/auth/verify-token?token={{token}}
-
-Enjoy!
-The Penpot team.

backend/resources/app/email/join-team/en.html

@@ -1,244 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        As you requested, {{invited-by|abbreviate:25}} has added you to the team “{{
-                        team|abbreviate:25}}”.</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%;">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                            style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/dashboard/team/{{team-id}}/projects"
-                              style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                              target="_blank"> GO TO THE TEAM </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        Enjoy!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/join-team/en.subj

@@ -1 +0,0 @@
-You have joined {{team}}

backend/resources/app/email/join-team/en.txt

@@ -1,10 +0,0 @@
-Hello!
-
-As you requested, {{invited-by|abbreviate:25}} has added you to the team “{{ team|abbreviate:25}}”.
-
-Go to the team with this link:
-
-{{ public-uri }}/#/dashboard/team/{{team-id}}
-
-Enjoy!
-The Penpot team.

backend/resources/app/email/password-recovery/en.html

@@ -1,252 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello {{name|abbreviate:25}}!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        We have received a request to reset your password. Click the link below to choose a new one:
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%;">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                            style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/auth/recovery?token={{token}}"
-                              style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                              target="_blank"> RESET PASSWORD </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        If you received this email by mistake, you can safely ignore it. Your password won't be changed.
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        Enjoy!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/password-recovery/en.txt

@@ -1,12 +0,0 @@
-Hello {{name|abbreviate:25}}!
-
-We received a request to reset your password. Click the link below to choose a
-new one:
-
-{{ public-uri }}/#/auth/recovery?token={{token}}
-
-If you received this email by mistake, you can safely ignore it. Your password
-won't be changed.
-
-Enjoy!
-The Penpot team.

backend/resources/app/email/register/en.html

@@ -1,244 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello {{name|abbreviate:25}}!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        Thanks for signing up for your Penpot account! Please verify your email using the link below and
-                        get started building mockups and prototypes today!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%;">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                            style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/auth/verify-token?token={{token}}"
-                              style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                              target="_blank"> VERIFY EMAIL </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        Enjoy!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/register/en.txt

@@ -1,9 +0,0 @@
-Hello {{name|abbreviate:25}}!
-
-Thanks for signing up for your Penpot account! Please verify your email using the
-link below and get started building mockups and prototypes today!
-
-{{ public-uri }}/#/auth/verify-token?token={{token}}
-
-Enjoy!
-The Penpot team.

backend/resources/app/email/request-file-access-yourpenpot-view/en.html

@@ -1,254 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <p>
-                          {{requested-by|abbreviate:25}} ({{requested-by-email}}) wants to have view-only access to the
-                          file named “{{file-name|abbreviate:25}}”.
-                        </p>
-                        <p>
-                          Since this file is in your Penpot team, you can provide access by sending a view-only link.
-                          This will allow {{requested-by|abbreviate:25}} to view the content without making any changes.
-                        </p>
-                        <p>To proceed, please click the button below to generate and send the view-only link:</p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                            style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/view?file-id={{file-id}}&page-id={{page-id}}&section=interactions&index=0&share=true"
-                              style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                              target="_blank"> SEND A VIEW-ONLY LINK </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <p>If you do not wish to grant access at this time, you can simply disregard this email.</p>
-                        <p>Thank you</p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/request-file-access-yourpenpot-view/en.subj

@@ -1 +0,0 @@
-Request View-Only Access to “{{file-name|abbreviate:25}}”

backend/resources/app/email/request-file-access-yourpenpot-view/en.txt

@@ -1,17 +0,0 @@
-Hello!
-
-{{requested-by|abbreviate:25}} ({{requested-by-email}}) wants to have view-only access to the file named “{{file-name|abbreviate:25}}”.
-
-Since this file is in your Penpot team, you can provide access by sending a view-only link. This will allow {{requested-by|abbreviate:25}} to view the content without making any changes.
-
-To proceed, please click the link below to generate and send the view-only link:
-
-{{ public-uri }}/#/view?file-id={{file-id}}&page-id={{page-id}}&section=interactions&index=0&share=true
-
-
-
-If you do not wish to grant access at this time, you can simply disregard this email.
-Thank you
-
-
-The Penpot team.

backend/resources/app/email/request-file-access-yourpenpot/en.html

@@ -1,277 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <p>
-                          {{requested-by|abbreviate:25}} ({{requested-by-email}}) has requested access to the file named
-                          “{{file-name|abbreviate:25}}”.
-                        </p>
-                        <p>
-                          Please note that the file is currently in Your Penpot 's team, so direct access cannot be
-                          granted. However, you have two options to provide the requested access:
-                        </p>
-                        <ul>
-                          <li>
-                            <p>Move the File to Another Team:</p>
-                            <p>You can move the file to another team and then give access to that team, inviting
-                              {{requested-by|abbreviate:25}}.</p>
-                          </li>
-                        </ul>
-                        </p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <ul>
-                          <li>
-                            <p>Send a View-Only Link:</p>
-                            <p>Alternatively, you can create and share a view-only link to the file. This will allow
-                              {{requested-by|abbreviate:25}} to view the content without making any changes.</p>
-                            <p>Click the button below to generate and send the link:</p>
-                          </li>
-                        </ul>
-                        </p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                            style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/view?file-id={{file-id}}&page-id={{page-id}}&section=interactions&index=0&share=true"
-                               style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                               target="_blank"> SEND A VIEW-ONLY LINK </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <p>If you do not wish to grant access at this time, you can simply disregard this email.</p>
-                        <p>Thank you</p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/request-file-access-yourpenpot/en.subj

@@ -1 +0,0 @@
-Request Access to “{{file-name|abbreviate:25}}”

backend/resources/app/email/request-file-access-yourpenpot/en.txt

@@ -1,30 +0,0 @@
-Hello!
-
-
-Hello!
-
-{{requested-by|abbreviate:25}} ({{requested-by-email}}) has requested access to the file named “{{file-name|abbreviate:25}}”.
-
-Please note that the file is currently in Your Penpot 's team, so direct access cannot be granted. However, you have two options to provide the requested access:
-
-- Move the File to Another Team:
-
-You can move the file to another team and then give access to that team, inviting {{requested-by|abbreviate:25}}.
-
-
-
-- Send a View-Only Link:
-
-Alternatively, you can create and share a view-only link to the file. This will allow {{requested-by|abbreviate:25}} to view the content without making any changes.
-
-Click the link below to generate and send the link:
-
-{{ public-uri }}/#/view?file-id={{file-id}}&page-id={{page-id}}&section=interactions&index=0&share=true
-
-
-
-If you do not wish to grant access at this time, you can simply disregard this email.
-Thank you
-
-
-The Penpot team.

backend/resources/app/email/request-file-access/en.html

@@ -1,295 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <p>
-                          {{requested-by|abbreviate:25}} ({{requested-by-email}}) has requested access to the file named
-                          “{{file-name|abbreviate:25}}”.
-                        </p>
-                        <p>
-                          To provide this access, you have the following options:
-                        </p>
-                        <ul>
-                          <li>
-                            <p>Give Access to the “{{team-name|abbreviate:25}}” Team:</p>
-                            <p>This will automatically include {{requested-by|abbreviate:25}} in the team, so the user
-                              can see all the projects and files in it.</p>
-                            <p>Click the button below to provide team access:</p>
-                          </li>
-                        </ul>
-                        </p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                            style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/dashboard/members?team-id={{team-id}}&invite-email={{requested-by-email|urlescape }}"
-                              style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                              target="_blank"> GIVE ACCESS TO “{{team-name|abbreviate:25}}” TEAM </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <ul>
-                          <li>
-                            <p>Send a View-Only Link:</p>
-                            <p>Alternatively, you can create and share a view-only link to the file. This will allow
-                              {{requested-by|abbreviate:25}} to view the content without making any changes.</p>
-                            <p>Click the button below to generate and send the link:</p>
-                          </li>
-                        </ul>
-                        </p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                            style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/view?file-id={{file-id}}&page-id={{page-id}}&section=interactions&index=0&share=true"
-                               style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                               target="_blank"> SEND A VIEW-ONLY LINK </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <p>If you do not wish to grant access at this time, you can simply disregard this email.</p>
-                        <p>Thank you</p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/request-file-access/en.subj

@@ -1 +0,0 @@
-Request Access to “{{file-name|abbreviate:25}}”

backend/resources/app/email/request-file-access/en.txt

@@ -1,33 +0,0 @@
-Hello!
-
-
-Hello!
-
-{{requested-by|abbreviate:25}} ({{requested-by-email}}) has requested access to the file named “{{file-name|abbreviate:25}}”.
-
-To provide this access, you have the following options:
-
-- Give Access to the “{{team-name|abbreviate:25}}” Team:
-
-This will automatically include {{requested-by|abbreviate:25}} in the team, so the user can see all the projects and files in it.
-
-Click the link below to provide team access:
-
-{{ public-uri }}/#/dashboard/members?team-id={{team-id}}&invite-email={{requested-by-email|urlescape}}
-
-
-
-- Send a View-Only Link:
-
-Alternatively, you can create and share a view-only link to the file. This will allow {{requested-by|abbreviate:25}} to view the content without making any changes.
-
-Click the link below to generate and send the link:
-
-{{ public-uri }}/#/view?file-id={{file-id}}&page-id={{page-id}}&section=interactions&index=0&share=true
-
-
-If you do not wish to grant access at this time, you can simply disregard this email.
-Thank you
-
-
-The Penpot team.

backend/resources/app/email/request-team-access/en.html

@@ -1,252 +0,0 @@
-<!doctype html>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
-  xmlns:o="urn:schemas-microsoft-com:office:office">
-
-<head>
-  <title>
-  </title>
-  <!--[if !mso]><!-- -->
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <!--<![endif]-->
-  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style type="text/css">
-    #outlook a {
-      padding: 0;
-    }
-
-    body {
-      margin: 0;
-      padding: 0;
-      -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
-    }
-
-    table,
-    td {
-      border-collapse: collapse;
-      mso-table-lspace: 0pt;
-      mso-table-rspace: 0pt;
-    }
-
-    img {
-      border: 0;
-      height: auto;
-      line-height: 100%;
-      outline: none;
-      text-decoration: none;
-      -ms-interpolation-mode: bicubic;
-    }
-
-    p {
-      display: block;
-      margin: 13px 0;
-    }
-  </style>
-  <!--[if mso]>
-        <xml>
-        <o:OfficeDocumentSettings>
-          <o:AllowPNG/>
-          <o:PixelsPerInch>96</o:PixelsPerInch>
-        </o:OfficeDocumentSettings>
-        </xml>
-        <![endif]-->
-  <!--[if lte mso 11]>
-        <style type="text/css">
-          .mj-outlook-group-fix { width:100% !important; }
-        </style>
-        <![endif]-->
-  <!--[if !mso]><!-->
-  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
-  <style type="text/css">
-    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
-  </style>
-  <!--<![endif]-->
-  <style type="text/css">
-    @media only screen and (min-width:480px) {
-      .mj-column-per-100 {
-        width: 100% !important;
-        max-width: 100%;
-      }
-
-      .mj-column-px-425 {
-        width: 425px !important;
-        max-width: 425px;
-      }
-    }
-  </style>
-  <style type="text/css">
-    @media only screen and (max-width:480px) {
-      table.mj-full-width-mobile {
-        width: 100% !important;
-      }
-
-      td.mj-full-width-mobile {
-        width: auto !important;
-      }
-    }
-  </style>
-</head>
-
-<body style="background-color:#E5E5E5;">
-  <div style="background-color:#E5E5E5;">
-    <!--[if mso | IE]>
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:collapse;border-spacing:0px;">
-                        <tbody>
-                          <tr>
-                            <td style="width:97px;">
-                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png"
-                                style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;"
-                                width="97" />
-                            </td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <!--[if mso | IE]>
-          </td>
-        </tr>
-      </table>
-
-      <table
-         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
-      >
-        <tr>
-          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
-      <![endif]-->
-    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
-      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
-        style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
-        <tbody>
-          <tr>
-            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
-              <!--[if mso | IE]>
-                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
-
-        <tr>
-
-            <td
-               class="" style="vertical-align:top;width:600px;"
-            >
-          <![endif]-->
-              <div class="mj-column-per-100 mj-outlook-group-fix"
-                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
-                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;"
-                  width="100%">
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">
-                        Hello!</div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <p>
-                          {{requested-by|abbreviate:25}} ({{requested-by-email}}) wants to have access to the
-                          “{{team-name|abbreviate:25}}” Team.
-                        </p>
-                        <p>
-                          To provide access, please click the button below:
-                        </p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="center" vertical-align="middle"
-                      style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <table border="0" cellpadding="0" cellspacing="0" role="presentation"
-                        style="border-collapse:separate;line-height:100%;">
-                        <tr>
-                          <td align="center" bgcolor="#6911d4" role="presentation"
-                            style="border:none;border-radius:8px;cursor:auto;mso-padding-alt:10px 25px;background:#6911d4;"
-                            valign="middle">
-                            <a href="{{ public-uri }}/#/dashboard/members?team-id={{team-id}}&invite-email={{requested-by-email|urlescape}}"
-                              style="display:inline-block;background:#6911d4;color:#FFFFFF;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:8px;"
-                              target="_blank"> GIVE ACCESS TO “{{team-name|abbreviate:25}}” TEAM </a>
-                          </td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        <p>If you do not wish to grant access at this time, you can simply disregard this email.</p>
-                        <p>Thank you</p>
-                      </div>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
-                      <div
-                        style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">
-                        The Penpot team.</div>
-                    </td>
-                  </tr>
-                </table>
-              </div>
-              <!--[if mso | IE]>
-            </td>
-
-        </tr>
-
-                  </table>
-                <![endif]-->
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-
-    {% include "app/email/includes/footer.html" %}
-
-  </div>
-</body>
-
-</html>

backend/resources/app/email/request-team-access/en.subj

@@ -1 +0,0 @@
-Request Access to “{{team-name|abbreviate:25}}”

backend/resources/app/email/request-team-access/en.txt

@@ -1,14 +0,0 @@
-Hello!
-
-{{requested-by|abbreviate:25}} ({{requested-by-email}}) wants to have access to the “{{team-name|abbreviate:25}}” Team.
-
-To provide access, please click the link below:
-
-{{ public-uri }}/#/dashboard/members?team-id={{team-id}}&invite-email={{requested-by-email|urlescape}}
-
-
-If you do not wish to grant access at this time, you can simply disregard this email.
-Thank you
-
-
-The Penpot team.

backend/resources/app/emails-mjml/change-email/en.mjml

@@ -0,0 +1,66 @@
+<mjml>
+
+  <mj-head>
+    <mj-font name="Source Sans Pro" href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" />
+    <mj-attributes>
+      <mj-text font-family="Source Sans Pro, sans-serif" font-size="16px" color="#000000" line-height="150%" />
+      <mj-button background-color="#31EFB8" color="#1F1F1F" font-family="Source Sans Pro, sans-serif" font-size="16px" />
+    </mj-attributes>
+  </mj-head>
+
+  <mj-body background-color="#E5E5E5">
+
+    <mj-section padding="0">
+      <mj-column>
+        <mj-image src="{{ public-uri }}/images/email/uxbox-title.png"
+                  width="97px" height="32px" align="left" padding="16px" />
+      </mj-column>
+    </mj-section>
+
+    <mj-section background-color="#FFFFFF">
+      <mj-column>
+        <mj-text font-size="24px" font-weight="600">Hello {{name}}!</mj-text>
+        <mj-text>We received a request to change your current email to {{ pending-email }}.</mj-text>
+        <mj-text>Click to the link below to confirm the change:</mj-text>
+        <mj-button href="{{ public-uri }}/#/auth/verify-token?token={{token}}">
+          Confirm email change
+        </mj-button>
+        <mj-text>
+          If you received this email by mistake, please consider changing your password
+          for security reasons.
+        </mj-text>
+        <mj-text>Enjoy!</mj-text>
+        <mj-text>The Penpot team.</mj-text>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="24px 0 0 0">
+      <mj-column width="425px">
+        <mj-text align="center" font-size="14px" color="#64666A">
+          Penpot is the first Open Source design and prototyping platform meant for cross-domain teams.
+        </mj-text>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="0">
+      <mj-column>
+        <mj-social icon-size="24px" mode="horizontal">
+          <mj-social-element src="{{ public-uri }}/images/email/logo-uxbox.png" href="https://penpot.app/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-twitter.png" href="https://twitter.com/penpotapp" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-github.png" href="https://github.com/penpot/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-instagram.png" href="https://instagram.com/penpotapp/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-taiga.png" href="https://tree.taiga.io/project/uxbox" padding="0 8px" />
+        </mj-social>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="0 0 24px 0">
+      <mj-column>
+        <mj-text align="center" font-size="14px" color="#64666A" line-height="150%">
+          Penpot © 2020 | Made with &lt;3 and Open Source
+        </mj-text>
+      </mj-column>
+    </mj-section>
+
+  </mg-body>
+</mjml>

backend/resources/app/emails-mjml/invite-to-team/en.mjml

@@ -0,0 +1,59 @@
+<mjml>
+  <mj-head>
+    <mj-font name="Source Sans Pro" href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" />
+    <mj-attributes>
+      <mj-text font-family="Source Sans Pro, sans-serif" font-size="16px" color="#000000" line-height="150%" />
+      <mj-button background-color="#31EFB8" color="#1F1F1F" font-family="Source Sans Pro, sans-serif" font-size="16px" />
+    </mj-attributes>
+  </mj-head>
+  <mj-body background-color="#E5E5E5">
+    <mj-section padding="0">
+      <mj-column>
+        <mj-image src="{{ public-uri }}/images/email/uxbox-title.png"
+                  width="97px" height="32px" align="left" padding="16px" />
+      </mj-column>
+    </mj-section>
+    <mj-section background-color="#FFFFFF">
+      <mj-column>
+        <mj-text font-size="24px" font-weight="600">Hello!</mj-text>
+        <mj-text>
+          {{invited-by}} has invited you to join the team “{{ team }}”.
+        </mj-text>
+        <mj-button href="{{ public-uri }}/#/auth/verify-token?token={{token}}">
+          Accept invite
+        </mj-button>
+        <mj-text>Enjoy!</mj-text>
+        <mj-text>The Penpot team.</mj-text>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="24px 0 0 0">
+      <mj-column width="425px">
+        <mj-text align="center" font-size="14px" color="#64666A">
+          Penpot is the first Open Source design and prototyping platform meant for cross-domain teams.
+        </mj-text>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="0">
+      <mj-column>
+        <mj-social icon-size="24px" mode="horizontal">
+          <mj-social-element src="{{ public-uri }}/images/email/logo-uxbox.png" href="https://penpot.app/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-twitter.png" href="https://twitter.com/penpotapp" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-github.png" href="https://github.com/penpot/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-instagram.png" href="https://instagram.com/penpotapp/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-taiga.png" href="https://tree.taiga.io/project/uxbox" padding="0 8px" />
+        </mj-social>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="0 0 24px 0">
+      <mj-column>
+        <mj-text align="center" font-size="14px" color="#64666A" line-height="150%">
+          Penpot © 2020 | Made with &lt;3 and Open Source
+        </mj-text>
+      </mj-column>
+    </mj-section>
+
+  </mg-body>
+</mjml>

backend/resources/app/emails-mjml/password-recovery/en.mjml

@@ -0,0 +1,68 @@
+<mjml>
+
+  <mj-head>
+    <mj-font name="Source Sans Pro" href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" />
+    <mj-attributes>
+      <mj-text font-family="Source Sans Pro, sans-serif" font-size="16px" color="#000000" line-height="150%" />
+      <mj-button background-color="#31EFB8" color="#1F1F1F" font-family="Source Sans Pro, sans-serif" font-size="16px" />
+    </mj-attributes>
+  </mj-head>
+
+  <mj-body background-color="#E5E5E5">
+
+    <mj-section padding="0">
+      <mj-column>
+        <mj-image src="{{ public-uri }}/images/email/uxbox-title.png"
+                  width="97px" height="32px" align="left" padding="16px" />
+      </mj-column>
+    </mj-section>
+
+    <mj-section background-color="#FFFFFF">
+      <mj-column>
+        <mj-text font-size="24px" font-weight="600">Hello {{name}}!</mj-text>
+        <mj-text>
+          We have received a request to reset your password. Click the link
+          below to choose a new one:
+        </mj-text>
+        <mj-button href="{{ public-uri }}/#/auth/recovery?token={{token}}">
+          Reset password
+        </mj-button>
+        <mj-text>
+          If you received this email by mistake, you can safely ignore
+          it. Your password won't be changed.
+        </mj-text>
+        <mj-text>Enjoy!</mj-text>
+        <mj-text>The Penpot team.</mj-text>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="24px 0 0 0">
+      <mj-column width="425px">
+        <mj-text align="center" font-size="14px" color="#64666A">
+          Penpot is the first Open Source design and prototyping platform meant for cross-domain teams.
+        </mj-text>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="0">
+      <mj-column>
+        <mj-social icon-size="24px" mode="horizontal">
+          <mj-social-element src="{{ public-uri }}/images/email/logo-uxbox.png" href="https://penpot.app/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-twitter.png" href="https://twitter.com/penpotapp" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-github.png" href="https://github.com/penpot/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-instagram.png" href="https://instagram.com/penpotapp/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-taiga.png" href="https://tree.taiga.io/project/uxbox" padding="0 8px" />
+        </mj-social>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="0 0 24px 0">
+      <mj-column>
+        <mj-text align="center" font-size="14px" color="#64666A" line-height="150%">
+          Penpot © 2020 | Made with &lt;3 and Open Source
+        </mj-text>
+      </mj-column>
+    </mj-section>
+
+  </mg-body>
+</mjml>

backend/resources/app/emails-mjml/register/en.mjml

@@ -0,0 +1,65 @@
+<mjml>
+
+  <mj-head>
+    <mj-font name="Source Sans Pro" href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" />
+    <mj-attributes>
+      <mj-text font-family="Source Sans Pro, sans-serif" font-size="16px" color="#000000" line-height="150%" />
+      <mj-button background-color="#31EFB8" color="#1F1F1F" font-family="Source Sans Pro, sans-serif" font-size="16px" />
+    </mj-attributes>
+  </mj-head>
+
+  <mj-body background-color="#E5E5E5">
+
+    <mj-section padding="0">
+      <mj-column>
+        <mj-image src="{{ public-uri }}/images/email/uxbox-title.png"
+                  width="97px" height="32px" align="left" padding="16px" />
+      </mj-column>
+    </mj-section>
+
+    <mj-section background-color="#FFFFFF">
+      <mj-column>
+        <mj-text font-size="24px" font-weight="600">Hello {{name}}!</mj-text>
+        <mj-text>
+          Thanks for signing up for your Penpot account! Please verify your
+          email using the link below and get started building mockups and
+          prototypes today!
+        </mj-text>
+        <mj-button href="{{ public-uri }}/#/auth/verify-token?token={{token}}">
+          Verify email
+        </mj-button>
+        <mj-text>Enjoy!</mj-text>
+        <mj-text>The Penpot team.</mj-text>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="24px 0 0 0">
+      <mj-column width="425px">
+        <mj-text align="center" font-size="14px" color="#64666A">
+          Penpot is the first Open Source design and prototyping platform meant for cross-domain teams.
+        </mj-text>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="0">
+      <mj-column>
+        <mj-social icon-size="24px" mode="horizontal">
+          <mj-social-element src="{{ public-uri }}/images/email/logo-uxbox.png" href="https://penpot.app/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-twitter.png" href="https://twitter.com/penpotapp" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-github.png" href="https://github.com/penpot/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-instagram.png" href="https://instagram.com/penpotapp/" padding="0 8px" />
+          <mj-social-element src="{{ public-uri }}/images/email/logo-taiga.png" href="https://tree.taiga.io/project/uxbox" padding="0 8px" />
+        </mj-social>
+      </mj-column>
+    </mj-section>
+
+    <mj-section padding="0 0 24px 0">
+      <mj-column>
+        <mj-text align="center" font-size="14px" color="#64666A" line-height="150%">
+          Penpot © 2020 | Made with &lt;3 and Open Source
+        </mj-text>
+      </mj-column>
+    </mj-section>
+
+  </mg-body>
+</mjml>

backend/resources/app/emails/change-email/en.html

@@ -0,0 +1,478 @@
+<!doctype html>
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
+
+<head>
+  <title>
+  </title>
+  <!--[if !mso]><!-- -->
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <!--<![endif]-->
+  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <style type="text/css">
+    #outlook a {
+      padding: 0;
+    }
+
+    body {
+      margin: 0;
+      padding: 0;
+      -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+    }
+
+    table,
+    td {
+      border-collapse: collapse;
+      mso-table-lspace: 0pt;
+      mso-table-rspace: 0pt;
+    }
+
+    img {
+      border: 0;
+      height: auto;
+      line-height: 100%;
+      outline: none;
+      text-decoration: none;
+      -ms-interpolation-mode: bicubic;
+    }
+
+    p {
+      display: block;
+      margin: 13px 0;
+    }
+  </style>
+  <!--[if mso]>
+        <xml>
+        <o:OfficeDocumentSettings>
+          <o:AllowPNG/>
+          <o:PixelsPerInch>96</o:PixelsPerInch>
+        </o:OfficeDocumentSettings>
+        </xml>
+        <![endif]-->
+  <!--[if lte mso 11]>
+        <style type="text/css">
+          .mj-outlook-group-fix { width:100% !important; }
+        </style>
+        <![endif]-->
+  <!--[if !mso]><!-->
+  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
+  <style type="text/css">
+    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
+  </style>
+  <!--<![endif]-->
+  <style type="text/css">
+    @media only screen and (min-width:480px) {
+      .mj-column-per-100 {
+        width: 100% !important;
+        max-width: 100%;
+      }
+
+      .mj-column-px-425 {
+        width: 425px !important;
+        max-width: 425px;
+      }
+    }
+  </style>
+  <style type="text/css">
+    @media only screen and (max-width:480px) {
+      table.mj-full-width-mobile {
+        width: 100% !important;
+      }
+
+      td.mj-full-width-mobile {
+        width: auto !important;
+      }
+    }
+  </style>
+</head>
+
+<body style="background-color:#E5E5E5;">
+  <div style="background-color:#E5E5E5;">
+    <!--[if mso | IE]>
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
+                      <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;">
+                        <tbody>
+                          <tr>
+                            <td style="width:97px;">
+                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png" style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;" width="97" />
+                            </td>
+                          </tr>
+                        </tbody>
+                      </table>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">Hello {{name}}!</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">We received a request to change your current email to {{ pending-email }}.</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">Click to the link below to confirm the change:</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="center" vertical-align="middle" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
+                        <tr>
+                          <td align="center" bgcolor="#31EFB8" role="presentation" style="border:none;border-radius:3px;cursor:auto;mso-padding-alt:10px 25px;background:#31EFB8;" valign="middle">
+                            <a href="{{ public-uri }}/#/auth/verify-token?token={{token}}" style="display:inline-block;background:#31EFB8;color:#1F1F1F;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:3px;" target="_blank"> Confirm email change </a>
+                          </td>
+                        </tr>
+                      </table>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">If you received this email by mistake, please consider changing your password for security reasons.</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">Enjoy!</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">The Penpot team.</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:24px 0 0 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:425px;"
+            >
+          <![endif]-->
+              <div class="mj-column-px-425 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">Penpot is the first Open Source design and prototyping platform meant for cross-domain teams.</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <!--[if mso | IE]>
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
+      >
+        <tr>
+      
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://penpot.app/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-uxbox.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://twitter.com/penpotapp" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-twitter.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://github.com/penpot/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-github.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://instagram.com/penpotapp/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-instagram.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://tree.taiga.io/project/uxbox" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-taiga.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+          </tr>
+        </table>
+      <![endif]-->
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0 0 24px 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">Penpot | Made with &lt;3 and Open Source</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      <![endif]-->
+  </div>
+</body>
+
+</html>

backend/resources/app/emails/change-email/en.txt

@@ -0,0 +1,13 @@
+Hello {{name}}!
+
+We received a request to change your current email to {{ pending-email }}.
+
+Click to the link below to confirm the change:
+
+{{ public-uri }}/#/auth/verify-token?token={{token}}
+
+If you received this email by mistake, please consider changing your password
+for security reasons.
+
+Enjoy!
+The Penpot team.

backend/resources/app/emails/feedback/en.html

@@ -0,0 +1,45 @@
+<!doctype html>
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <title></title>
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+  </head>
+  <body>
+    <p>
+      <strong>Feedback from:</strong><br />
+      {% if profile %}
+        <span>
+          <span>Name: </span>
+          <span><code>{{profile.fullname}}</code></span>
+        </span>
+        <br />
+
+        <span>
+          <span>Email: </span>
+          <span>{{profile.email}}</span>
+        </span>
+        <br />
+
+        <span>
+          <span>ID: </span>
+          <span><code>{{profile.id}}</code></span>
+        </span>
+      {% else %}
+        <span>
+          <span>Email: </span>
+          <span>{{profile.email}}</span>
+        </span>
+      {% endif %}
+    </p>
+    <p>
+      <strong>Subject:</strong><br />
+      <span>{{subject}}</span>
+    </p>
+
+    <p>
+      <strong>Message:</strong><br />
+      {{content|linebreaks-br|safe}}
+    </p>
+  </body>
+</html>

backend/resources/app/emails/feedback/en.subj

@@ -0,0 +1 @@
+[PENPOT FEEDBACK]: {{subject}}

backend/resources/app/emails/feedback/en.txt

@@ -0,0 +1,9 @@
+{% if profile %}
+Feedback profile: {{profile.fullname}} <{{profile.email}}> / {{profile.id}}
+{% else %}
+Feedback from: {{email}}
+{% endif %}
+
+Subject: {{subject}}
+
+{{content}}

backend/resources/app/emails/invite-to-team/en.html

@@ -0,0 +1,468 @@
+<!doctype html>
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
+
+<head>
+  <title>
+  </title>
+  <!--[if !mso]><!-- -->
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <!--<![endif]-->
+  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <style type="text/css">
+    #outlook a {
+      padding: 0;
+    }
+
+    body {
+      margin: 0;
+      padding: 0;
+      -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+    }
+
+    table,
+    td {
+      border-collapse: collapse;
+      mso-table-lspace: 0pt;
+      mso-table-rspace: 0pt;
+    }
+
+    img {
+      border: 0;
+      height: auto;
+      line-height: 100%;
+      outline: none;
+      text-decoration: none;
+      -ms-interpolation-mode: bicubic;
+    }
+
+    p {
+      display: block;
+      margin: 13px 0;
+    }
+  </style>
+  <!--[if mso]>
+        <xml>
+        <o:OfficeDocumentSettings>
+          <o:AllowPNG/>
+          <o:PixelsPerInch>96</o:PixelsPerInch>
+        </o:OfficeDocumentSettings>
+        </xml>
+        <![endif]-->
+  <!--[if lte mso 11]>
+        <style type="text/css">
+          .mj-outlook-group-fix { width:100% !important; }
+        </style>
+        <![endif]-->
+  <!--[if !mso]><!-->
+  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
+  <style type="text/css">
+    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
+  </style>
+  <!--<![endif]-->
+  <style type="text/css">
+    @media only screen and (min-width:480px) {
+      .mj-column-per-100 {
+        width: 100% !important;
+        max-width: 100%;
+      }
+
+      .mj-column-px-425 {
+        width: 425px !important;
+        max-width: 425px;
+      }
+    }
+  </style>
+  <style type="text/css">
+    @media only screen and (max-width:480px) {
+      table.mj-full-width-mobile {
+        width: 100% !important;
+      }
+
+      td.mj-full-width-mobile {
+        width: auto !important;
+      }
+    }
+  </style>
+</head>
+
+<body style="background-color:#E5E5E5;">
+  <div style="background-color:#E5E5E5;">
+    <!--[if mso | IE]>
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
+                      <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;">
+                        <tbody>
+                          <tr>
+                            <td style="width:97px;">
+                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png" style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;" width="97" />
+                            </td>
+                          </tr>
+                        </tbody>
+                      </table>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">Hello!</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">{{invited-by}} has invited you to join the team “{{ team }}”.</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="center" vertical-align="middle" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
+                        <tr>
+                          <td align="center" bgcolor="#31EFB8" role="presentation" style="border:none;border-radius:3px;cursor:auto;mso-padding-alt:10px 25px;background:#31EFB8;" valign="middle">
+                            <a href="{{ public-uri }}/#/auth/verify-token?token={{token}}" style="display:inline-block;background:#31EFB8;color:#1F1F1F;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:3px;" target="_blank"> Accept invite </a>
+                          </td>
+                        </tr>
+                      </table>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">Enjoy!</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">The Penpot team.</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:24px 0 0 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:425px;"
+            >
+          <![endif]-->
+              <div class="mj-column-px-425 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">Penpot is the first Open Source design and prototyping platform meant for cross-domain teams.</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <!--[if mso | IE]>
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
+      >
+        <tr>
+      
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://penpot.app/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-uxbox.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://twitter.com/penpotapp" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-twitter.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://github.com/penpot/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-github.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://instagram.com/penpotapp/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-instagram.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://tree.taiga.io/project/uxbox" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-taiga.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+          </tr>
+        </table>
+      <![endif]-->
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0 0 24px 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">Penpot | Made with &lt;3 and Open Source</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      <![endif]-->
+  </div>
+</body>
+
+</html>

backend/resources/app/emails/invite-to-team/en.subj

@@ -0,0 +1 @@
+Invitation to join {{team}}

backend/resources/app/emails/invite-to-team/en.txt

@@ -0,0 +1,10 @@
+Hello!
+
+{{invited-by}} has invited you to join the team “{{ team }}”.
+
+Accept invitation using this link:
+
+{{ public-uri }}/#/auth/verify-token?token={{token}}
+
+Enjoy!
+The Penpot team.

backend/resources/app/emails/password-recovery/en.html

@@ -0,0 +1,473 @@
+<!doctype html>
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
+
+<head>
+  <title>
+  </title>
+  <!--[if !mso]><!-- -->
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <!--<![endif]-->
+  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <style type="text/css">
+    #outlook a {
+      padding: 0;
+    }
+
+    body {
+      margin: 0;
+      padding: 0;
+      -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+    }
+
+    table,
+    td {
+      border-collapse: collapse;
+      mso-table-lspace: 0pt;
+      mso-table-rspace: 0pt;
+    }
+
+    img {
+      border: 0;
+      height: auto;
+      line-height: 100%;
+      outline: none;
+      text-decoration: none;
+      -ms-interpolation-mode: bicubic;
+    }
+
+    p {
+      display: block;
+      margin: 13px 0;
+    }
+  </style>
+  <!--[if mso]>
+        <xml>
+        <o:OfficeDocumentSettings>
+          <o:AllowPNG/>
+          <o:PixelsPerInch>96</o:PixelsPerInch>
+        </o:OfficeDocumentSettings>
+        </xml>
+        <![endif]-->
+  <!--[if lte mso 11]>
+        <style type="text/css">
+          .mj-outlook-group-fix { width:100% !important; }
+        </style>
+        <![endif]-->
+  <!--[if !mso]><!-->
+  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
+  <style type="text/css">
+    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
+  </style>
+  <!--<![endif]-->
+  <style type="text/css">
+    @media only screen and (min-width:480px) {
+      .mj-column-per-100 {
+        width: 100% !important;
+        max-width: 100%;
+      }
+
+      .mj-column-px-425 {
+        width: 425px !important;
+        max-width: 425px;
+      }
+    }
+  </style>
+  <style type="text/css">
+    @media only screen and (max-width:480px) {
+      table.mj-full-width-mobile {
+        width: 100% !important;
+      }
+
+      td.mj-full-width-mobile {
+        width: auto !important;
+      }
+    }
+  </style>
+</head>
+
+<body style="background-color:#E5E5E5;">
+  <div style="background-color:#E5E5E5;">
+    <!--[if mso | IE]>
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
+                      <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;">
+                        <tbody>
+                          <tr>
+                            <td style="width:97px;">
+                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png" style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;" width="97" />
+                            </td>
+                          </tr>
+                        </tbody>
+                      </table>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">Hello {{name}}!</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">We have received a request to reset your password. Click the link below to choose a new one:</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="center" vertical-align="middle" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
+                        <tr>
+                          <td align="center" bgcolor="#31EFB8" role="presentation" style="border:none;border-radius:3px;cursor:auto;mso-padding-alt:10px 25px;background:#31EFB8;" valign="middle">
+                            <a href="{{ public-uri }}/#/auth/recovery?token={{token}}" style="display:inline-block;background:#31EFB8;color:#1F1F1F;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:3px;" target="_blank"> Reset password </a>
+                          </td>
+                        </tr>
+                      </table>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">If you received this email by mistake, you can safely ignore it. Your password won't be changed.</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">Enjoy!</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">The Penpot team.</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:24px 0 0 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:425px;"
+            >
+          <![endif]-->
+              <div class="mj-column-px-425 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">Penpot is the first Open Source design and prototyping platform meant for cross-domain teams.</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <!--[if mso | IE]>
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
+      >
+        <tr>
+      
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://penpot.app/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-uxbox.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://twitter.com/penpotapp" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-twitter.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://github.com/penpot/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-github.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://instagram.com/penpotapp/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-instagram.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://tree.taiga.io/project/uxbox" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-taiga.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+          </tr>
+        </table>
+      <![endif]-->
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0 0 24px 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">Penpot | Made with &lt;3 and Open Source</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      <![endif]-->
+  </div>
+</body>
+
+</html>

backend/resources/app/emails/password-recovery/en.txt

@@ -0,0 +1,12 @@
+Hello {{name}}!
+
+We received a request to reset your password. Click the link below to choose a
+new one:
+
+{{ public-uri }}/#/auth/recovery?token={{token}}
+
+If you received this email by mistake, you can safely ignore it. Your password
+won't be changed.
+
+Enjoy!
+The Penpot team.

backend/resources/app/emails/register/en.html

@@ -0,0 +1,468 @@
+<!doctype html>
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
+
+<head>
+  <title>
+  </title>
+  <!--[if !mso]><!-- -->
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <!--<![endif]-->
+  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <style type="text/css">
+    #outlook a {
+      padding: 0;
+    }
+
+    body {
+      margin: 0;
+      padding: 0;
+      -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+    }
+
+    table,
+    td {
+      border-collapse: collapse;
+      mso-table-lspace: 0pt;
+      mso-table-rspace: 0pt;
+    }
+
+    img {
+      border: 0;
+      height: auto;
+      line-height: 100%;
+      outline: none;
+      text-decoration: none;
+      -ms-interpolation-mode: bicubic;
+    }
+
+    p {
+      display: block;
+      margin: 13px 0;
+    }
+  </style>
+  <!--[if mso]>
+        <xml>
+        <o:OfficeDocumentSettings>
+          <o:AllowPNG/>
+          <o:PixelsPerInch>96</o:PixelsPerInch>
+        </o:OfficeDocumentSettings>
+        </xml>
+        <![endif]-->
+  <!--[if lte mso 11]>
+        <style type="text/css">
+          .mj-outlook-group-fix { width:100% !important; }
+        </style>
+        <![endif]-->
+  <!--[if !mso]><!-->
+  <link href="https://fonts.googleapis.com/css?family=Source%20Sans%20Pro" rel="stylesheet" type="text/css">
+  <style type="text/css">
+    @import url(https://fonts.googleapis.com/css?family=Source%20Sans%20Pro);
+  </style>
+  <!--<![endif]-->
+  <style type="text/css">
+    @media only screen and (min-width:480px) {
+      .mj-column-per-100 {
+        width: 100% !important;
+        max-width: 100%;
+      }
+
+      .mj-column-px-425 {
+        width: 425px !important;
+        max-width: 425px;
+      }
+    }
+  </style>
+  <style type="text/css">
+    @media only screen and (max-width:480px) {
+      table.mj-full-width-mobile {
+        width: 100% !important;
+      }
+
+      td.mj-full-width-mobile {
+        width: auto !important;
+      }
+    }
+  </style>
+</head>
+
+<body style="background-color:#E5E5E5;">
+  <div style="background-color:#E5E5E5;">
+    <!--[if mso | IE]>
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:16px;word-break:break-word;">
+                      <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;">
+                        <tbody>
+                          <tr>
+                            <td style="width:97px;">
+                              <img height="32" src="{{ public-uri }}/images/email/uxbox-title.png" style="border:0;display:block;outline:none;text-decoration:none;height:32px;width:100%;font-size:13px;" width="97" />
+                            </td>
+                          </tr>
+                        </tbody>
+                      </table>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="background:#FFFFFF;background-color:#FFFFFF;margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#FFFFFF;background-color:#FFFFFF;width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:24px;font-weight:600;line-height:150%;text-align:left;color:#000000;">Hello {{name}}!</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">Thanks for signing up for your Penpot account! Please verify your email using the link below and get started building mockups and prototypes today!</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="center" vertical-align="middle" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
+                        <tr>
+                          <td align="center" bgcolor="#31EFB8" role="presentation" style="border:none;border-radius:3px;cursor:auto;mso-padding-alt:10px 25px;background:#31EFB8;" valign="middle">
+                            <a href="{{ public-uri }}/#/auth/verify-token?token={{token}}" style="display:inline-block;background:#31EFB8;color:#1F1F1F;font-family:Source Sans Pro, sans-serif;font-size:16px;font-weight:normal;line-height:120%;margin:0;text-decoration:none;text-transform:none;padding:10px 25px;mso-padding-alt:0px;border-radius:3px;" target="_blank"> Verify email </a>
+                          </td>
+                        </tr>
+                      </table>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">Enjoy!</div>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:16px;line-height:150%;text-align:left;color:#000000;">The Penpot team.</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:24px 0 0 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:425px;"
+            >
+          <![endif]-->
+              <div class="mj-column-px-425 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">Penpot is the first Open Source design and prototyping platform meant for cross-domain teams.</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <!--[if mso | IE]>
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" role="presentation"
+      >
+        <tr>
+      
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://penpot.app/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-uxbox.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://twitter.com/penpotapp" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-twitter.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://github.com/penpot/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-github.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://instagram.com/penpotapp/" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-instagram.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+              <td>
+            <![endif]-->
+                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
+                        <tr>
+                          <td style="padding:0 8px;">
+                            <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:24px;">
+                              <tr>
+                                <td style="font-size:0;height:24px;vertical-align:middle;width:24px;">
+                                  <a href="https://tree.taiga.io/project/uxbox" target="_blank">
+                                    <img height="24" src="{{ public-uri }}/images/email/logo-taiga.png" style="border-radius:3px;display:block;" width="24" />
+                                  </a>
+                                </td>
+                              </tr>
+                            </table>
+                          </td>
+                        </tr>
+                      </table>
+                      <!--[if mso | IE]>
+              </td>
+            
+          </tr>
+        </table>
+      <![endif]-->
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      
+      <table
+         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600"
+      >
+        <tr>
+          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
+      <![endif]-->
+    <div style="margin:0px auto;max-width:600px;">
+      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
+        <tbody>
+          <tr>
+            <td style="direction:ltr;font-size:0px;padding:0 0 24px 0;text-align:center;">
+              <!--[if mso | IE]>
+                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
+                
+        <tr>
+      
+            <td
+               class="" style="vertical-align:top;width:600px;"
+            >
+          <![endif]-->
+              <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
+                <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
+                  <tr>
+                    <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
+                      <div style="font-family:Source Sans Pro, sans-serif;font-size:14px;line-height:150%;text-align:center;color:#64666A;">Penpot | Made with &lt;3 and Open Source</div>
+                    </td>
+                  </tr>
+                </table>
+              </div>
+              <!--[if mso | IE]>
+            </td>
+          
+        </tr>
+      
+                  </table>
+                <![endif]-->
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <!--[if mso | IE]>
+          </td>
+        </tr>
+      </table>
+      <![endif]-->
+  </div>
+</body>
+
+</html>

backend/resources/app/emails/register/en.txt

@@ -0,0 +1,9 @@
+Hello {{name}}!
+
+Thanks for signing up for your Penpot account! Please verify your email using the
+link below and get started building mockups and prototypes today!
+
+{{ public-uri }}/#/auth/verify-token?token={{token}}
+
+Enjoy!
+The Penpot team.

backend/resources/app/onboarding.edn

@@ -1,45 +1,36 @@
-[{:id "tokens-starter-kit"
-  :name "Design tokens starter kit"
-  :file-uri "https://github.com/penpot/penpot-files/raw/refs/heads/main/Tokens%20starter%20kit.penpot"}
- {:id "penpot-design-system"
-  :name "Penpot Design System | Pencil"
-  :file-uri "https://github.com/penpot/penpot-files/raw/refs/heads/main/Pencil-Penpot-Design-System.penpot"}
- {:id "wireframing-kit"
-  :name "Wireframe library"
-  :file-uri "https://github.com/penpot/penpot-files/raw/refs/heads/main/Wireframing%20kit%20v1.1.penpot"}
- {:id "prototype-examples"
-  :name "Prototype template"
-  :file-uri "https://github.com/penpot/penpot-files/raw/refs/heads/main/Prototype%20examples%20v1.1.penpot"}
- {:id "plants-app"
-  :name "UI mockup example"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/Plants-app.penpot"}
- {:id "tutorial-for-beginners"
+[{:id "tutorial-for-beginners"
   :name "Tutorial for beginners"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/tutorial-for-beginners.penpot"}
- {:id "lucide-icons"
-  :name "Lucide Icons"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/Lucide-icons.penpot"}
- {:id "font-awesome"
-  :name "Font Awesome"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/FontAwesome.penpot"}
- {:id "black-white-mobile-templates"
-  :name "Black & White Mobile Templates"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/Black-&-White-Mobile-Templates.penpot"}
- {:id "avataaars"
-  :name "Avataaars"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/Avataaars-by-Pablo-Stanley.penpot"}
- {:id "ux-notes"
-  :name "UX Notes"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/UX-Notes.penpot"}
+  :thumbnail-uri "https://penpot.app/images/libraries/tutorial-for-beginners.jpg"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/tutorial-for-beginners.penpot"}
+ {:id "penpot-design-system"
+  :name "Penpot Design System"
+  :thumbnail-uri "https://penpot.app/images/libraries/cover-ds-penpot.jpg"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/Penpot-Design-system.penpot"}
+ {:id "wireframing-kit"
+  :name "Wireframing Kit"
+  :thumbnail-uri "https://penpot.app/images/libraries/cover-wireframes.jpg"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/wireframing-kit.penpot"}
+ {:id "ant-design"
+  :name "Ant Design UI Kit (lite)"
+  :thumbnail-uri "https://penpot.app/images/libraries/cover-ant-design.jpg"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/Ant-Design-UI-Kit-Lite.penpot"}
+ {:id "cocomaterial"
+  :name "Cocomaterial"
+  :thumbnail-uri "https://penpot.app/images/libraries/cover-cocomaterial.jpg"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/Cocomaterial.penpot"}
+ {:id "circum-icons"
+  :name "Circum Icons pack"
+  :thumbnail-uri "https://penpot.app/images/libraries/cover-circum.jpg"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/CircumIcons.penpot"}
+ {:id "coreui"
+  :name "CoreUI"
+  :thumbnail-uri "https://penpot.app/images/libraries/cover-coreui.jpg"
+  :file-uri "https://github.com/penpot/penpot-files/raw/main/CoreUI%20DesignSystem%20(DEMO).penpot"}
  {:id "whiteboarding-kit"
   :name "Whiteboarding Kit"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/Whiteboarding-mapping-kit.penpot"}
- {:id "open-color-scheme"
-  :name "Open Color Scheme"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/Open%20Color%20Scheme%20(v1.9.1).penpot"}
- {:id "flex-layout-playground"
-  :name "Flex Layout Playground"
-  :file-uri "https://github.com/penpot/penpot-files/raw/refs/heads/main/Flex%20Layout%20Playground%20v2.0.penpot"}
- {:id "welcome"
-  :name "Welcome"
-  :file-uri "https://github.com/penpot/penpot-files/raw/main/welcome.penpot"}]
+  :thumbnail-uri "https://penpot.app/images/libraries/cover-whiteboards.jpg"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/Whiteboarding-mapping-kit.penpot"}
+ {:id "material-design-baseline"
+  :name "Material Design (baseline)"
+  :thumbnail-uri "https://penpot.app/images/libraries/cover-material.jpg"
+  :file-uri "https://github.com/penpot/penpot-files/raw/binary-files/Material-Design-Kit.penpot"}]

backend/resources/app/templates/api-doc-entry.tmpl

@@ -1,5 +1,6 @@
 <li class="rpc-item">
   <div class="rpc-row-info">
+    {# <div class="type">{{item.type}}</div> #}
     <div class="module">{{item.module}}:</div>
     <div class="name">{{item.name}}</div>
     <div class="tags">
@@ -14,36 +15,19 @@
           <span>AUTH</span>
         </span>
       {% endif %}
-
+      
       {% if item.webhook %}
         <span class="tag">
           <span>WEBHOOK</span>
         </span>
       {% endif %}
-
-      {% if item.params-schema-js %}
-        <span class="tag">
-          <span>SCHEMA</span>
-        </span>
-      {% endif %}
-
-      {% if item.spec %}
-        <span class="tag">
-          <span>SPEC</span>
-        </span>
-      {% endif %}
-
-      {% if item.sse %}
-        <span class="tag">
-          <span>SSE</span>
-        </span>
-      {% endif %}
     </div>
   </div>
   <div class="rpc-row-detail hidden">
-    <h4>DOCSTRING:</h4>
+    <h3>DOCSTRING:</h3>
 
     <section class="padded-section">
+
       {% if item.added %}
         <p class="small"><strong>Added:</strong> on v{{item.added}}</p>
       {% endif %}
@@ -52,18 +36,13 @@
         <p class="small"><strong>Deprecated:</strong> since v{{item.deprecated}}</p>
       {% endif %}
 
-      {% if item.entrypoint %}
-        <p class="small"><strong>URI:</strong> <a href="{{item.entrypoint}}">{{item.entrypoint}}</a></p>
-      {% endif %}
-
       {% if item.docs %}
         <p class="docstring"> {{item.docs}}</p>
       {% endif %}
-
     </section>
 
     {% if item.changes %}
-      <h4>CHANGES:</h4>
+      <h3>CHANGES:</h3>
       <section class="padded-section">
 
         <ul class="changes">
@@ -74,55 +53,9 @@
       </section>
     {% endif %}
 
-    {% if item.spec %}
-      <h4>PARAMS (SPEC):</h4>
-      <section class="padded-section">
-        <pre class="spec-explain">{{item.spec}}</pre>
-      </section>
-    {% endif %}
-
-    {% if param-style = "js" %}
-      {% if item.params-schema-js %}
-        <h4>PARAMS:</h4>
-        <section class="padded-section">
-          <pre class="params-schema">{{item.params-schema-js}}</pre>
-        </section>
-      {% endif %}
-
-      {% if item.result-schema-js %}
-        <h4>RESPONSE:</h4>
-        <section class="padded-section">
-          <pre class="result">{{item.result-schema-js}}</pre>
-        </section>
-      {% endif %}
-
-      {% if item.webhook-schema-js %}
-        <h4>WEBHOOK PAYLOAD:</h4>
-        <section class="padded-section">
-          <pre class="webhook">{{item.webhook-schema-js}}</pre>
-        </section>
-      {% endif %}
-    {% else %}
-      {% if item.params-schema-clj %}
-        <h4>PARAMS:</h4>
-        <section class="padded-section">
-          <pre class="params-schema">{{item.params-schema-clj}}</pre>
-        </section>
-      {% endif %}
-
-      {% if item.result-schema-clj %}
-        <h4>RESPONSE:</h4>
-        <section class="padded-section">
-          <pre class="result">{{item.result-schema-clj}}</pre>
-        </section>
-      {% endif %}
-
-      {% if item.webhook-schema-clj %}
-        <h4>WEBHOOK PAYLOAD:</h4>
-        <section class="padded-section">
-          <pre class="webhook">{{item.webhook-schema-clj}}</pre>
-        </section>
-      {% endif %}
-    {% endif %}
+    <h3>SPEC EXPLAIN:</h3>
+    <section class="padded-section">
+      <pre class="spec-explain">{{item.spec}}</pre>
+    </section>
   </div>
 </li>

backend/resources/app/templates/api-doc.css

@@ -27,78 +27,12 @@ main {
 header {
   border-bottom: 1px solid #c0c0c0;
   display: flex;
-  flex-direction: column;
-  align-items: center;
   justify-content: center;
   width: 100%;
 }
 
-header .menu {
-  display: flex;
-  align-items: center;
-  margin-top: 5px;
-  margin-bottom: 10px;
-}
-
-header .menu nav {
-  list-style: none;
-  padding: 0px;
-  margin: 0px;
-  display: flex;
-  width: 45px;
-  justify-content: space-between;
-}
-
-header .menu nav > a {
-  list-style: none;
-  padding: 0px;
-  margin: 0px;
-  cursor: pointer;
-}
-
-header .menu nav > a.selected {
-  font-weight: 600;
-}
-
-b {
-  font-weight: 500;
-}
-
-h2 {
-  margin-top: 30px;
-}
-
-h3 {
-  font-weight: 400;
-  font-size: 11px;
-  margin-top: 20px;
-  text-decoration: underline;
-}
-
-h4 {
-  font-weight: 300;
-  font-size: 11px;
-}
-
-.doc-content {
-  margin-top: 20px;
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  /* border: 1px solid red; */
-  padding: 5px;
-}
-
-.doc-content p {
-  line-height: 22px;
-  margin-bottom: 0px;
-}
-
-.doc-content h3 {
-  margin-bottom: 0px;
-}
-
 .rpc-doc-content {
+  margin-top: 20px;
   width: 100%;
   display: flex;
   flex-direction: column;
@@ -131,7 +65,7 @@ h4 {
 .rpc-row-info {
   cursor: pointer;
   display: flex;
-  background-color: #e5e5e5;
+  background-color: #eeeeee;
   padding: 5px 10px;
 }
 
@@ -156,7 +90,7 @@ h4 {
 }
 
 .rpc-row-info > .module {
-  width: 150px;
+  width: 120px;
   font-weight: bold;
   border-right: 1px dotted #777;
   text-align: right;
@@ -174,8 +108,6 @@ h4 {
 .rpc-row-detail {
   padding: 5px 10px;
   padding-bottom: 20px;
-  border-left: 2px solid #e5e5e5;
-  border-right: 2px solid #e5e5e5;
 }
 
 .rpc-row-detail p {
@@ -211,7 +143,3 @@ h4 {
 p.small strong {
   font-size: 10px;
 }
-
-p.small a {
-  font-size: 10px;
-}

backend/resources/app/templates/api-doc.tmpl

@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <meta name="robots" content="noindex,nofollow">
     <meta http-equiv="x-ua-compatible" content="ie=edge" />
-    <title>{{label|upper}} API Documentation</title>
+    <title>Builtin API Documentation - Penpot</title>
 
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@@ -19,96 +19,27 @@
   <body>
     <main>
       <header>
-        <h1>{{label|upper}}: API Documentation (v{{version}})</h1>
-        <small class="menu">
-          [
-          <nav>
-            <a href="?type=js" {% if param-style = "js" %}class="selected"{% endif %}>JS</a>
-            <a href="?type=clj" {% if param-style = "cljs" %}class="selected"{% endif %}>CLJ</a>
-          </nav>
-          ]
-        </small>
+        <h1>Penpot API Documentation (v{{version}})</h1>
       </header>
-      <section class="doc-content">
-        <h2>INTRODUCTION</h2>
-        <p>This documentation is intended to be a general overview of
-          the {{label}} API.  If you prefer, you can
-          use <a href="{{openapi}}">Swagger/OpenAPI</a> as
-          alternative.</p>
-
-        <h2>GENERAL NOTES</h2>
-
-        <h3>HTTP Transport & Methods</h3>
-        <p>The HTTP is the transport method for accesing this API; all
-        functions can be called using POST HTTP method; the functions
-        that starts with <b>get-</b> in the name, can use GET HTTP
-        method which in many cases benefits from the HTTP cache.</p>
-
-        {% block auth-section %}
-        <h3>Authentication</h3>
-        <p>The penpot backend right now offers two way for authenticate the request:
-        <b>cookies</b> (the same mechanism that we use ourselves on accessing the API from the
-        web application) and <b>access tokens</b>.</p>
-
-        <p>The cookie can be obtained using the <b>`login-with-password`</b> rpc method,
-        on successful login it sets the <b>`auth-token`</b> cookie with the session
-        token.</p>
-
-        <p>The access token can be obtained on the appropriate section on profile settings
-        and it should be provided using <b>`Authorization`</b> header with <b>`Token
-        &lt;token-string&gt;`</b> value.</p>
-        {% endblock %}
-
-        <h3>Content Negotiation</h3>
-        <p>This API operates indistinctly with: <b>`application/json`</b>
-        and <b>`application/transit+json`</b> content types. You should specify the
-        desired content-type on the <b>`Accept`</b> header, the transit encoding is used
-        by default.</p>
-
-        <h3>SSE (Server-Sent Events)</h3>
-        <p>The methods marked with <b>SSE</b> returns
-        a <a href="https://html.spec.whatwg.org/multipage/server-sent-events.html"> SSE
-        formatted</a> stream on the response body, always with status 200. The events are
-        always encoded using `application/transit+json` encoding (for now no content
-        negotiation is possible on methods that return SSE streams). </p>
-        <p>On the javascript side you can use
-        the <a href="https://github.com/rexxars/eventsource-parser">eventsoure-parser</a>
-        library for propertly parsing the response body using the
-        standard <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">Fetch
-        API</a></p>
-
-        {% block limits-section %}
-        <h3>Limits</h3>
-        <p>The rate limit work per user basis (this means that different api keys share
-        the same rate limit). For now the limits are not documented because we are
-        studying and analyzing the data. As a general rule, it should not be abused, if an
-        abusive use is detected, we will proceed to block the user's access to the
-        API.</p>
-        {% endblock %}
-
-        {% block webhooks-section %}
-        <h3>Webhooks</h3>
-        <p>All methods that emit webhook events are marked with flag <b>WEBHOOK</b>, the
-        data structure defined on each method represents the <i>payload</i> of the
-        event.</p>
-        <p>The webhook event structure has this aspect:</p>
-        <br/>
-
-        <pre>
-{
-  "id": "db601c95-045f-808b-8002-362f08fcb621",
-  "name": "rename-file",
-  "props": &lt;payload&gt;,
-  "profileId": "db601c95-045f-808b-8002-361312e63531"
-}
-        </pre>
-        {% endblock %}
-
-      </section>
       <section class="rpc-doc-content">
-        <h2>METHODS REFERENCE:</h2>
+
+        <h2>RPC COMMAND METHODS:</h2>
         <ul class="rpc-items">
-          {% for item in methods %}
+          {% for item in command-methods %}
+            {% include "app/templates/api-doc-entry.tmpl" with item=item %}
+          {% endfor %}
+        </ul>
+
+        <h2>RPC QUERY METHODS:</h2>
+        <ul class="rpc-items">
+          {% for item in query-methods %}
+            {% include "app/templates/api-doc-entry.tmpl" with item=item %}
+          {% endfor %}
+        </ul>
+
+        <h2>RPC MUTATION METHODS:</h2>
+        <ul class="rpc-items">
+          {% for item in mutation-methods %}
             {% include "app/templates/api-doc-entry.tmpl" with item=item %}
           {% endfor %}
         </ul>

backend/resources/app/templates/debug.tmpl

@@ -6,95 +6,15 @@ Debug Main Page
 
 {% block content %}
 <nav>
-  <div class="title">
-    <h1>ADMIN DEBUG INTERFACE (VERSION: {{version}})</h1>
-  </div>
+  <h1>Debug INDEX:</h1>
+  <div>[<a href="/dbg/error">ERRORS</a>]</div>
 </nav>
-<main class="dashboard">
+<main class="index">
   <section class="widget">
     <fieldset>
-      <legend>Error reports</legend>
-      <desc><a href="/dbg/error">CLICK HERE TO SEE THE ERROR REPORTS</a> </desc>
-    </fieldset>
-
-    <fieldset>
-      <legend>Profile Management</legend>
-      <form method="post" action="/dbg/actions/resend-email-verification">
-        <div class="row">
-          <input type="email" name="email" placeholder="example@example.com" value="" />
-        </div>
-
-        <div class="row">
-          <label for="force-verify">Are you sure?</label>
-          <input id="force-verify" type="checkbox" name="force" />
-          <br />
-          <small>
-            This is a just a security double check for prevent non intentional submits.
-          </small>
-        </div>
-
-        <div class="row">
-          <input type="submit" name="resend" value="Resend Verification" />
-          <input type="submit" name="verify" value="Verify" />
-        </div>
-
-        <div class="row">
-          <input type="submit" class="danger" name="block" value="Block" />
-          <input type="submit" class="danger" name="unblock" value="Unblock" />
-        </div>
-      </form>
-    </fieldset>
-
-    <fieldset>
-      <legend>VIRTUAL CLOCK</legend>
-
-      <desc>
-        <p>
-          CURRENT CLOCK: <b>{{current-clock}}</b>
-          <br />
-          CURRENT OFFSET: <b>{{current-offset}}</b>
-          <br />
-          CURRENT TIME: <b>{{current-time}}</b>
-        </p>
-
-        <p>Examples: 3h, -7h, 24h (allowed suffixes: h, s)</p>
-      </desc>
-
-      <form method="post" action="/dbg/actions/set-virtual-clock">
-        <div class="row">
-          <input type="text" name="offset" placeholder="3h" value="" />
-        </div>
-
-        <div class="row">
-          <label for="force-verify">Are you sure?</label>
-          <input id="force-verify" type="checkbox" name="force" />
-          <br />
-          <small>
-            This is a just a security double check for prevent non intentional submits.
-          </small>
-        </div>
-
-        <div class="row">
-          <input type="submit" name="submit" value="Submit" />
-          <input type="submit" name="reset" value="Reset" />
-        </div>
-      </form>
-    </fieldset>
-
-  </section>
-
-  <section class="widget">
-
-    <fieldset>
-      <legend>Download RAW file data:</legend>
-      <desc>Given an FILE-ID, downloads the file AS-IS (no validation
-        checks, just exports the file data and related objects in raw)
-
-        <br/>
-        <br/>
-        <b>WARNING: this operation does not performs any checks</b>
-      </desc>
-      <form method="get" action="/dbg/actions/file-raw-export-import">
+      <legend>Download file data:</legend>
+      <desc>Given an FILE-ID, downloads the file data as file. The file data is encoded using transit.</desc>
+      <form method="get" action="/dbg/file/data">
         <div class="row">
           <input type="text" style="width:300px" name="file-id" placeholder="file-id" />
         </div>
@@ -107,12 +27,8 @@ Debug Main Page
 
     <fieldset>
       <legend>Upload File Data:</legend>
-      <desc>Create a new file on your draft projects using the file downloaded from the previous section.
-        <br/>
-        <br/>
-        <b>WARNING: this operation does not performs any checks</b>
-      </desc>
-      <form method="post" enctype="multipart/form-data" action="/dbg/actions/file-raw-export-import">
+      <desc>Create a new file on your draft projects using the file downloaded from the previous section.</desc>
+      <form method="post" enctype="multipart/form-data" action="/dbg/file/data">
         <div class="row">
           <input type="file" name="file" value="" />
         </div>
@@ -121,12 +37,11 @@ Debug Main Page
           <input type="checkbox" name="reuseid" />
         </div>
 
-        <div class="row">
-          <input type="submit" value="Upload" />
-        </div>
+        <input type="submit" value="Upload" />
       </form>
     </fieldset>
   </section>
+
   <section class="widget">
     <fieldset>
       <legend>Export binfile:</legend>
@@ -134,7 +49,7 @@ Debug Main Page
       the related libraries in a single custom formatted binary
       file.</desc>
 
-      <form method="get" action="/dbg/actions/file-export">
+      <form method="get" action="/dbg/file/export">
         <div class="row set-of-inputs">
           <input type="text" style="width:300px" name="file-ids" placeholder="file-id" />
           <input type="text" style="width:300px" name="file-ids" placeholder="file-id" />
@@ -160,68 +75,53 @@ Debug Main Page
     </fieldset>
     <fieldset>
       <legend>Import binfile:</legend>
-      <desc>Import penpot file in binary format.</desc>
+      <desc>Import penpot file in binary
+      format. If <strong>overwrite</strong> is checked, all files will
+      be overwritten using the same ids found in the file instead of
+      generating a new ones.</desc>
 
-      <form method="post" enctype="multipart/form-data" action="/dbg/actions/file-import">
+      <form method="post" enctype="multipart/form-data" action="/dbg/file/import">
         <div class="row">
           <input type="file" name="file" value="" />
         </div>
 
+        <div class="row">
+          <label>Overwrite?</label>
+          <input type="checkbox" name="overwrite" />
+          <br />
+          <small>
+            Instead of creating a new file with all relations remapped,
+            reuses all ids and updates/overwrites the objects that are
+            already exists on the database.
+            <strong>Warning, this operation should be used with caution.</strong>
+          </small>
+        </div>
+
+        <div class="row">
+          <label>Migrate?</label>
+          <input type="checkbox" name="migrate" />
+          <br />
+          <small>
+            Applies the file migrations on the importation process.
+          </small>
+        </div>
+
+        <div class="row">
+          <label>Ignore index errors?</label>
+          <input type="checkbox" name="ignore-index-errors" checked/>
+          <br />
+          <small>
+            Do not break on index lookup errors (remap operation).
+            Useful when importing a broken file that has broken
+            relations or missing pieces.
+          </small>
+        </div>
+
         <div class="row">
           <input type="submit" name="upload" value="Upload" />
         </div>
       </form>
     </fieldset>
   </section>
-
-  <section class="widget">
-    <fieldset>
-      <legend>Feature Flags for Team</legend>
-      <desc>Add a feature flag to a team</desc>
-      <form method="post" action="/dbg/actions/handle-team-features">
-        <div class="row">
-          <input type="text" style="width:300px" name="team-id" placeholder="team-id" />
-        </div>
-        <div class="row">
-          <select type="text" style="width:100px" name="feature">
-            {% for feature in supported-features %}
-              <option value="{{feature}}">{{feature}}</option>
-            {% endfor %}
-          </select>
-        </div>
-
-        <div class="row">
-          <select style="width:100px" name="action">
-            <option value="">Action...</option>
-            <option value="show">Show</option>
-            <option value="enable">Enable</option>
-            <option value="disable">Disable</option>
-          </select>
-        </div>
-
-        <div class="row">
-          <label for="check-feature">Skip feature check</label>
-          <input id="check-feature" type="checkbox" name="skip-check" />
-          <br />
-          <small>
-            Do not check if the feature is supported
-          </small>
-        </div>
-
-        <div class="row">
-          <label for="force-version">Are you sure?</label>
-          <input id="force-version" type="checkbox" name="force" />
-          <br />
-          <small>
-            This is a just a security double check for prevent non intentional submits.
-          </small>
-        </div>
-
-        <div class="row">
-          <input type="submit" value="Submit" />
-        </div>
-      </form>
-    </fieldset>
-  </section>
 </main>
 {% endblock %}

backend/resources/app/templates/error-list.tmpl

@@ -6,21 +6,13 @@ penpot - error list
 
 {% block content %}
 <nav>
-  <div class="title">
-    <h1>Error reports (last 200)
-      <a href="/dbg">[GO BACK]</a>
-    </h1>
-  </div>
+  <h1>Latest error reports:</h1>
 </nav>
 <main class="horizontal-list">
   <ul>
     {% for item in items %}
-      <li>
-        <a class="date" href="/dbg/error/{{item.id}}">{{item.created-at}}</a>
-        <a class="hint" href="/dbg/error/{{item.id}}">
-          <span class="title">{{item.hint|abbreviate:150}}</span>
-        </a>
-      </li>
+    <li><a class="date" href="/dbg/error/{{item.id}}">{{item.created-at}}</a> 
+        <span class="title">{{item.hint|abbreviate:150}}</span></li>
     {% endfor %}
   </ul>
 </main>

backend/resources/app/templates/error-report.v2.tmpl

@@ -1,112 +0,0 @@
- {% extends "app/templates/base.tmpl" %}
-
-{% block title %}
-penpot - error report v2 {{id}}
-{% endblock %}
-
-{% block content %}
-<nav>
-  <div>[<a href="/dbg/error">⮜</a>]</div>
-  <div>[<a href="#message">message</a>]</div>
-  <div>[<a href="#props">props</a>]</div>
-  <div>[<a href="#context">context</a>]</div>
-  {% if params %}
-  <div>[<a href="#params">request params</a>]</div>
-  {% endif %}
-  {% if data %}
-  <div>[<a href="#edata">error data</a>]</div>
-  {% endif %}
-  {% if spec-explain %}
-  <div>[<a href="#spec-explain">spec explain</a>]</div>
-  {% endif %}
-  {% if spec-problems %}
-  <div>[<a href="#spec-problems">spec problems</a>]</div>
-  {% endif %}
-  {% if spec-value %}
-  <div>[<a href="#spec-value">spec value</a>]</div>
-  {% endif %}
-  {% if trace %}
-  <div>[<a href="#trace">error trace</a>]</div>
-  {% endif %}
-</nav>
-<main>
-  <div class="table">
-    <div class="table-row multiline">
-      <div id="message" class="table-key">MESSAGE: </div>
-
-      <div class="table-val">
-        <h1>{{hint}}</h1>
-      </div>
-    </div>
-
-    <div class="table-row multiline">
-      <div id="props" class="table-key">LOG PROPS: </div>
-      <div class="table-val">
-        <pre>{{props}}</pre>
-      </div>
-    </div>
-
-    <div class="table-row multiline">
-      <div id="context" class="table-key">CONTEXT: </div>
-
-      <div class="table-val">
-        <pre>{{context}}</pre>
-      </div>
-    </div>
-
-    {% if params %}
-    <div class="table-row multiline">
-      <div id="params" class="table-key">REQUEST PARAMS: </div>
-      <div class="table-val">
-        <pre>{{params}}</pre>
-      </div>
-    </div>
-    {% endif %}
-
-    {% if data %}
-    <div class="table-row multiline">
-      <div id="edata" class="table-key">ERROR DATA: </div>
-      <div class="table-val">
-        <pre>{{data}}</pre>
-      </div>
-    </div>
-    {% endif %}
-
-    {% if spec-explain %}
-    <div class="table-row multiline">
-      <div id="spec-explain" class="table-key">SPEC EXPLAIN: </div>
-      <div class="table-val">
-        <pre>{{spec-explain}}</pre>
-      </div>
-    </div>
-    {% endif %}
-
-    {% if spec-problems %}
-    <div class="table-row multiline">
-      <div id="spec-problems" class="table-key">SPEC PROBLEMS: </div>
-      <div class="table-val">
-        <pre>{{spec-problems}}</pre>
-      </div>
-    </div>
-    {% endif %}
-
-    {% if spec-value %}
-    <div class="table-row multiline">
-      <div id="spec-value" class="table-key">SPEC VALUE: </div>
-      <div class="table-val">
-        <pre>{{spec-value}}</pre>
-      </div>
-    </div>
-    {% endif %}
-
-    {% if trace %}
-    <div class="table-row multiline">
-      <div id="trace" class="table-key">TRACE:</div>
-      <div class="table-val">
-        <pre>{{trace}}</pre>
-      </div>
-    </div>
-    {% endif %}
-  </div>
-</main>
-{% endblock %}

backend/resources/app/templates/error-report.v3.tmpl

@@ -1,101 +0,0 @@
- {% extends "app/templates/base.tmpl" %}
-
-{% block title %}
-Report: {{hint|abbreviate:150}} - {{id}} - Penpot Error Report (v3)
-{% endblock %}
-
-{% block content %}
-<nav>
-  <div>[<a href="/dbg/error">⮜</a>]</div>
-  <div>[<a href="#head">head</a>]</div>
-  <div>[<a href="#props">props</a>]</div>
-  <div>[<a href="#context">context</a>]</div>
-  {% if params %}
-  <div>[<a href="#params">params</a>]</div>
-  {% endif %}
-  {% if data %}
-  <div>[<a href="#edata">data</a>]</div>
-  {% endif %}
-  {% if explain %}
-  <div>[<a href="#explain">explain</a>]</div>
-  {% endif %}
-  {% if value %}
-  <div>[<a href="#value">value</a>]</div>
-  {% endif %}
-  {% if trace %}
-  <div>[<a href="#trace">trace</a>]</div>
-  {% endif %}
-</nav>
-<main>
-  <div class="table">
-    <div class="table-row multiline">
-      <div id="head" class="table-key">HEAD</div>
-      <div class="table-val">
-        <h1><span class="not-important">Hint:</span> <br/> {{hint}}</h1>
-        <h2><span class="not-important">Reported at:</span> <br/> {{created-at}}</h2>
-        <h2><span class="not-important">Report ID:</span> <br/> {{id}}</h2>
-      </div>
-    </div>
-
-    <div class="table-row multiline">
-      <div id="props" class="table-key">LOG PROPS: </div>
-      <div class="table-val">
-        <pre>{{props}}</pre>
-      </div>
-    </div>
-
-    <div class="table-row multiline">
-      <div id="context" class="table-key">CONTEXT: </div>
-
-      <div class="table-val">
-        <pre>{{context}}</pre>
-      </div>
-    </div>
-
-    {% if params %}
-    <div class="table-row multiline">
-      <div id="params" class="table-key">PARAMS: </div>
-      <div class="table-val">
-        <pre>{{params}}</pre>
-      </div>
-    </div>
-    {% endif %}
-
-    {% if data %}
-    <div class="table-row multiline">
-      <div id="edata" class="table-key">DATA: </div>
-      <div class="table-val">
-        <pre>{{data}}</pre>
-      </div>
-    </div>
-    {% endif %}
-
-    {% if value %}
-    <div class="table-row multiline">
-      <div id="value" class="table-key">VALUE: </div>
-      <div class="table-val">
-        <pre>{{value}}</pre>
-      </div>
-    </div>
-    {% endif %}
-
-    {% if explain %}
-    <div class="table-row multiline">
-      <div id="explain" class="table-key">EXPLAIN: </div>
-      <div class="table-val">
-        <pre>{{explain}}</pre>
-      </div>
-    </div>
-    {% endif %}
-
-    {% if trace %}
-    <div class="table-row multiline">
-      <div id="trace" class="table-key">TRACE:</div>
-      <div class="table-val">
-        <pre>{{trace}}</pre>
-      </div>
-    </div>
-    {% endif %}
-  </div>
-</main>
-{% endblock %}

backend/resources/app/templates/main-api-doc.tmpl

@@ -1 +0,0 @@
-{% extends "app/templates/api-doc.tmpl" %}

backend/resources/app/templates/management-api-doc.tmpl

@@ -1,10 +0,0 @@
-{% extends "app/templates/api-doc.tmpl" %}
-
-{% block auth-section %}
-{% endblock %}
-
-{% block limits-section %}
-{% endblock %}
-
-{% block webhooks-section %}
-{% endblock %}

backend/resources/app/templates/openapi.tmpl

@@ -1,28 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="utf-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1" />
-  <meta
-    name="description"
-    content="SwaggerUI"
-  />
-  <title>{{label|upper}} API</title>
-  <style>{{swagger-css|safe}}</style>
-</head>
-<body>
-<div id="swagger-ui"></div>
-<script>{{swagger-js|safe}}</script>
-<script>
-  window.onload = () => {
-    window.ui = SwaggerUIBundle({
-      url: '{{uri}}',
-      dom_id: '#swagger-ui',      
-      presets: [
-        SwaggerUIBundle.presets.apis,
-      ],
-    });
-  };
-</script>
-</body>
-</html>

backend/resources/app/templates/styles.css

@@ -23,10 +23,6 @@ input[type=text], input[type=submit] {
   padding: 3px;
 }
 
-pre {
-  white-space: pre-wrap;
-}
-
 main {
   margin: 20px;
 }
@@ -36,11 +32,6 @@ small {
   color: #888;
 }
 
-.not-important {
-  color: #888;
-  font-weight: 200;
-}
-
 small > strong {
   font-size: 9px;
 }
@@ -55,13 +46,7 @@ nav {
   background: #e3e3e3;
 }
 
-nav > .title {
-  display: flex;
-  justify-content: center;
-  width: 100%;
-}
-
-nav > .title > h1 {
+nav > h1 {
   padding: 0px;
   margin: 0px;
   font-size: 11px;
@@ -116,50 +101,29 @@ nav > div:not(:last-child) {
   width: unset;
 }
 
-.dashboard {
+.index {
   margin-top: 40px;
   display: flex;
 }
 
-.widget {
+.index > section {
+  padding: 10px;
+  background-color: #e3e3e3;
   max-width: 400px;
   margin: 5px;
   height: fit-content;
 }
 
-.widget input[type=submit] {
-  outline: none;
-  border: 1px solid gray;
-  border-radius: 2px;
-  padding: 3px 5px;
-}
-
-.widget input[type=submit].danger {
-  outline: none;
-  border: 1px solid red;
-  border-radius: 2px;
-  padding: 3px 5px;
-}
-
-
-
-.widget > fieldset {
-  padding: 10px;
-  background-color: #f9f9f9;
-}
-
-.widget > fieldset:not(:last-child) {
-  margin-bottom: 10px;
-}
-
-
-
-.dashboard fieldset:not(:first-child) {
+.index fieldset:not(:first-child) {
   margin-top: 15px;
 }
 
+/* .index > section:not(:last-child) { */
+/*   margin-bottom: 10px; */
+/* } */
 
-.widget > h2 {
+
+.index > section > h2 {
   margin-top: 0px;
 }
 
@@ -183,6 +147,7 @@ nav > div:not(:last-child) {
   line-height: 18px;
   min-width: 210px;
   margin: 0px 20px;
+  cursor: pointer;
   display: flex;
   border-radius: 3px;
 }