From 89f942b8b2751a7633fb536be04e94312bb1ea0b Mon Sep 17 00:00:00 2001
From: adelinachiripuci <45297914+adelinachiripuci@users.noreply.github.com>
Date: Tue, 25 Jan 2022 14:10:25 +0200
Subject: [PATCH] feat(changelog): Improve design (#554)

---
 .../changelog/src/_changelog.theme.scss       | 59 +++++++++++++++++--
 .../changelog/src/changelog.component.html    | 18 +++---
 .../changelog/src/changelog.component.scss    | 16 ++---
 .../changelog/src/changelog.component.ts      |  1 +
 4 files changed, 68 insertions(+), 26 deletions(-)

diff --git a/libs/angular-components/changelog/src/_changelog.theme.scss b/libs/angular-components/changelog/src/_changelog.theme.scss
index 03cd00daf..a3ec4e35d 100644
--- a/libs/angular-components/changelog/src/_changelog.theme.scss
+++ b/libs/angular-components/changelog/src/_changelog.theme.scss
@@ -12,21 +12,59 @@
 
   uxg-changelog {
     .title {
+       height: 250px;
+       position: relative;
       .changelog-icon {
-        background-image: url('data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20width%3D%22115px%22%20height%3D%22115px%22%20viewBox%3D%220%200%20115%20115%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Ctitle%3Esupport%3C%2Ftitle%3E%0A%20%20%20%20%3Cg%20id%3D%22Page-1%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Changelog-op3%22%20transform%3D%22translate%28-487.000000%2C%20-103.000000%29%22%20fill%3D%22%23C137A2%22%20fill-rule%3D%22nonzero%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-5%22%20transform%3D%22translate%28487.000000%2C%20103.000000%29%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22support%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M20.2983628%2C89.9229818%20C18.6826296%2C89.9229818%2017.1294128%2C90.3292909%2015.7514168%2C91.0922297%20C8.49250459%2C81.716954%204.50820361%2C70.0706047%204.50820361%2C58.1394841%20C4.50820361%2C28.5853648%2028.3717456%2C4.5421472%2057.7050062%2C4.5421472%20C61.2710656%2C4.5421472%2064.8353641%2C4.89966392%2068.2992847%2C5.60493878%20C69.5179085%2C5.85333746%2070.708356%2C5.0584617%2070.9548984%2C3.82888815%20C71.2014408%2C2.59931459%2070.4125051%2C1.40167824%2069.1921204%2C1.15239248%20C65.4349905%2C0.387679304%2061.5704387%2C0%2057.7050062%2C0%20C42.2917047%2C0%2027.8002954%2C6.04762054%2016.901361%2C17.0286164%20C6.00242651%2C28.0096119%200%2C42.6101313%200%2C58.1394841%20C0%2C71.202593%204.40254259%2C83.9507679%2012.4178117%2C94.1705991%20C11.3858557%2C95.723978%2010.8311352%2C97.5497082%2010.8311352%2C99.4614909%20C10.8311352%2C102.009352%2011.8164243%2C104.404625%2013.6047372%2C106.205515%20C15.3921693%2C108.007292%2017.7695423%2C109%2020.2983628%2C109%20C22.8271833%2C109%2025.2045563%2C108.007292%2026.9928691%2C106.205515%20C28.781182%2C104.404625%2029.7655904%2C102.008464%2029.7655904%2C99.4606036%20C29.7655904%2C96.9136302%2028.781182%2C94.5174702%2026.9928691%2C92.7165797%20C25.2045563%2C90.9148021%2022.8271833%2C89.9229818%2020.2983628%2C89.9229818%20Z%20M23.8045478%2C102.994075%20C22.8685672%2C103.93799%2021.6226476%2C104.457853%2020.2983628%2C104.457853%20C18.974078%2C104.457853%2017.7290391%2C103.93799%2016.792178%2C102.994075%20C15.8553169%2C102.05016%2015.3393388%2C100.795747%2015.3393388%2C99.4614909%20C15.3393388%2C98.1263478%2015.8553169%2C96.8719346%2016.792178%2C95.9280197%20C17.7281586%2C94.9841047%2018.974078%2C94.465129%2020.2983628%2C94.465129%20C21.6226476%2C94.465129%2022.8676868%2C94.9849918%2023.8045478%2C95.9280197%20C24.7414089%2C96.8719346%2025.2573868%2C98.1263478%2025.2573868%2C99.4614909%20C25.2573868%2C100.795747%2024.7414089%2C102.05016%2023.8045478%2C102.994075%20L23.8045478%2C102.994075%20Z%22%20id%3D%22Shape%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M102.562056%2C20.8267396%20C105.016136%2C17.1229379%20104.621967%2C12.0591535%20101.376021%2C8.7935979%20C99.5850625%2C6.99270762%2097.2041729%2C6%2094.6716118%2C6%20C92.1390506%2C6%2089.758161%2C6.99270762%2087.9672029%2C8.7935979%20C86.1762448%2C10.5953755%2085.1903802%2C12.9906484%2085.1903802%2C15.5385091%20C85.1903802%2C18.0863698%2086.1762448%2C20.4816427%2087.9672029%2C22.2834203%20C89.758161%2C24.0851979%2092.1390506%2C25.0770182%2094.6716118%2C25.0770182%20C96.2897349%2C25.0770182%2097.8452493%2C24.6707091%2099.2252836%2C23.9077703%20C106.494933%2C33.2839331%20110.485128%2C44.9293953%20110.485128%2C56.8605159%20C110.485128%2C86.4146352%2086.5862868%2C110.457853%2057.2096362%2C110.457853%20C53.6735744%2C110.457853%2050.1375123%2C110.107433%2046.701095%2C109.415465%20C45.4789048%2C109.169728%2044.2893419%2C109.967265%2044.0441986%2C111.196839%20C43.7999368%2C112.427299%2044.5926849%2C113.623162%2045.814875%2C113.869786%20C49.5422898%2C114.619418%2053.3764039%2C115%2057.2096362%2C115%20C72.6457372%2C115%2087.1585823%2C108.952379%2098.0736384%2C97.9713836%20C108.988695%2C86.9903881%20115%2C72.3898687%20115%2C56.8605159%20C115%2C43.7965197%20110.590063%2C31.0474579%20102.562056%2C20.8267396%20Z%20M91.1602404%2C19.0719803%20C90.2219935%2C18.1280654%2089.7052524%2C16.8736522%2089.7052524%2C15.5385091%20C89.7052524%2C14.2042534%2090.2219935%2C12.9498402%2091.1602404%2C12.0059252%20C92.0976055%2C11.0620103%2093.3453681%2C10.5421472%2094.6716118%2C10.5421472%20C95.9978555%2C10.5421472%2097.2456178%2C11.0620103%2098.1838647%2C12.0059252%20C100.11944%2C13.9540805%20100.11944%2C17.123825%2098.1838647%2C19.0719803%20C97.2456178%2C20.0150082%2095.9978555%2C20.534871%2094.6716118%2C20.534871%20C93.3444861%2C20.534871%2092.0976055%2C20.0150082%2091.1602404%2C19.0719803%20Z%22%20id%3D%22Shape%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M48.7046959%2C95.7472527%20C48.7046959%2C96.9915437%2049.7139455%2C98%2050.9572494%2C98%20L65.0418684%2C98%20C66.2860521%2C98%2067.2944219%2C96.9915437%2067.2944219%2C95.7472527%20L67.2944219%2C91.379915%20C70.2561777%2C90.5826537%2073.087708%2C89.4087611%2075.7485369%2C87.8758371%20L78.8317195%2C90.9592849%20C79.2540733%2C91.381675%2079.8268907%2C91.6192693%2080.4252252%2C91.6192693%20C81.0217998%2C91.6192693%2081.5954971%2C91.381675%2082.0178509%2C90.958405%20L91.9730815%2C80.9952782%20C92.8521054%2C80.1152988%2092.8521054%2C78.6888522%2091.9730815%2C77.8097527%20L88.8934187%2C74.7298249%20C90.4262108%2C72.0687672%2091.6000023%2C69.2369934%2092.3971952%2C66.2749828%20L96.7474392%2C66.2749828%20C97.991623%2C66.2749828%2099.0000024%2C65.2665263%2099.0000024%2C64.0222356%20L99.0000024%2C49.9364053%20C99.0000024%2C48.6921146%2097.991623%2C47.6836581%2096.7474392%2C47.6836581%20L92.3963153%2C47.6836581%20C91.5991225%2C44.7225275%2090.4262108%2C41.8907539%2088.8934187%2C39.2296962%20L91.9563635%2C36.1664878%20C92.3787173%2C35.7440976%2092.6162912%2C35.1703511%2092.6162912%2C34.572845%20C92.6154113%2C33.9753392%2092.3778374%2C33.4015926%2091.9554836%2C32.9792025%20L81.9923337%2C23.0231155%20C81.1133098%2C22.1440163%2079.6869859%2C22.1440163%2078.8070822%2C23.0239956%20L75.7485369%2C26.083684%20C73.087708%2C24.5507597%2070.2561777%2C23.3768673%2067.2944219%2C22.5796059%20L67.2944219%2C18.2527473%20C67.2944219%2C17.0084563%2066.2860521%2C16%2065.0418684%2C16%20L50.9572494%2C16%20C49.7139455%2C16%2048.7046959%2C17.0084563%2048.7046959%2C18.2527473%20L48.7046959%2C22.580486%20C45.7438199%2C23.3768673%2042.9122896%2C24.5507597%2040.2514607%2C26.083684%20L37.1920355%2C23.0239956%20C36.3130116%2C22.1448962%2034.8866878%2C22.1440163%2034.006784%2C23.0231155%20L24.044514%2C32.9800824%20C23.6212803%2C33.4024725%2023.3837064%2C33.9753392%2023.3837064%2C34.572845%20C23.3837064%2C35.1703511%2023.6212803%2C35.7440976%2024.0436341%2C36.1664878%20L27.1065789%2C39.2296962%20C25.5737867%2C41.8907539%2024.3999953%2C44.7216475%2023.6028024%2C47.6836581%20L19.2604775%2C47.6836581%20C18.0162937%2C47.6836581%2017.0079239%2C48.6921146%2017.0079239%2C49.9355254%20L17.0000024%2C64.0213557%20C16.999125%2C64.6188615%2017.2366989%2C65.1926083%2017.6590527%2C65.6149984%20C18.0814065%2C66.0373885%2018.6542239%2C66.2749828%2019.2525584%2C66.2749828%20L23.6028024%2C66.2749828%20C24.3999953%2C69.2369934%2025.5737867%2C72.0687672%2027.1065789%2C74.7298249%20L24.0269161%2C77.8097527%20C23.1478922%2C78.6888522%2023.1470124%2C80.1152988%2024.0269161%2C80.9952782%20L33.9821467%2C90.958405%20C34.4045005%2C91.3807951%2034.9773179%2C91.6192693%2035.5747724%2C91.6192693%20L35.5756524%2C91.6192693%20C36.1731069%2C91.6192693%2036.7459243%2C91.381675%2037.1682781%2C90.9592849%20L40.2505809%2C87.8758371%20C42.9122896%2C89.4087611%2045.7438199%2C90.5826537%2048.7046959%2C91.379915%20L48.7046959%2C95.7472527%20Z%20M41.1340042%2C83.138028%20C40.2426618%2C82.5616415%2039.0697502%2C82.6865987%2038.3183123%2C83.437221%20L35.5756524%2C86.1801168%20L28.8047932%2C79.4033955%20L31.5448135%2C76.6622596%20C32.2953714%2C75.9116372%2032.4203176%2C74.7386248%2031.8439806%2C73.8472055%20C29.8017241%2C70.6863195%2028.3657212%2C67.2218407%2027.5773275%2C63.5488065%20C27.353832%2C62.511311%2026.4369722%2C61.7694883%2025.3749284%2C61.7694883%20L21.5059918%2C61.7694883%20L21.5112713%2C52.1891526%20L25.3749284%2C52.1891526%20C26.4369722%2C52.1891526%2027.353832%2C51.44821%2027.5773275%2C50.4098344%20C28.3657212%2C46.7376802%2029.8017241%2C43.2732014%2031.8439806%2C40.1123154%20C32.4203176%2C39.2208963%2032.2953714%2C38.0478838%2031.5448135%2C37.2972612%20L28.8223913%2C34.5737252%20L35.5985298%2C27.8022837%20L38.3183123%2C30.5231799%20C39.0697502%2C31.2738023%2040.2417817%2C31.3978794%2041.1340042%2C30.8223729%20C44.2937385%2C28.7799408%2047.7579194%2C27.3438144%2051.4306377%2C26.5553529%20C52.468044%2C26.331838%2053.2098029%2C25.4140195%2053.2098029%2C24.3527644%20L53.2098029%2C20.5054945%20L62.7893148%2C20.5054945%20L62.7893148%2C24.3518845%20C62.7893148%2C25.4140195%2063.5301936%2C26.331838%2064.56848%2C26.5544728%20C68.2403185%2C27.3438144%2071.7053792%2C28.7790607%2074.8651135%2C30.821493%20C75.756456%2C31.3978794%2076.9293676%2C31.2738023%2077.6799256%2C30.5223%20L80.4005877%2C27.8022837%20L87.1767264%2C34.5737252%20L84.4543042%2C37.2963813%20C83.7028665%2C38.0478838%2083.5788002%2C39.2208963%2084.1551369%2C40.1123154%20C86.1973937%2C43.2732014%2087.6325165%2C46.7376802%2088.4217903%2C50.4098344%20C88.6444059%2C51.44821%2089.5621455%2C52.1891526%2090.6241891%2C52.1891526%20L94.4948857%2C52.1891526%20L94.4948857%2C61.7694883%20L90.6241891%2C61.7694883%20C89.5621455%2C61.7694883%2088.6452857%2C62.511311%2088.4217903%2C63.5488065%20C87.6333965%2C67.2209607%2086.1973937%2C70.6863195%2084.1551369%2C73.8463255%20C83.5788002%2C74.7386248%2083.7037464%2C75.9116372%2084.4543042%2C76.6622596%20L87.1943245%2C79.4025153%20L80.4234653%2C86.1792368%20L77.6808055%2C83.437221%20C76.9293676%2C82.6857185%2075.756456%2C82.5616415%2074.8651135%2C83.138028%20C71.7044994%2C85.1804602%2068.2403185%2C86.6157066%2064.56848%2C87.4050481%20C63.5301936%2C87.628563%2062.7893148%2C88.5455014%2062.7893148%2C89.6076366%20L62.7893148%2C93.4945055%20L53.2098029%2C93.4945055%20L53.2098029%2C89.6076366%20C53.2098029%2C88.5463813%2052.468044%2C87.628563%2051.4306377%2C87.4050481%20C47.7587993%2C86.6165865%2044.2946184%2C85.1804602%2041.1340042%2C83.138028%20L41.1340042%2C83.138028%20Z%22%20id%3D%22Shape%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M76%2C57.5%20C76%2C47.2988937%2067.7011063%2C39%2057.5%2C39%20C47.2988937%2C39%2039%2C47.2988937%2039%2C57.5%20C39%2C67.7011063%2047.2988937%2C76%2057.5%2C76%20C67.7011063%2C76%2076%2C67.7011063%2076%2C57.5%20Z%20M43.4778519%2C57.5%20C43.4778519%2C49.7678344%2049.7678344%2C43.4778519%2057.5%2C43.4778519%20C65.2321656%2C43.4778519%2071.5221481%2C49.7687089%2071.5221481%2C57.5%20C71.5221481%2C65.2312911%2065.2321656%2C71.5221481%2057.5%2C71.5221481%20C49.7678344%2C71.5221481%2043.4778519%2C65.2321656%2043.4778519%2C57.5%20Z%22%20id%3D%22Shape%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M77.5%2C8%20C78.1582032%2C8%2078.8027343%2C7.73257868%2079.2675782%2C7.26800712%20C79.7324218%2C6.80050753%2080%2C6.15635369%2080%2C5.49853611%20C80%2C4.84462224%2079.7333985%2C4.19949247%2079.2675782%2C3.73199288%20C78.8027343%2C3.26742132%2078.1582032%2C3%2077.5%2C3%20C76.8398438%2C3%2076.1982423%2C3.26742132%2075.7333985%2C3.73199288%20C75.2675783%2C4.19949247%2075%2C4.84169445%2075%2C5.49853611%20C75%2C6.1583058%2075.2675782%2C6.80050753%2075.7333985%2C7.26800712%20C76.1982423%2C7.73257868%2076.8398438%2C8%2077.5%2C8%20Z%22%20id%3D%22Path%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M37.5%2C107%20C36.8427735%2C107%2036.1972657%2C107.267578%2035.7324218%2C107.732422%20C35.2675782%2C108.197266%2035%2C108.842774%2035%2C109.5%20C35%2C110.160156%2035.2675782%2C110.802734%2035.7324218%2C111.267578%20C36.1972657%2C111.732422%2036.8427735%2C112%2037.5%2C112%20C38.1572265%2C112%2038.8027343%2C111.732422%2039.2675782%2C111.267578%20C39.7324218%2C110.802734%2040%2C110.157226%2040%2C109.5%20C40%2C108.842774%2039.7324218%2C108.197266%2039.2675782%2C107.732422%20C38.8027343%2C107.267578%2038.1572265%2C107%2037.5%2C107%20Z%22%20id%3D%22Path%22%3E%3C%2Fpath%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E');
+        background-image: url('data:image/svg+xml;base64,PHN2ZyAgZmlsbD0iI0MxMzdBMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNTEyIDUxMiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZD0iTTQxNC42ODIgMjE4LjI3NGE4LjA4MyA4LjA4MyAwIDAgMC04LjA4NC04LjA4NEgyMTIuNzI3YTguMDg0IDguMDg0IDAgMCAwIDAgMTYuMTY4aDE5My44NzFhOC4wODQgOC4wODQgMCAwIDAgOC4wODQtOC4wODR6TTI0NS4wMzggMjg1LjY0MmE4LjA4NCA4LjA4NCAwIDAgMCAwIDE2LjE2OGgxLjA3OGE4LjA4NCA4LjA4NCAwIDAgMCAwLTE2LjE2OGgtMS4wNzh6Ii8+PHBhdGggZD0iTTQ1Ny43NjQgMTM0Ljc4M1Y1MS4yYzAtMjguMjMxLTIyLjk2OS01MS4yLTUxLjItNTEuMkgxMDUuMDUzYy0yOC4yMzEgMC01MS4yIDIyLjk2OS01MS4yIDUxLjJ2MjEyLjk0OEMyMy45MTcgMjY1LjU2MSAwIDI5MC4zNzUgMCAzMjAuNjc0YzAgMzEuMjA0IDI1LjM2OSA1Ni41ODkgNTYuNTUyIDU2LjU4OWgxNDcuNzA3djI4LjAwM2MwIDMuNjA5IDEuNjk0IDcuMDE3IDQuNjUgOS4zNTJhLjAwMy4wMDMgMCAwIDAgLjAwMi4wMDFjNS4wMjYgMy45NyAxMi42MDggMy45NyAxNy42MzcgMGw0MS44ODctMzMuMDgxYzMuOTU4LTMuMTI2IDYuMjI4LTcuNjMxIDYuMjI4LTEyLjM1OXMtMi4yNjktOS4yMzMtNi4yMjgtMTIuMzU5bC00MS44ODctMzMuMDgxYy01LjAyOS0zLjk3Mi0xMi42MS0zLjk3MS0xNy42MzctLjAwMS0yLjk1NyAyLjMzNS00LjY1MiA1Ljc0My00LjY1MiA5LjM1M3YyOC4wMDRINzAuMDIxVjUxLjJjMC0xOS4zMTYgMTUuNzE2LTM1LjAzMiAzNS4wMzItMzUuMDMyaDMwMS41MTJjMTkuMzE3IDAgMzUuMDMyIDE1LjcxNiAzNS4wMzIgMzUuMDMydjgzLjUzN2gtMTM0LjYydi0yOC4wMDNjMC0zLjYxLTEuNjk1LTcuMDE4LTQuNjUyLTkuMzUzLTUuMDI3LTMuOTcxLTEyLjYwOC0zLjk2OS0xNy42MzUgMGwtNDEuODg3IDMzLjA4MWMtMy45NTkgMy4xMjYtNi4yMjkgNy42MzEtNi4yMjkgMTIuMzU5czIuMjcgOS4yMzMgNi4yMjggMTIuMzU5bDQxLjg4OCAzMy4wODFjNS4wMjggMy45NzEgMTIuNjA5IDMuOTcgMTcuNjMzLjAwMiAyLjk1OC0yLjMzNCA0LjY1NC01Ljc0MyA0LjY1NC05LjM1NHYtMjguMDA0aDE0OC40NzFjMjIuMjY3IDAgNDAuMzgzIDE4LjEzMiA0MC4zODMgNDAuNDIxIDAgMjEuNTEtMTYuODczIDM5LjE1LTM4LjA2OCA0MC4zNTVWMTc4LjkzYTguMDgzIDguMDgzIDAgMCAwLTguMDg0LTguMDg0IDguMDg0IDguMDg0IDAgMCAwLTguMDg0IDguMDg0VjQ2MC44YzAgMTkuMzE2LTE1LjcxNSAzNS4wMzItMzUuMDMyIDM1LjAzMmgtMzAxLjUxYy0xOS4zMTYgMC0zNS4wMzItMTUuNzE2LTM1LjAzMi0zNS4wMzJ2LTU0LjQzNGE4LjA4NCA4LjA4NCAwIDAgMC0xNi4xNjggMFY0NjAuOGMwIDI4LjIzMSAyMi45NjkgNTEuMiA1MS4yIDUxLjJoMzAxLjUxMmMyOC4yMzEgMCA1MS4yLTIyLjk2OSA1MS4yLTUxLjJWMjQ3Ljg2OUM0ODcuODc2IDI0Ni42NDggNTEyIDIyMS43NTMgNTEyIDE5MS4zMjZjMC0zMC40MjYtMjQuMTI0LTU1LjMyMi01NC4yMzYtNTYuNTQzek01My44NTMgMzYxLjAwNWMtMjEuMDE1LTEuMzk0LTM3LjY4NC0xOC45NS0zNy42ODQtNDAuMzMyIDAtMjEuMzgxIDE2LjY3LTM4LjkzOCAzNy42ODQtNDAuMzMydjgwLjY2NHptMTY2LjU3NC0yMS40OTYgMzcuNTY5IDI5LjY3LTM3LjU2OSAyOS42NzF2LTU5LjM0MXptNzAuMzgtMTY3LjAxOC0zNy41NjktMjkuNjcgMzcuNTY5LTI5LjY3MXY1OS4zNDF6Ii8+PHBhdGggZD0iTTQwNi41OTggMzYxLjA5NWgtOTYuOTM2YTguMDg0IDguMDg0IDAgMCAwLTguMDg0IDguMDg0IDguMDgzIDguMDgzIDAgMCAwIDguMDg0IDguMDg0aDk2LjkzNmE4LjA4NCA4LjA4NCAwIDAgMCA4LjA4NC04LjA4NCA4LjA4NCA4LjA4NCAwIDAgMC04LjA4NC04LjA4NHpNMTA1LjAyIDMwMS44MTFoMTA3LjcwNmE4LjA4NCA4LjA4NCAwIDAgMCAwLTE2LjE2OEgxMDUuMDJhOC4wODQgOC4wODQgMCAwIDAgMCAxNi4xNjh6TTQwNi41OTggMjg1LjY0MmgtOTYuOTM2Yy00LjQ2NiAwLTguMDg0IDMuNjItOC4wODQgOC4wODRzMy42MTggOC4wODQgOC4wODQgOC4wODRoOTYuOTM2YTguMDg0IDguMDg0IDAgMCAwIDAtMTYuMTY4ek0yMTAuMDQgMTQyLjgyMWE4LjA4NCA4LjA4NCAwIDAgMC04LjA4NC04LjA4NEgxMDUuMDJhOC4wODQgOC4wODQgMCAwIDAgMCAxNi4xNjhoOTYuOTM1YTguMDg0IDguMDg0IDAgMCAwIDguMDg1LTguMDg0ek0yNzYuMjczIDMwMS44MTFoMS4wNzdjNC40NjYgMCA4LjA4NC0zLjYyIDguMDg0LTguMDg0cy0zLjYxOC04LjA4NC04LjA4NC04LjA4NGgtMS4wNzdjLTQuNDY2IDAtOC4wODQgMy42Mi04LjA4NCA4LjA4NHMzLjYxOCA4LjA4NCA4LjA4NCA4LjA4NHpNMTc5LjMzNyAyMTAuMTg5YTguMDg0IDguMDg0IDAgMCAwIDAgMTYuMTY4aDEuMDc3YTguMDg0IDguMDg0IDAgMCAwIDAtMTYuMTY4aC0xLjA3N3pNMTA1LjAyIDIyNi4zNThoNDMuMDgyYTguMDg0IDguMDg0IDAgMCAwIDAtMTYuMTY4SDEwNS4wMmE4LjA4NCA4LjA4NCAwIDAgMCAwIDE2LjE2OHoiLz48L3N2Zz4=');
         background-repeat: no-repeat;
         background-size: contain;
       }
-
+      > * {
+        position: relative;
+        z-index: 10;
+      }
       .creator {
-        color: fds.get-color-from-palette($primary, default);
+        background-image: linear-gradient(
+        to right,
+        fds.get-color-from-palette($primary, default),
+        fds.get-color-from-palette($accent, default)
+    );
+      -webkit-text-fill-color: transparent;
+      -webkit-background-clip: text;
+      -webkit-box-decoration-break: clone;
+      background-clip: text;
+      box-decoration-break: clone;
       }
 
       span {
-        color: fds.get-color-from-palette($foreground, text);
+        color: white;
       }
     }
 
+    .title:before{
+      content: "";
+      position: absolute;
+      left: 0;
+      right: 0;
+      top: 0;
+      height: 250px;
+      background-image: linear-gradient(
+        90deg, darken(fds.get-color-from-palette($primary, 800), 20% ), darken(fds.get-color-from-palette($primary, 800), 10% ) 40%, darken(fds.get-color-from-palette($accent,  800),15%) 80%);
+    }
+
+    .title:after {
+        content: "";
+        background-image: url(data:image/webp;base64,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);
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        left: 20%;
+        background-repeat: no-repeat;
+        transform: scaleY(-1);
+        background-position-x: 55%;
+        background-position-y: 30%;
+    }
+
     .changelog-container {
       .release-detail,
       .last-release,
@@ -83,6 +121,8 @@
       }
     }
   }
+
+
 }
 
 @mixin typography($config) {
@@ -97,6 +137,17 @@
       }
     }
 
+    .date {
+      @include mat.typography-level($config, h6);
+      white-space: nowrap;
+      margin: 0;
+    }
+  
+    .version-id {
+      @include mat.typography-level($config, h5);
+      margin-bottom: 0;
+    }
+
     @include flex-layout.layout-bp(xs) {
       .title {
         .creator {
diff --git a/libs/angular-components/changelog/src/changelog.component.html b/libs/angular-components/changelog/src/changelog.component.html
index 1e4a555d2..0a6cddd39 100644
--- a/libs/angular-components/changelog/src/changelog.component.html
+++ b/libs/angular-components/changelog/src/changelog.component.html
@@ -2,7 +2,7 @@
   <div class="changelog-icon"></div>
   <div fxLayout="column">
     <div class="creator">{{ title }}</div>
-    <span>Changelog</span>
+    <span>{{ subtitle }}</span>
   </div>
 </div>
 
@@ -12,19 +12,17 @@
     [fxLayout]="displayVersion === 'top' ? 'column' : 'row'"
     fxLayout.lt-md="column"
     [fxLayout.gt-md]="displayVersion === 'top' ? 'column' : 'row'"
-    fxLayoutAlign="space-between start"
+    fxLayoutAlign="center"
     [class.layout-column]="displayVersion === 'top'"
     [class.layout-none]="displayVersion === 'none'"
   >
-    <div *ngIf="displayVersion !== 'none'" class="version" fxFlex="5" fxFlex.md="10">
-      <div class="version-id uxg-h4">v{{ release.version }}</div>
-      <span class="date uxg-h6">{{ release.date | date: 'longDate' }}</span>
+    <div class="version" fxFlex="10" fxFlex.md="10">
+      <div *ngIf="displayVersion !== 'none'" class="version-id">v{{ release.version }}</div>
+      <span [ngClass]="{ 'version-id': displayVersion == 'none', date: displayVersion !== 'none' }">{{
+        release.date | date: 'longDate'
+      }}</span>
     </div>
-    <div
-      [ngClass]="{ 'first-release': first, 'last-release': last, 'release-detail': !first && !last }"
-      fxFlex="95"
-      fxFlex.md="90"
-    >
+    <div [ngClass]="{ 'first-release': first, 'last-release': last, 'release-detail': !first && !last }" fxFlex="90" fxFlex.md="90">
       <ng-container *ngFor="let category of release.categories">
         <div class="uxg-subtitle-2 category">{{ category }}</div>
         <div *ngFor="let change of release.changes" class="change">
diff --git a/libs/angular-components/changelog/src/changelog.component.scss b/libs/angular-components/changelog/src/changelog.component.scss
index cadc29677..c559941c3 100644
--- a/libs/angular-components/changelog/src/changelog.component.scss
+++ b/libs/angular-components/changelog/src/changelog.component.scss
@@ -113,19 +113,11 @@ uxg-changelog {
   }
 
   .changelog-container {
-    margin: fds.$uxg-spacing-3 fds.$uxg-spacing-4;
+    margin: fds.$uxg-spacing-5;
 
     .version {
       min-width: 100px;
-
-      .version-id {
-        margin-bottom: 0;
-      }
-
-      .date {
-        white-space: nowrap;
-        margin: 0;
-      }
+      text-align: right;
 
       &.none {
         width: 0;
@@ -214,7 +206,7 @@ uxg-changelog {
 
   @include flex-layout.layout-bp(sm) {
     .changelog-container {
-      margin: 0 fds.$uxg-spacing-4;
+      margin: fds.$uxg-spacing-4;
       @include changelog-layout('sm');
       .layout-none {
         @include changelog-layout('none');
@@ -224,7 +216,7 @@ uxg-changelog {
 
   @include flex-layout.layout-bp(xs) {
     .changelog-container {
-      margin: 0 fds.$uxg-spacing-2;
+      margin: fds.$uxg-spacing-4 fds.$uxg-spacing-2;
       @include changelog-layout('xs');
       .layout-none {
         @include changelog-layout('none');
diff --git a/libs/angular-components/changelog/src/changelog.component.ts b/libs/angular-components/changelog/src/changelog.component.ts
index 43a4101b7..63f5707ba 100644
--- a/libs/angular-components/changelog/src/changelog.component.ts
+++ b/libs/angular-components/changelog/src/changelog.component.ts
@@ -10,5 +10,6 @@ import { ChangeLog } from './changelog.models';
 export class UXGChangelogComponent {
   @Input() changelog!: ChangeLog;
   @Input() title!: string;
+  @Input() subtitle: string = 'Changelog';
   @Input() displayVersion: 'left' | 'top' | 'none' = 'left';
 }