diff --git a/.github/workflows/codeql-analysis.yml b/.github/workflows/codeql-analysis.yml
index 394f07f..c69d5f6 100644
--- a/.github/workflows/codeql-analysis.yml
+++ b/.github/workflows/codeql-analysis.yml
@@ -9,63 +9,63 @@
 # the `language` matrix defined below to confirm you have the correct set of
 # supported CodeQL languages.
 #
-name: "CodeQL"
+name: 'CodeQL'
 
 on:
-  push:
-    branches: [ main ]
-  pull_request:
-    # The branches below must be a subset of the branches above
-    branches: [ main ]
-  schedule:
-    - cron: '22 20 * * 4'
+    push:
+        branches: [main]
+    pull_request:
+        # The branches below must be a subset of the branches above
+        branches: [main]
+    schedule:
+        - cron: '22 20 * * 4'
 
 jobs:
-  analyze:
-    name: Analyze
-    runs-on: ubuntu-latest
-    permissions:
-      actions: read
-      contents: read
-      security-events: write
+    analyze:
+        name: Analyze
+        runs-on: ubuntu-latest
+        permissions:
+            actions: read
+            contents: read
+            security-events: write
 
-    strategy:
-      fail-fast: false
-      matrix:
-        language: [ 'javascript' ]
-        # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python' ]
-        # Learn more:
-        # https://docs.github.com/en/free-pro-team@latest/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#changing-the-languages-that-are-analyzed
+        strategy:
+            fail-fast: false
+            matrix:
+                language: ['javascript']
+                # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python' ]
+                # Learn more:
+                # https://docs.github.com/en/free-pro-team@latest/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#changing-the-languages-that-are-analyzed
 
-    steps:
-    - name: Checkout repository
-      uses: actions/checkout@v2
+        steps:
+            - name: Checkout repository
+              uses: actions/checkout@v2
 
-    # Initializes the CodeQL tools for scanning.
-    - name: Initialize CodeQL
-      uses: github/codeql-action/init@v1
-      with:
-        languages: ${{ matrix.language }}
-        # If you wish to specify custom queries, you can do so here or in a config file.
-        # By default, queries listed here will override any specified in a config file.
-        # Prefix the list here with "+" to use these queries and those in the config file.
-        # queries: ./path/to/local/query, your-org/your-repo/queries@main
+            # Initializes the CodeQL tools for scanning.
+            - name: Initialize CodeQL
+              uses: github/codeql-action/init@v1
+              with:
+                  languages: ${{ matrix.language }}
+                  # If you wish to specify custom queries, you can do so here or in a config file.
+                  # By default, queries listed here will override any specified in a config file.
+                  # Prefix the list here with "+" to use these queries and those in the config file.
+                  # queries: ./path/to/local/query, your-org/your-repo/queries@main
 
-    # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
-    # If this step fails, then you should remove it and run the build manually (see below)
-    - name: Autobuild
-      uses: github/codeql-action/autobuild@v1
+            # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
+            # If this step fails, then you should remove it and run the build manually (see below)
+            - name: Autobuild
+              uses: github/codeql-action/autobuild@v1
 
-    # ℹ️ Command-line programs to run using the OS shell.
-    # 📚 https://git.io/JvXDl
+            # ℹ️ Command-line programs to run using the OS shell.
+            # 📚 https://git.io/JvXDl
 
-    # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
-    #    and modify them (or add more) to build your code if your project
-    #    uses a compiled language
+            # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
+            #    and modify them (or add more) to build your code if your project
+            #    uses a compiled language
 
-    #- run: |
-    #   make bootstrap
-    #   make release
+            #- run: |
+            #   make bootstrap
+            #   make release
 
-    - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v1
+            - name: Perform CodeQL Analysis
+              uses: github/codeql-action/analyze@v1
diff --git a/src/components/_App_PostsList/index.jsx b/src/components/_App_PostsList/index.jsx
index dceb293..67fa278 100644
--- a/src/components/_App_PostsList/index.jsx
+++ b/src/components/_App_PostsList/index.jsx
@@ -40,6 +40,7 @@ class PostsList extends React.Component {
         this.toggleComment = this.toggleComment.bind(this)
         this.toggleLike = this.toggleLike.bind(this)
         this.reportPost = this.reportPost.bind(this)
+        this.toggleLongText = this.toggleLongText.bind(this)
     }
 
     componentDidMount() {
@@ -327,6 +328,17 @@ class PostsList extends React.Component {
         })
     }
 
+    toggleLongText(postId) {
+        document.querySelector('#post_' + postId + ' div.text').classList.toggle('collapsed')
+        if (document.querySelector('#post_' + postId + ' .toggle-long-text-button')) {
+            if (document.querySelector('#post_' + postId + ' .toggle-long-text-button').innerText == 'show more') {
+                document.querySelector('#post_' + postId + ' .toggle-long-text-button').innerText = 'show less'
+            } else {
+                document.querySelector('#post_' + postId + ' .toggle-long-text-button').innerText = 'show more'
+            }
+        }
+    }
+
     render() {
         return (
             <div>
@@ -336,7 +348,7 @@ class PostsList extends React.Component {
                             <React.Fragment>
                                 {this.state.items.map((item) => (
                                     <React.Fragment key={item.id}>
-                                        <Feed.Event className={this.state.visibleCommentSections.includes(item.id) == 0 ? 'event--no-comments-visible' : ''}>
+                                        <Feed.Event id={'post_' + item.id} className={this.state.visibleCommentSections.includes(item.id) == 0 ? 'event--no-comments-visible' : ''}>
                                             <Feed.Label className="user-avatar">
                                                 <Link to={'/app/user/' + item.email}>
                                                     {item.avatar == '' ? <img src={unknownAvatar} /> : <img src={process.env.REACT_APP_API_URL + '/' + item.avatar.replace('./', '')} />}
@@ -349,8 +361,19 @@ class PostsList extends React.Component {
                                                     </Link>
                                                     <Feed.Date>{this.getDate(item.created_at)}</Feed.Date>
                                                 </Feed.Summary>
-                                                <Feed.Extra text>
+                                                <Feed.Extra className={item.post_content.length > 465 && 'collapsed'} text>
                                                     <div dangerouslySetInnerHTML={{ __html: item.post_content }}></div>
+                                                    {item.post_content.length > 465 && (
+                                                        <a
+                                                            href="#"
+                                                            className="toggle-long-text-button"
+                                                            onClick={() => {
+                                                                this.toggleLongText(item.id)
+                                                            }}
+                                                        >
+                                                            <span>show more</span>
+                                                        </a>
+                                                    )}
                                                     {item.images.length > 0 && (
                                                         <div className="post-images">
                                                             {item.images.map((postImage, index) => {
diff --git a/src/components/_App_PostsList/style.scss b/src/components/_App_PostsList/style.scss
index ab41717..bfb802b 100644
--- a/src/components/_App_PostsList/style.scss
+++ b/src/components/_App_PostsList/style.scss
@@ -10,9 +10,39 @@
         margin-top: 0 !important;
         margin-bottom: 0 !important;
         .meta {
-            margin-top: 15px !important;
+            margin-top: 10px !important;
             width: 100%;
         }
+        .text.collapsed {
+            div {
+                max-height: 90px;
+                overflow: hidden;
+                position: relative;
+
+                &::after {
+                    content: ' ';
+                    width: 100%;
+                    height: 0;
+                    position: absolute;
+                    bottom: 0;
+                    left: 0;
+                    box-shadow: 0px 0 20px 31px white;
+                }
+            }
+        }
+    }
+    a.toggle-long-text-button {
+        margin-top: 7px;
+        display: inline-block;
+        font-size: 13px;
+        color: #818e9b;
+        text-decoration: underline;
+        opacity: 0.7;
+
+        &:hover,
+        &:focus {
+            opacity: 1;
+        }
     }
     .post-images,
     .post-files {