diff --git a/package-lock.json b/package-lock.json
index 183dcd2..e51ad83 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "pdfview",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1263,6 +1263,7 @@
       "version": "3.14.3",
       "resolved": "https://registry.npmjs.org/autolinker/-/autolinker-3.14.3.tgz",
       "integrity": "sha512-t81i2bCpS+s+5FIhatoww9DmpjhbdiimuU9ATEuLxtZMQ7jLv9fyFn7SWNG8IkEfD4AmYyirL1ss9k1aqVWRvg==",
+      "dev": true,
       "requires": {
         "tslib": "^1.9.3"
       }
@@ -1976,9 +1977,9 @@
       "dev": true
     },
     "pdfjs-dist": {
-      "version": "2.7.570",
-      "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-2.7.570.tgz",
-      "integrity": "sha512-/ZkA1FwkEOyDaq11JhMLazdwQAA0F9uwrP7h/1L9Akt9KWh1G5/tkzS+bPuUELq2s2GDFnaT+kooN/aSjT7DXQ==",
+      "version": "2.5.207",
+      "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-2.5.207.tgz",
+      "integrity": "sha512-xGDUhnCYPfHy+unMXCLCJtlpZaaZ17Ew3WIL0tnSgKFUZXHAPD49GO9xScyszSsQMoutNDgRb+rfBXIaX/lJbw==",
       "dev": true
     },
     "picomatch": {
@@ -2088,6 +2089,7 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/remarkable/-/remarkable-2.0.1.tgz",
       "integrity": "sha512-YJyMcOH5lrR+kZdmB0aJJ4+93bEojRZ1HGDn9Eagu6ibg7aVZhc3OWbbShRid+Q5eAfsEqWxpe+g5W5nYNfNiA==",
+      "dev": true,
       "requires": {
         "argparse": "^1.0.10",
         "autolinker": "^3.11.0"
@@ -2097,6 +2099,7 @@
           "version": "1.0.10",
           "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
           "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
+          "dev": true,
           "requires": {
             "sprintf-js": "~1.0.2"
           }
@@ -2291,7 +2294,8 @@
     "sprintf-js": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
+      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
+      "dev": true
     },
     "strip-indent": {
       "version": "3.0.0",
@@ -2393,7 +2397,8 @@
     "tslib": {
       "version": "1.14.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
-      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
+      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
+      "dev": true
     },
     "unicode-canonical-property-names-ecmascript": {
       "version": "1.0.4",
diff --git a/package.json b/package.json
index 95c6e6b..c7ff1c2 100644
--- a/package.json
+++ b/package.json
@@ -28,7 +28,7 @@
     "@rollup/plugin-node-resolve": "^11.2.1",
     "core-js": "^3.11.0",
     "fs-extra": "^9.1.0",
-    "pdfjs-dist": "^2.7.570",
+    "pdfjs-dist": "2.5.207",
     "prettier": "^2.2.1",
     "prettier-plugin-svelte": "^2.2.0",
     "remarkable": "^2.0.1",
diff --git a/rollup.config.js b/rollup.config.js
index 7b8c6d5..cf83526 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -10,8 +10,8 @@ import {copySync} from "fs-extra"
 import path from "path"
 import babel from "@rollup/plugin-babel"
 
-const pdfJsWorker = path.resolve(__dirname, "node_modules/pdfjs-dist/es5/build/pdf.worker.min.js")
-const pdfJs = path.resolve(__dirname, "node_modules/pdfjs-dist/es5/build/pdf.min.js")
+const pdfJsWorker = path.resolve(__dirname, "node_modules/pdfjs-dist/es5/build/pdf.worker.js")
+// const pdfJs = path.resolve(__dirname, "node_modules/pdfjs-dist/es5/build/pdf.js")
 // const pdfJsWorker = path.resolve(__dirname, "node_modules/pdfjs-dist/build/pdf.worker.min.js")
 // const pdfJs = path.resolve(__dirname, "node_modules/pdfjs-dist/build/pdf.min.js")
 
@@ -90,7 +90,7 @@ const copyToDist = () => ({
 })
 
 export default {
-  external: ["tizen", pdfJs, pdfJsWorker, "webapis"],
+  external: ["tizen", pdfJsWorker, "webapis"],
   input: "src/index.js",
   output: {
     file: "build/bundle.js",
@@ -98,7 +98,7 @@ export default {
     name: "app",
     globals: {
       [pdfJsWorker]: "PdfjsWorker",
-      [pdfJs]: "Pdfjs",
+      // [pdfJs]: "Pdfjs",
       "tizen": "tizen",
       "webapis": "webapis"
     }
diff --git a/src/components/GenericList.svelte b/src/components/GenericList.svelte
new file mode 100644
index 0000000..ef9b71c
--- /dev/null
+++ b/src/components/GenericList.svelte
@@ -0,0 +1,159 @@
+<script>
+  import {createEventDispatcher} from "svelte"
+  import {scrollTo} from "../utils"
+
+  export let title
+  export let items
+  export let height = 360
+  export let itemsShow = 3
+  /**
+   * Выбранный элемент
+   * @type {number}
+   */
+  export let chosen = 0
+
+  const dispatch = createEventDispatcher()
+
+  let itemHeight = height / itemsShow
+
+  /**
+   * ID таймаута скролла
+   * @type {number}
+   */
+  let scrollTimeout
+
+  /**
+   * ID таймаута выбора элемента
+   * @type {number}
+   */
+  let selectTimeout
+  let containerNode
+
+  /**
+   * Предыдущий выбранный элемент. Нужен чтобы понимать произошли ли изменения
+   * @type {number}
+   */
+  let lastChosen = 0
+
+  function scroll(e) {
+    let scrollTop = e.target.scrollTop
+    let new_chosen =
+      Math.round((scrollTop + height / 2 + itemHeight / 2) / itemHeight) - 2
+
+    if (new_chosen !== chosen) {
+      lastChosen = chosen
+      chosen = new_chosen
+      if (selectTimeout) clearTimeout(selectTimeout)
+      selectTimeout = setTimeout(() => {
+        dispatch("select", {index: chosen})
+      }, 500)
+    }
+
+    if (scrollTimeout) clearTimeout(scrollTimeout)
+    scrollTimeout = setTimeout(() => {
+      let scroll = itemHeight * chosen
+      scrollTo(containerNode, 0, scroll)
+    }, 300)
+  }
+
+  function bezelRotate(e) {
+    if (e.detail.direction === "CW" && chosen < items.length - 1) {
+      chosen = chosen + 1
+      scrollTo(containerNode, 0, itemHeight * chosen)
+    }
+    if (e.detail.direction === "CCW" && chosen > 0) {
+      chosen = chosen - 1
+      scrollTo(containerNode, 0, itemHeight * chosen)
+    }
+  }
+</script>
+
+<svelte:window on:rotarydetent={bezelRotate} />
+
+<div
+  bind:this={containerNode}
+  class="cont"
+  on:scroll={scroll}
+  style="height: {height}px;"
+>
+  <div class="item fake-item" style="height: {itemHeight}px;">
+    {#if title}
+      <div class="title" style="color: #14b6ff">{title}</div>
+    {/if}
+  </div>
+  <!-- TODO: добавить id -->
+  {#each items as item, i (item.title || item)}
+    <div
+      on:click={() => dispatch("click", item)}
+      class:active={chosen === i}
+      class="item"
+      style="height: {itemHeight}px;"
+    >
+      <slot {item} active={chosen === i} />
+    </div>
+  {/each}
+  <div class="fake-item" style="height: {itemHeight}px;" />
+</div>
+
+<style>
+  .item {
+    text-align: center;
+    margin: 0;
+    box-sizing: border-box;
+    border-radius: 99px;
+    transition: background ease-in-out 0.5s;
+    justify-content: center;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .cont {
+    overflow-y: scroll;
+    scroll-behavior: smooth;
+  }
+
+  .active {
+    background: #3a3a3a;
+  }
+
+  .title {
+    font-weight: bold;
+    font-size: 2em;
+  }
+
+  .active .title {
+    font-size: 2.2em;
+  }
+
+  .subtitle {
+    font-size: 1.8em;
+    /* TODO: сделать плавающий текст */
+    max-height: 72px;
+    overflow: hidden;
+    word-break: break-all;
+  }
+
+  .title {
+    max-width: 100%;
+    margin: 0 auto;
+    white-space: nowrap;
+    overflow: hidden;
+  }
+
+  .title span {
+    display: inline-block;
+  }
+
+  .title :global(span.animated) {
+    animation: marquee 10s ease-in-out alternate infinite;
+  }
+
+  @keyframes marquee {
+    0% {
+      transform: translateX(20px);
+    }
+    100% {
+      transform: translateX(calc(-100% + 340px));
+    }
+  }
+</style>
diff --git a/src/components/List.svelte b/src/components/List.svelte
index 8241a04..d1c13a2 100644
--- a/src/components/List.svelte
+++ b/src/components/List.svelte
@@ -18,13 +18,13 @@
   let itemHeight = height / itemsShow
 
   /**
-   * ID таймоута скролла
+   * ID таймаута скролла
    * @type {number}
    */
   let scrollTimeout
 
   /**
-   * ID таймоута выбора элемента
+   * ID таймаута выбора элемента
    * @type {number}
    */
   let selectTimeout
diff --git a/src/constants.js b/src/constants.js
index ae43d70..faf732f 100644
--- a/src/constants.js
+++ b/src/constants.js
@@ -12,6 +12,14 @@ export const defaultConfigValues = {
   txtFontSize: "16",
   txtTheme: "white",
   pdfAction: bezelActions.scale,
+  zoomButtons: "",
+  supportBezel:
+    isDev ||
+    tizen.systeminfo.getCapability(
+      "http://tizen.org/feature/input.rotating_bezel"
+    )
+      ? "true"
+      : "",
 }
 
 export const pages = {
@@ -84,9 +92,3 @@ export const bezelActionsButtons = {
 }
 
 export const isDev = is_dev
-
-export const supportBezel =
-  isDev ||
-  tizen.systeminfo.getCapability(
-    "http://tizen.org/feature/input.rotating_bezel"
-  )
diff --git a/src/pages/MainScreen.svelte b/src/pages/MainScreen.svelte
index db7559f..e48c2ae 100644
--- a/src/pages/MainScreen.svelte
+++ b/src/pages/MainScreen.svelte
@@ -7,7 +7,7 @@
 
   let pagesList = [
     {title: "Open", subtitle: "Open a load file", pageId: pages.filesList},
-    // {title: "Settings", subtitle: "Bezel action", pageId: pages.settings},
+    {title: "Settings", subtitle: "Bezel action", pageId: pages.settings},
     {title: "Help", subtitle: "App description", pageId: pages.help},
   ]
   if ($configStore.lastFile) {
diff --git a/src/pages/PdfView.svelte b/src/pages/PdfView.svelte
index b7616a6..2569309 100644
--- a/src/pages/PdfView.svelte
+++ b/src/pages/PdfView.svelte
@@ -2,7 +2,7 @@
   import {configStore, docStore} from "../store"
   import {onMount} from "svelte"
   import InViewSettings from "../components/InViewSettings.svelte"
-  import {bezelActions, bezelActionsButtons, supportBezel} from "../constants"
+  import {bezelActions, bezelActionsButtons} from "../constants"
   import {bezelEventScroll} from "../utils"
   import InViewSettingsBlock from "../components/InViewSettingsBlock.svelte"
 
@@ -91,7 +91,7 @@
 <div
   bind:this={containerNode}
   class="container"
-  class:bottom-padding={!supportBezel}
+  class:bottom-padding={!$configStore.supportBezel}
 >
   <div class="buttons-block top">
     <button on:click={backwards} style="text-align: right;">&lt</button>
@@ -99,14 +99,14 @@
     <button on:click={towards} style="text-align: left;">&gt</button>
   </div>
   <canvas bind:this={canvas} />
-  {#if !supportBezel}
+  {#if $configStore.zoomButtons}
     <div class="buttons-block bottom">
       <button on:click={scaleDown} style="text-align: right;">-</button>
       <button on:click={scaleUp} style="text-align: left;">+</button>
     </div>
   {/if}
 </div>
-{#if supportBezel}
+{#if $configStore.supportBezel}
   <InViewSettings>
     <InViewSettingsBlock
       bind:current={pdfAction}
diff --git a/src/pages/Settings.svelte b/src/pages/Settings.svelte
new file mode 100644
index 0000000..6b28dd7
--- /dev/null
+++ b/src/pages/Settings.svelte
@@ -0,0 +1,104 @@
+<script>
+  import GenericList from "../components/GenericList.svelte"
+  import {configStore} from "../store"
+  import {derived} from "svelte/store"
+
+  const settings = derived(configStore, ($configs) => [
+    {
+      text: "Zoom buttons",
+      subtitle: "show +- buttons in bottom",
+      value: $configs.zoomButtons,
+      key: "zoomButtons",
+    },
+    {
+      text: "Bezel support",
+      subtitle: "Does watch have bezel",
+      value: $configs.supportBezel,
+      key: "supportBezel",
+    },
+  ])
+
+  function setSetting(key, value) {
+    configStore.set(key, value)
+  }
+
+  $: console.log(settings)
+</script>
+
+<div class="w">
+  <GenericList items={$settings} let:active let:item>
+    <div
+      class="item"
+      class:active
+      on:click={() => setSetting(item.key, item.value === "" ? "true" : "")}
+    >
+      <div>
+        <div class="title">{item.text}</div>
+        <div>{item.subtitle}</div>
+      </div>
+      <label class="toggle-control" class:checked={item.value}>
+        <!--        <input type="checkbox" checked={item.value} on:click|preventDefault />-->
+        <span class="control" />
+      </label>
+    </div>
+  </GenericList>
+</div>
+
+<style>
+  .item {
+    height: 100%;
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+  }
+
+  .title {
+    font-weight: bold;
+    font-size: 2em;
+  }
+
+  .active .title {
+    font-size: 2.2em;
+  }
+
+  .toggle-control {
+    position: relative;
+    height: 30px;
+    display: block;
+    padding-left: 60px;
+    cursor: pointer;
+    font-size: 22px;
+    user-select: none;
+  }
+
+  .toggle-control.checked .control {
+    background-color: dodgerblue;
+  }
+
+  .toggle-control.checked .control:after {
+    left: 33px;
+  }
+
+  .toggle-control .control {
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 30px;
+    width: 60px;
+    border-radius: 15px;
+    background-color: darkgray;
+    transition: background-color 0.15s ease-in;
+  }
+
+  .toggle-control .control:after {
+    content: "";
+    position: absolute;
+    left: 3px;
+    top: 3px;
+    width: 24px;
+    height: 24px;
+    border-radius: 15px;
+    background: white;
+    transition: left 0.15s ease-in;
+  }
+</style>
diff --git a/src/pages/TxtView.svelte b/src/pages/TxtView.svelte
index c5196a4..ad0732f 100644
--- a/src/pages/TxtView.svelte
+++ b/src/pages/TxtView.svelte
@@ -2,7 +2,7 @@
   /* global tizen */
   import {onMount} from "svelte"
   import InViewSettings from "../components/InViewSettings.svelte"
-  import {bezelActions, bezelActionsButtons, isDev, supportBezel, theme} from "../constants"
+  import {bezelActions, bezelActionsButtons, isDev, theme} from "../constants"
   import {configStore} from "../store"
   import {Remarkable} from "remarkable"
   import {bezelEventScroll, getExtension} from "../utils"
@@ -98,7 +98,7 @@
   {@html md ? markdown.render(text) : text}
 </div>
 <InViewSettings>
-  {#if supportBezel}
+  {#if $configStore.supportBezel}
     <InViewSettingsBlock
       bind:current={txtAction}
       {buttons}
@@ -112,7 +112,7 @@
     title="Theme"
   />
 </InViewSettings>
-{#if !supportBezel}
+{#if $configStore.zoomButtons}
   <div class="buttons-block bottom">
     <button on:click={scaleDown} style="text-align: right;">-</button>
     <button on:click={scaleUp} style="text-align: left;">+</button>
diff --git a/src/routes.js b/src/routes.js
index 33c6f18..016ba1d 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -7,6 +7,7 @@ import MainScreen from "./pages/MainScreen.svelte"
 import Message from "./pages/Message.svelte"
 import FileReceive from "./pages/FileReceive.svelte"
 import TxtView from "./pages/TxtView.svelte"
+import Settings from "./pages/Settings.svelte"
 
 export const routes = {
   [pages.filesList]: FilesList,
@@ -17,4 +18,5 @@ export const routes = {
   [pages.message]: Message,
   [pages.fileReceive]: FileReceive,
   [pages.txtView]: TxtView,
+  [pages.settings]: Settings,
 }