{"id":3189,"date":"2023-12-26T06:16:23","date_gmt":"2023-12-26T12:16:23","guid":{"rendered":"https:\/\/www.teamdesk.net\/blog\/?p=3189"},"modified":"2023-12-26T06:16:24","modified_gmt":"2023-12-26T12:16:24","slug":"new-ui-design-preview","status":"publish","type":"post","link":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/","title":{"rendered":"New UI Design Preview"},"content":{"rendered":"\n<p>Today we are presenting new UI Design preview. If you are database administrator scroll all the way down to the footer and click on V3 small orange button to switch to new UI design. The change will last until browser window is closed.<\/p>\n\n\n\n<p>New UI design targets database pages only &#8212; My TeamDesk, personal preferences and other database-unrelated pages are not affected so far.<\/p>\n\n\n\n<p>Primary goal was to provide modern and overall lighter look and feel for database pages. <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-3.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1361\" height=\"1063\" src=\"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-3.png\" alt=\"New UI Design of Invoicing Database\" class=\"wp-image-3190\" srcset=\"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-3.png 1361w, https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-3-300x234.png 300w, https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-3-1024x800.png 1024w, https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-3-768x600.png 768w\" sizes=\"auto, (max-width: 1361px) 100vw, 1361px\" \/><\/a><\/figure>\n\n\n\n<p>Beside new look and feel we also added a pair of new features:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Table&#8217;s caption reappears when you start to scroll up, exposing an access to view&#8217;s actions.<\/li>\n\n\n\n<li>We added a dropdown calendar for easier navigation in calendar views.<\/li>\n<\/ul>\n\n\n\n<p>In addition, we rewrote both stylesheets and JavaScript to bring the code to latest web standards. As most browsers are now <em><a href=\"https:\/\/en.wikipedia.org\/wiki\/Evergreen_(software)\" target=\"_blank\" rel=\"noreferrer noopener\">evergreen<\/a><\/em> (in other words, browser vendors support only latest and previous version of the browser) there is a little sense to try keeping the compatibility all the way down to decade old browser. <\/p>\n\n\n\n<p>Net result, new code is faster and lighter. Plus, we got rid of jQuery and jQuery UI libraries in our code (though you can still use them in you wish). However, this move presented potential incompatibility with customizations provided via dbstyles.css and dbscript.js. To simplify transition, we do not include dbstyles.css and dbscript.js files by default, rather include new-UI-specific versions of them, named dbstyles-v3.css and dbscript-v3.js.<\/p>\n\n\n\n<p>Merry Christmas and Happy New Year!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>New UI design provides modern and overall lighter look and feel for database pages and brings the code to modern web standards.<\/p>\n","protected":false},"author":4,"featured_media":3192,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-3189","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-behind-the-scenes"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>New UI Design Preview - TeamDesk Blog<\/title>\n<meta name=\"description\" content=\"New UI design provides modern and overall lighter look and feel for database pages and brings the code to modern web standards.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"New UI Design Preview - TeamDesk Blog\" \/>\n<meta property=\"og:description\" content=\"New UI design provides modern and overall lighter look and feel for database pages and brings the code to modern web standards.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/\" \/>\n<meta property=\"og:site_name\" content=\"TeamDesk Blog\" \/>\n<meta property=\"article:published_time\" content=\"2023-12-26T12:16:23+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-12-26T12:16:24+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-4.png\" \/>\n\t<meta property=\"og:image:width\" content=\"800\" \/>\n\t<meta property=\"og:image:height\" content=\"600\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Kirill Bondar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kirill Bondar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/\"},\"author\":{\"name\":\"Kirill Bondar\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#\\\/schema\\\/person\\\/22c4c05bd657513c8b00122fa364c8d2\"},\"headline\":\"New UI Design Preview\",\"datePublished\":\"2023-12-26T12:16:23+00:00\",\"dateModified\":\"2023-12-26T12:16:24+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/\"},\"wordCount\":254,\"commentCount\":10,\"image\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/12\\\/image-4.png\",\"articleSection\":[\"Behind the Scenes\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/\",\"url\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/\",\"name\":\"New UI Design Preview - TeamDesk Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/12\\\/image-4.png\",\"datePublished\":\"2023-12-26T12:16:23+00:00\",\"dateModified\":\"2023-12-26T12:16:24+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#\\\/schema\\\/person\\\/22c4c05bd657513c8b00122fa364c8d2\"},\"description\":\"New UI design provides modern and overall lighter look and feel for database pages and brings the code to modern web standards.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/12\\\/image-4.png\",\"contentUrl\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/12\\\/image-4.png\",\"width\":800,\"height\":600,\"caption\":\"New UI Design Preview\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/behind-the-scenes\\\/new-ui-design-preview\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"New UI Design Preview\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/\",\"name\":\"TeamDesk Blog\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#\\\/schema\\\/person\\\/22c4c05bd657513c8b00122fa364c8d2\",\"name\":\"Kirill Bondar\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g\",\"caption\":\"Kirill Bondar\"},\"url\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/author\\\/kirill-bondar\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"New UI Design Preview - TeamDesk Blog","description":"New UI design provides modern and overall lighter look and feel for database pages and brings the code to modern web standards.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/","og_locale":"en_US","og_type":"article","og_title":"New UI Design Preview - TeamDesk Blog","og_description":"New UI design provides modern and overall lighter look and feel for database pages and brings the code to modern web standards.","og_url":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/","og_site_name":"TeamDesk Blog","article_published_time":"2023-12-26T12:16:23+00:00","article_modified_time":"2023-12-26T12:16:24+00:00","og_image":[{"width":800,"height":600,"url":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-4.png","type":"image\/png"}],"author":"Kirill Bondar","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kirill Bondar","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/#article","isPartOf":{"@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/"},"author":{"name":"Kirill Bondar","@id":"https:\/\/www.teamdesk.net\/blog\/#\/schema\/person\/22c4c05bd657513c8b00122fa364c8d2"},"headline":"New UI Design Preview","datePublished":"2023-12-26T12:16:23+00:00","dateModified":"2023-12-26T12:16:24+00:00","mainEntityOfPage":{"@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/"},"wordCount":254,"commentCount":10,"image":{"@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/#primaryimage"},"thumbnailUrl":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-4.png","articleSection":["Behind the Scenes"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/","url":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/","name":"New UI Design Preview - TeamDesk Blog","isPartOf":{"@id":"https:\/\/www.teamdesk.net\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/#primaryimage"},"image":{"@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/#primaryimage"},"thumbnailUrl":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-4.png","datePublished":"2023-12-26T12:16:23+00:00","dateModified":"2023-12-26T12:16:24+00:00","author":{"@id":"https:\/\/www.teamdesk.net\/blog\/#\/schema\/person\/22c4c05bd657513c8b00122fa364c8d2"},"description":"New UI design provides modern and overall lighter look and feel for database pages and brings the code to modern web standards.","breadcrumb":{"@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/#primaryimage","url":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-4.png","contentUrl":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2023\/12\/image-4.png","width":800,"height":600,"caption":"New UI Design Preview"},{"@type":"BreadcrumbList","@id":"https:\/\/www.teamdesk.net\/blog\/behind-the-scenes\/new-ui-design-preview\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.teamdesk.net\/blog\/"},{"@type":"ListItem","position":2,"name":"New UI Design Preview"}]},{"@type":"WebSite","@id":"https:\/\/www.teamdesk.net\/blog\/#website","url":"https:\/\/www.teamdesk.net\/blog\/","name":"TeamDesk Blog","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.teamdesk.net\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.teamdesk.net\/blog\/#\/schema\/person\/22c4c05bd657513c8b00122fa364c8d2","name":"Kirill Bondar","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g","caption":"Kirill Bondar"},"url":"https:\/\/www.teamdesk.net\/blog\/author\/kirill-bondar\/"}]}},"_links":{"self":[{"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/posts\/3189","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/comments?post=3189"}],"version-history":[{"count":3,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/posts\/3189\/revisions"}],"predecessor-version":[{"id":3194,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/posts\/3189\/revisions\/3194"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/media\/3192"}],"wp:attachment":[{"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/media?parent=3189"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/categories?post=3189"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/tags?post=3189"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}