From 62a8e2f821ff0e071d005601b2ad9312250757c4 Mon Sep 17 00:00:00 2001 From: Olivia Tournois Date: Mon, 11 Feb 2019 15:45:21 +0100 Subject: [PATCH] style(stark-demo): improvement of showcase homepage and news page --- .../news-item/_news-item-theme.scss | 14 ++ .../news-item/_news-item.component.scss | 37 +++- .../news-item/news-item.component.html | 8 +- .../welcome/pages/home/_home-page-theme.scss | 25 +++ .../pages/home/_home-page.component.scss | 159 ++++++++++-------- .../pages/home/home-page.component.html | 125 +++++++++----- .../pages/news/_news-page.component.scss | 118 ++++++++++--- .../pages/news/news-page.component.html | 90 +++++++--- .../welcome/pages/news/news-page.component.ts | 5 +- .../src/assets/images/news/10.0.0-beta1.PNG | Bin 0 -> 4895 bytes .../src/assets/images/news/10.0.0-beta2.PNG | Bin 0 -> 6171 bytes .../src/assets/images/news/10.0.0-beta3.PNG | Bin 0 -> 7688 bytes .../showcase-screenshot.png | Bin showcase/src/assets/translations/en.json | 30 ++-- showcase/src/assets/translations/fr.json | 30 ++-- showcase/src/assets/translations/nl.json | 30 ++-- showcase/src/styles/_theme.scss | 2 + showcase/src/styles/styles.scss | 2 +- 18 files changed, 481 insertions(+), 194 deletions(-) create mode 100644 showcase/src/app/welcome/components/news-item/_news-item-theme.scss create mode 100644 showcase/src/app/welcome/pages/home/_home-page-theme.scss create mode 100644 showcase/src/assets/images/news/10.0.0-beta1.PNG create mode 100644 showcase/src/assets/images/news/10.0.0-beta2.PNG create mode 100644 showcase/src/assets/images/news/10.0.0-beta3.PNG rename showcase/src/assets/images/{screenshots => news}/showcase-screenshot.png (100%) diff --git a/showcase/src/app/welcome/components/news-item/_news-item-theme.scss b/showcase/src/app/welcome/components/news-item/_news-item-theme.scss new file mode 100644 index 0000000000..28a6258796 --- /dev/null +++ b/showcase/src/app/welcome/components/news-item/_news-item-theme.scss @@ -0,0 +1,14 @@ +news-item { + .news-image { + border: 1px solid mat-color($grey-palette, 700); + background-color: #fff; + } + + .news-item-content { + color: mat-color($grey-palette, 900); + } + + .information { + color: mat-color($grey-palette, 600); + } +} diff --git a/showcase/src/app/welcome/components/news-item/_news-item.component.scss b/showcase/src/app/welcome/components/news-item/_news-item.component.scss index aca43f5bdf..e0f2fdbb33 100644 --- a/showcase/src/app/welcome/components/news-item/_news-item.component.scss +++ b/showcase/src/app/welcome/components/news-item/_news-item.component.scss @@ -1,5 +1,38 @@ .section-border { padding-bottom: 26px; - border-bottom: 1px solid mat-color($grey-palette, 400); - margin-bottom: 20px; + position: relative; + min-height: 1px; + display: flex; + justify-content: flex-start; + flex-direction: column; + width: 290px; + padding-left: 12px; + padding-right: 12px; +} + +.news-image { + background-size: contain; + height: 150px; + width: 290px; + display: block !important; + background-position: 50% 50% !important; + background-repeat: no-repeat; +} + +.news-item-content { + letter-spacing: 0; + font-weight: 400; + font-style: normal; + font-size: 13px; + line-height: 1.4; +} + +.information { + font-size: 12px; + font-weight: 500; + line-height: 2px; +} + +.news-item-title { + font-size: 15px; } diff --git a/showcase/src/app/welcome/components/news-item/news-item.component.html b/showcase/src/app/welcome/components/news-item/news-item.component.html index e73419ddfa..3e75427543 100644 --- a/showcase/src/app/welcome/components/news-item/news-item.component.html +++ b/showcase/src/app/welcome/components/news-item/news-item.component.html @@ -1,8 +1,8 @@
-
+ +
- +
Release: {{ release }} ({{ newsDate }})
+
-
Release: {{ release }} ({{ newsDate }})
-
diff --git a/showcase/src/app/welcome/pages/home/_home-page-theme.scss b/showcase/src/app/welcome/pages/home/_home-page-theme.scss new file mode 100644 index 0000000000..51104eb8b4 --- /dev/null +++ b/showcase/src/app/welcome/pages/home/_home-page-theme.scss @@ -0,0 +1,25 @@ +.mat-icon.core-image { + color: mat-color($accent-palette, 500); +} + +.mat-icon.about-image { + color: mat-color($primary-palette, 500); +} + +.mat-icon.ui-image { + color: mat-color($success-palette, 500); +} + +.mat-icon.showcase-image { + color: mat-color($warning-palette, 900); +} + +.custom-homepage-button { + color: #fff; + background-color: #0063bb; + box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26); +} + +.section-division { + border-bottom: 1px solid #bdbdbd; +} diff --git a/showcase/src/app/welcome/pages/home/_home-page.component.scss b/showcase/src/app/welcome/pages/home/_home-page.component.scss index 838771cb1d..bcbf5ec704 100644 --- a/showcase/src/app/welcome/pages/home/_home-page.component.scss +++ b/showcase/src/app/welcome/pages/home/_home-page.component.scss @@ -1,94 +1,121 @@ -//set the header image -.about-background { +.centered-title { + text-align: center; + font-size: 17px; + line-height: 30px; + font-weight: 500; +} + +.homepage-item { display: flex; + flex-direction: column; + justify-content: center; align-items: center; - - margin-bottom: 20px; - height: 100px; + box-sizing: border-box; + margin: 16px auto; +} + +.doc-subtitle { + margin-left: 25px; +} - background-color: mat-color($primary-palette, 900); - background-image: url(/assets/stark-core/logo/light/stark_logo_light.svg); +.stark-logo{ + background-image: url(/assets/stark-core/logo/dark/stark_logo_dark.svg); + width: 250px; + height: 100px; + background-size: contain; background-repeat: no-repeat; - background-size: 250px 100px; - background-position: center; + display: flex; + margin: auto; } -.light-font { - font-weight: normal; +.mat-icon.homepage-icons{ + height: 80px; + width: 80px; + min-width: 80px; + max-width: 80px; } -.bottom-margin { - margin-bottom: 20px; +.page-content { + margin: 0; + overflow: hidden; } -//icon with a link to github -.github-link .github-icon { - height: 60px; - width: 60px; - position: relative; - float: right; +.doc-description { + display: flex; + margin-left: 25px; + margin-right: 25px; + max-width: 750px; + align-items: stretch; - svg { - fill: #000; + p { + display: flex; } } -.information-title { - font-size: 21px; - color: mat-color($grey-palette, 900); - padding-bottom: 0; - display: inline-flex; - vertical-align: middle; - margin: 10px 0 10px 0; -} -@media #{$desktop-query} { - .about-title { - font-size: 55px; - margin-left: 25px; - } +.buttons-row{ + display: flex; + justify-content: center; + align-items: center; + padding-bottom: 25px; - .information-title { - font-size: 30px; + .button.custom-homepage-button { + align-items: center; + justify-content: center; + width: 200px; + text-decoration: none; + height: 40px; + font-weight: 600; + line-height: 40px; + border-radius: 48px; + box-sizing: border-box; + cursor: pointer; + display: flex; + padding: 0 24px; + text-align: center; + margin: auto 6px auto 6px; + font-size: 12px; } + +} - .about-background { - height: 150px; - background-size: 250px 75px; - } +.section-division { + padding-bottom: 20px; + padding-top: 20px; +} + +.last-section-division{ + padding-top: 20px; } -@media #{$tablet-only-query} { - .list { - font-size: 17px; +@media #{$tablet-query}{ + + .buttons-row{ + .button.custom-homepage-button { + margin: auto 30px auto 30px; + font-size: 15px; + } + } + + .mat-icon.homepage-icons{ + margin-left: 25px; + height: 120px; + width: 120px; + min-width: 120px; + max-width: 120px; } - .about-background { - height: 100px; - background-size: 250px 75px; + .homepage-item { + flex-direction: row; } -} -@media #{$tablet-query} { - .stark-app-bar-content-center { - align-self: center; - margin-bottom: 15px; + .centered-title { + font-size: 30px; + line-height: 50px; } -} -@media #{$mobile-only-query} { - .stark-app-bar-page-title { - position: absolute; - top: 60px; - left: 0; - - width: 100px; - height: 30px; - max-width: 100%; - - background-image: url(/assets/stark-core/logo/light/stark_logo_light.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; + .stark-logo{ + width: 450px; + height: 130px; } } diff --git a/showcase/src/app/welcome/pages/home/home-page.component.html b/showcase/src/app/welcome/pages/home/home-page.component.html index 19a909667f..a8c593af58 100644 --- a/showcase/src/app/welcome/pages/home/home-page.component.html +++ b/showcase/src/app/welcome/pages/home/home-page.component.html @@ -1,40 +1,89 @@ - -

-

-

- - - -

+ -
- - - - - -

-
-
-
-
-
- - - - - - -

+
+
+
+ +

+
+
+
+
+
-

Stark Core

-
-
-

Stark UI

-
-
-

Showcase

-
- - -
+ + + + +
+
+

{{ "SHOWCASE.HOMEPAGE.SHOWCASE" | translate }}

+
+
+
+ +
+ +
+
diff --git a/showcase/src/app/welcome/pages/news/_news-page.component.scss b/showcase/src/app/welcome/pages/news/_news-page.component.scss index af6f884d09..694128473f 100644 --- a/showcase/src/app/welcome/pages/news/_news-page.component.scss +++ b/showcase/src/app/welcome/pages/news/_news-page.component.scss @@ -1,31 +1,111 @@ -.first-news-image { - background: url("/assets/images/screenshots/showcase-screenshot.png") no-repeat center center; - width: 250px; - height: 60px; - display: inline-block; - background-size: contain; +.fourth-news-image { + background: url("/assets/images/news/10.0.0-beta3.PNG"); +} + +.third-news-image { + background: url("/assets/images/news/10.0.0-beta2.PNG"); } .second-news-image { - height: 60px; - width: 200px; + background: url("/assets/images/news/10.0.0-beta1.PNG"); +} +.first-news-image { background-image: url(/assets/stark-core/logo/dark/stark_logo_dark.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; } -@media #{$desktop-query} { - .first-news-image { - width: 750px; - height: 200px; +.news-container { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: flex-start; + align-items: baseline; +} + +.custom-homepage-button { + align-items: center; + justify-content: center; + width: 150px; + text-decoration: none; + height: 30px; + font-size: 13px; + font-weight: 600; + line-height: 30px; + color: #fff; + background-color: #0063bb; + border-radius: 48px; + box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26); + box-sizing: border-box; + cursor: pointer; + display: block; + margin: 15px auto auto auto; + padding: 0 24px; + text-align: center; +} + +.top-news news-item { + .section-border { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + box-sizing: border-box; + margin: 16px auto; + width: 100%; + } + .news-item-container { + display: flex; + align-items: center; + width: 100%; + flex-direction: column; + } + .news-item-title { + width: 100%; + font-size: 25px; + } + .news-item-content { + width: 100%; + font-size: 15px; + } + .information { + width: 100%; + font-size: 13px; + } + .news-image { + min-width: 350px; + height: 200px; + margin-right: 25px; } } -@media #{$tablet-only-query} { - .first-news-image { - width: 500px; - height: 100px; +@media #{$handset-toc-query-screen}{ + .news-container { + justify-content: center; + align-items: center; + flex-direction: column; + display: flex; + } + + .top-news news-item { + .section-border { + flex-direction: column; + width: 290px; + padding: 0 0 0 0; + } + .news-item-title { + font-size: 15px; + } + .news-item-content { + font-size: 13px; + } + .information { + font-size: 12px; + } + .news-image { + min-width: 290px; + height: 150px; + margin: 0 0 0 0; + } } + } diff --git a/showcase/src/app/welcome/pages/news/news-page.component.html b/showcase/src/app/welcome/pages/news/news-page.component.html index 7b4ff635ff..aa75f42fc8 100644 --- a/showcase/src/app/welcome/pages/news/news-page.component.html +++ b/showcase/src/app/welcome/pages/news/news-page.component.html @@ -1,23 +1,71 @@ -
Stark news
-
Discover here the latest news about the Stark framework!
+
What's new in Stark?
- -
-

A very happy occasion

-
-

Stark Logo was born this week!

-

- Let's all make a round of applause for our java consultant, Maxime, who had the good idea to mix Angular's pretty logo with the - name of our project! -

-
-
+
+ +
+
+

10.0.0-beta.3 Released!

+ +
+

In this release has been implemented, among others, a very efficient generic search component. + New documentation has also been added and some bugs have been fixed. +

+ + Release Notes + +
+
+
+ +
+ +
+

10.0.0-beta.2 Released!

+
+

Big changes for Stark: it has been upgraded to Angular 7! New features such as a preloading + screen, + a session timeout warning, new stylings applicable to Stark table component have been added. +

+ + Release Notes + +
+
+ + +
+

10.0.0-beta.1 Released!

+
+

+ The next release of Stark is available right now! + This release provides lots of packages update, new components such as Message Pane or Minimap, the implementation of a custom error handler, ... +

+ + Release Notes + +
+
+ + +
+

A very happy occasion

+
+

Stark Logo was born this week!

+

+ Let's all make a round of applause for our java colleague, Maxime, who had the good idea to mix + Angular's pretty logo with the name of our project! + Thanks also to Carlo, who rearranged it to make it more portable on other browsers such as IE! +

+
+
+ +
- -
-

Stark News page is finally here!

-
-

The news page is there, get happy!

-

Don't mind me, I'm just an example with a bigger image, just so you know how I look like.

-
-
diff --git a/showcase/src/app/welcome/pages/news/news-page.component.ts b/showcase/src/app/welcome/pages/news/news-page.component.ts index 79a434afd3..8164d7d564 100644 --- a/showcase/src/app/welcome/pages/news/news-page.component.ts +++ b/showcase/src/app/welcome/pages/news/news-page.component.ts @@ -1,4 +1,4 @@ -import { Component, Inject, OnInit } from "@angular/core"; +import {Component, HostBinding, Inject, OnInit} from "@angular/core"; import { STARK_LOGGING_SERVICE, StarkLoggingService } from "@nationalbankbelgium/stark-core"; @Component({ @@ -6,6 +6,9 @@ import { STARK_LOGGING_SERVICE, StarkLoggingService } from "@nationalbankbelgium templateUrl: "./news-page.component.html" }) export class NewsPageComponent implements OnInit { + @HostBinding("class") + public class: string = "news-page"; + public constructor(@Inject(STARK_LOGGING_SERVICE) public loggingService: StarkLoggingService) {} public ngOnInit(): void { diff --git a/showcase/src/assets/images/news/10.0.0-beta1.PNG b/showcase/src/assets/images/news/10.0.0-beta1.PNG new file mode 100644 index 0000000000000000000000000000000000000000..6966ef2cd7592544ba8acddd62f3ce7e93ea65ba GIT binary patch literal 4895 zcmcIoXH-*Lw+$F1fP$e*C-l&(5PCvr(yR0q2)zdgR}lp1O+Y}UNE5sw2+})JLho0q z^nOLUA;^^%zWc@-@6Y@Be(bZ)K6{Kg=2~m-wdOhrMh04UDOo510Ki=xZ4DCufFz3e z{t$GV_{_FbgcB!{AQLS(plXb5kGKG$)%Dc@fSNR_DTq`t+F;_V zZJlIvV9Sk<2*CLV&yfw6;0xN^{al{l4Vg6K3K~UVm>))G@N11LUvt;Ayih6Cx znT99}BY~Rzp<1|a^33SSev@~g)hoY3RTf32&o35|JGZ1CH$X)=7C4?@4X&4^ywIS< z%Eh>n$%K9RDcELrY+~e;kcIEueRf&&TbFZ@3eb0twjH{MxDtdLURE}{R>LtY*z&CY zgN2;(Fs>u?A4ic#-*}asGnQ-ejlYV2%*)mNs7R!BU<5WAiZ$44W6~<2$!lpUITy(V zO}tSITK=>P8oC$7@OP+2;qSj{v(bbFCb5IGuigs^FFnz(=4u2k2`jUShg&XYugO>D zq=+BiBRFht;86Z3bnth~hd$%rEhIqTs1f}@>sS7ArM(B0DCq~eA9a)fNQ_Ho?WFrP zVdzotB2~$xPGezelSc${}9{%5wZTuk-V^7reLM%v}{tIlWF;vo6@Wk zRegFV;a2{E{wz05RR!qc#mFRhR^@;bVcKb~x2xoE*>(9&L2nu=Oezmxc|dI+eq8sQ zo}^&-aWvr$8eJ7NOWk@~6zLr3(<)CtJJg6=jo9t5MoljN7<{R!g zJ>&55A^XW{bYdi{iNbqOTVKCsJNmbXXvRS$EkrHt$6%RFiQjdAd0R0ee6shavQNNS zRp#q!{wz?NLWA(-5_0&>R6j_k38eN#xjH$4kgMR=bT$dtE5zXZhd)#Jfwu$u7-@fv zJRdH>P#ZLXFay!zP*UFtP~9`X7W`i|VOzGXeRP~EpX;NoDZr~_Vc^rPDNUNxixtx+ zHa2jvB8}Bc0nOJ_eJaPpuE!ZrPH*nAw1R1-yWVq>=ayTaK1nV}XhGt)?Zi_I{&}w0 zU_8lw`p@)95jFM*iR`+|5M^=nItib?!giu;UP(AFHhgZ=HH}lcD2A-YCaMV^XsjmX{KTE2 zjt*xV>#m-bAtQBC{$^A-F7@-%9VOMpWm+?J!;O1 zu%EQAmVr5IH=~;J2q~~lZkm5R;Y>#of!kGR_rNT~12VtpQA_K1n`DDNwMpdj|J-;p ztD#86`>=XN@05plzb|KV=x8ZLQIREC>+vEfqS5~gClL^2k8hXbA9Jy=26mjsnNOzq zTGLfm4Z?hj?tmqbf;Ghk@Ni4##cMk$m2)Pi7c2vKKV}hLR735We5_Ojg5%`vzjj`9 zj9%X$evw5XF(br@=7iYXm!h|r@}&>JdB40ca0N5&8mn*G!rVz^=ke%d zK=<8Q5a`1_dm+l<@u@xM7Ts0HbelCOTMnk} zUEtlwE9ny>R4Yd)d$EAE55fdqq|b+bq{9>Hqzl_HbPOa^CbvXbo@rkkAbu#fLA1AM zJ%2~_%#Mr-C?%m|OR2E~4;8_V5#N&+V{Kri{mcR%Y|jjQ;!{3 z-ivM4haB8p>7JxhdB$&5d*}1_NlP%%Ac;J^@;J#6s;HS;qL&@CQ#q{8GPlmM_hjGf zosOgvGa`17mL$75!t{~HwpWa-y-mKung5c&RT&2L1~*{%^_V@Mp5*=aQx?eV9*^^5 zBk(=0Q+hZ|S!5!gHqx$g`NUv7{A zHwA=tSPR$&MbJOV|M9arzUOwo0tA}NLsW1SpLJY~93tRIebrl3vQBPvx-5p;`{{9Q za~hE;L3{V^u?le7C>1n6qh9;O-kMtT=9>Vjdu72Oh>vkBQN?CF2md&1E$nefHo@wo zFV&Y~ETW}z@-`jr4f7ZDyB@5`_DWfb>Frv0>t1d72y>ZI>tnA)sdWjRg8Yb_-p9jD zrbHq~3Mz#L;xi~-ZQ(TdyFw#3?coMb0kcaA%mBik7d(gVFMg*?7vsFpH$~?^WLqP| z&OI`aB~d2qEia|@Id}Zm+>f2rO0lu;fkU$v6JIC$VhQTU!woD#iyps&ZNa<4>pNG^Blyq(3J zfWp&q;La#gwL>_yX;|GF+mq^RIdqTYhpLj z1Z=YiWCiJ(7mo=$iS+-(g43fb?;}_oq>lwafLUk{QG=hwzY-5-1rfkR=MSwhRe#E< zS3S|R)Cs{AVy*tK_&Jkst7L8 z$N|`h5eyHV`BP4)y6X7!&qTHP2wr+9DXB>~_k$peDG**|@ZTJXuIKKdXb5+=fkH)n zs4-tNvMepNW_-Y_?DO7QzuKE5q3e+fLrCkWGKj=r9X(0JHl913#leC`ghq~BH=5%4 zrW%5y&$drV8^e><42l5bcAxnXbQQl1%gnZg=mO^~zwk?kI9(sT>)xF>&BhkyltLtQ z#*-q0-Sh{}ioD5(B=Xn7t@aQMrxU{vE`=niQQ2w}h3CW@J)Pl~z4@AM9jk|Q%os`n z(7EWPmrYYOmsp0cOrXhYE~8Bir^mbC2eI`E>FGtUq1#0{NVV76V$-&#*0G=o^;Kr~ z)J=(LF=r@grkOqPg00Z7Jg!;BmI+qxsYZ#3+2@`Y!%>)PQkV}T#FHY=R9vkaH6lN! zfCwn|7Bq`i09#1+$wl+y?BPE+tUr})RRl6b=|IIv8~VYXnI`3wcAji(J*(jj4;eFz zPS}s^Vs27hQWie_yw_qJTLnB{xw2v7B=69Pt7E7SiEHDFp(oJ<$OqW$#;rWPYU{WN zo_X31V>ARU8r0oA$QdHWzKcyi2^qCi{+hQr7 zLK4(Ff^xo~6c!~3UCp>ZrXNTw+6F}BR=U^;&v!8-lbxo<(!-wx2U%1!lfPe&*)J+5 zO1%@429S1;!&z{%wK*JG4VAAqf;cWBM_(|qr5q5Ie!d4csR@mYMzz)ggfkrL{;ZBt z=);R&TnVUwt)l-Vg&{@~k3sa;`&K538|a7?eRx7-9nG^Ax7L-n>?Y)z#5mnRJO|al zwRLltHx>Y_zIsD2aR=R;{x8i^MK>HE3XMiZ5=Z(Dw5XBu+n*%)q%Q>v(|n&O0Ur$;q$3L;~;lDavy$w=I1+UkYQb zEFm6+mqMr;Fy8VQf^CyC0%}@mS6$%$itx%e2`vatr>+^!q@L5TxUq_d)C9pD`x-A2 zDx^H-CLV+#d-mMFtT16T??K)NJb#&Gsh;gky>O(9f-nsMTs7xk?X}1UElz^lylyx> z?$_J7$jj;aA2>PLaZ|O1#XLA$&mwhr>UNNj_|PcRp6@)QgvXL7WF5RAUAr&pzhe;+ z4IgOiH2&frAkS}?>5y(>)!xcNzhpYqbAx&FqfCovE>aF{TU+=|ZEXcy|mp2Ud^ ze9wN?K$dMW|C0e~*L$`zLA#j9eoy;CExzVUV|+VF z30><(n8>*62IXO0VDuk+jk310!`)gpy^`%bOz7f#rPY$LVPi$*sSM2j>t>9|PVJ|e zX>+{~>2U@be5A~nA+(3&ITFTyYoown_Attbo?A#LzeJof{5oAww+H9 z3MTQ1;p>XCZd7ZZO5e0hQx6?}-H~ey{yDY1pCj0_;mel12;0k-3LV&EzY%3!S5X!M zsmEmb^UQG5C_aC^GfH{O-m6N(>ICsyTCVTZ(^3oasfaS=wTGk3ZXe=gTNv7Kz$H2q zQyV}wDV;CRkY}7hWj=rqc%k7~ct7d&SiYwvd6W?^T?es0TGFH)md2?a&TW4W8>>%C z(-2!@)(rc6Xgyn3uxts;#ieIg)mG!srrhTbDKSo3wzXfZI|1cSh@BSxtKaV}`zWPf zz(3OQ#8*SZk_v6+CZLyehIpYzD zlYRw>ouy{6md}!3x;-X-$zOcmcFjs4$on}SD0oej)jfvVJ~*B5;03>}%+-?myV#1{ zZl61(tCDZb>8%XN%VO@#|4&s+6j}iD zY()oSKzYp{yDF7YY&(rz3%zo<^b43vd$8cc(aHO~Ok$`d`H2XWG_}broJkQC;&5i& z^Mb&|zVtHJFS;hh^Ko))pN6RGdSdWPC+Ch8^Tv}24{wNC^%G*JD0;o)g(c&Psx1jZ z!McjKZOYY8NUYp~0+U}SX8TMH4*#7~TJ~oGA^6hP79Vu~pQXxKvAZ&I;I{$mmGMP82U(jRllZf^T|KB| z3Aqp5hi@OQP3sH?2FBDp8q6v8zRz%PEUGO+$cxvgzW~Az#dh{_kyym+gemBX^x~x? zUz2wv7YC8@o1L8=VyCSpb`_*0^UI_7>GSC%_B1(QI@usV>NtKqvlugZ+jS_^slUrE z`S5U4^RRU{R(hzXKJ)9?AYT%*ZC?r+0^cK}#Qu{pMxn=(JF}jodbQ4=f2^N(7oS!z zv#Wn2(w4l0DN`y3_PJQ)r&=92lJJOCE?R-n&MUn>7Xm7N$TAp{o?@_FlxS2{saDdl zhMHQtzt4A`DSISeHZism(=zrP+WYNQp(MMMDjn^XV$p$!b*r-WFKt9qGBr8DK((-; zN6Mvl2;(7l7@N5%pA!7-%g@4Ql;5{v>e$lE578~^J{oGq^vGi^BylQ>GX@*cBln!l tfb>Y?aApP)q;VF9=Kr}>z?b-&#_$~NLmxOJL;R@)&_Nn#RKXpe{TH@~9jO2S literal 0 HcmV?d00001 diff --git a/showcase/src/assets/images/news/10.0.0-beta2.PNG b/showcase/src/assets/images/news/10.0.0-beta2.PNG new file mode 100644 index 0000000000000000000000000000000000000000..b6b827239eec708ee778d03d4ff811f77359ada2 GIT binary patch literal 6171 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 is an Angular 5+ based front-end framework built on top of Angular Stark features... An awesome reusable build using Webpack, built-in support for state of the art front-end tech.

Stark provides main building blocks for accelerating front-end development:

", - "DESCRIPTION_DETAIL": "
  • a solid reusable build based on Webpack
  • a starter project inspired by Angular Starter by AngularClass and Google's Web Starterk Kit
  • core modules providing useful APIs
  • UI modules providing interesting UI components
  • a showcase application containing:
    • our living style guide
    • a showcase of all components/services along with their API
    • our developer guide
", - "DESCRIPTION_DETAIL_LEGO_BLOCKS": "

Stark modules are like LEGO blocks: add what you need, no less, no more. If you don't like our defaults then you may replace/override/ignore anything you fancy.

", - "DESCRIPTION_AFTER_DETAIL": "

And even better, the Stark repository is available on the National Bank of Belgium page on Github!

Come and have a look at our amazing open sources projects!

", - "NEWS_TITLE": "Stark News", - "NEWS_DESCRIPTION": "Want to find the hottest news about the Stark framework?", - "NEWS_CONTENT": "Have a look at the news page right here!", - "DOCUMENTATION_MAIN_TITLE": "Stark Documentation", - "DOCUMENTATION_MAIN_DESC": "

Want some more info about Stark? Take a look at our links just below!

", - "DOCUMENTATION_CORE_DESC": "

Stark Core, aka stark-core, is a module providing reusable APIs, such as a routing, logging, log shipping, etc.

You can find the latest API documentation for stark-core here.

Or check the API for previous releases right here.

", - "DOCUMENTATION_UI_DESC": "

Stark UI provides reusable UI components, for example data table, message pane, ... but also themes.

The latest API doc for that module can be found here.

Or check the API for previous releases right here.

", - "DOCUMENTATION_SHOWCASE_DESC": "

The showcase application is the application you are actually browsing right now!

Enjoy roaming through our list of visual components (and their documentation) and have fun while discovering our design guidelines.

If you are interested in seeing the previous version of Stark showcase, have a look here.

", - "TITLE": "Home" + "CORE":"Stark Core", + "DESCRIPTION_DETAIL":"

Stark provides blocks perfectly fit for accelerating front-end development.
You'll find in Stark a reusable build based on Webpack, a starter project, core and ui modules providing awesome ui components, ...
All those modules act like LEGO blocks: you add what you need, no more, no less!

", + "DOCUMENTATION_CORE_DESC": "

Stark Core, aka stark-core, is a module providing reusable APIs, such as a routing, logging, log shipping, etc.

", + "DOCUMENTATION_MAIN_TITLE": "Documentation", + "DOCUMENTATION_SHOWCASE_DESC": "

The showcase application is the application you are actually browsing right now!
Enjoy roaming through our list of visual components (and their documentation) and have fun while discovering our design guidelines.

", + "DOCUMENTATION_UI_DESC": "

Stark UI provides reusable UI components, for example data table, message pane, ... but also themes.

", + "GETTING_STARTED":"Getting Started", + "INTRODUCTION": "A front-end framework based on Angular 7", + "LATEST_API":"Latest API", + "LATEST_NEWS":"Latest News", + "MAIN_TITLE": "What is Stark?", + "PREVIOUS_API":"Previous API", + "PREVIOUS_VERSIONS":"Previous versions", + "SHOWCASE":"Showcase", + "TITLE": "Home", + "UI":"Stark UI" }, "ICONS": { "GITHUB": "Github repo", diff --git a/showcase/src/assets/translations/fr.json b/showcase/src/assets/translations/fr.json index 4276fa8e52..fc8393511a 100644 --- a/showcase/src/assets/translations/fr.json +++ b/showcase/src/assets/translations/fr.json @@ -267,20 +267,22 @@ "TITLE": "Démarrer" }, "HOMEPAGE": { - "MAIN_TITLE": "À propos de Stark", - "DESCRIPTION_BEFORE_DETAIL": "

Stark est un framework front-end basé sur Angular 5 qui s'appuie sur les caractéristiques d'Angular Stark... Un outil génial qui utilise Webpack, une technologie front-end de pointe pour le support intégré.

Stark fournit les principaux outils pour accélérer le développement front-end:

", - "DESCRIPTION_DETAIL": "
  • un build fiable et réutilisable basé sur Webpack
  • un projet Starter inspiré d'Angular Starter d'AngularClass et du Web Starter Kit de Google
  • des modules core qui fournissent des APIs très utiles
  • des modules UI, qui fournissent des composants visuels intéressants
  • une application Showcase qui contient:
    • la démonstration en live de nos style guide
    • des exemples d'implémentation de nos composants
    • un guide du développeur
", - "DESCRIPTION_DETAIL_LEGO_BLOCKS": "

Les modules de Stark sont comme des LEGO: ajoutez ce dont vous avez besoin, ni plus, ni moins. Si vous n'aimez pas notre implémentation par défaut, vous pouvez remplacer/réimplémenter/ignorer ce qui ne vous plait pas comme bon vous semble.

", - "DESCRIPTION_AFTER_DETAIL": "

Et, encore mieux, le repository de Stark est disponible sur la page Github de la Banque Nationale de Belgique!

Allez donc jeter un oeil à nos projets open source!

", - "NEWS_TITLE": "Nouvelles", - "NEWS_DESCRIPTION": "Vous voulez tout savoir sur les dernières avancées de Stark?", - "NEWS_CONTENT": "Jetez un oeil à notre page de nouvelles ici!", - "DOCUMENTATION_MAIN_TITLE": "Documentation de Stark", - "DOCUMENTATION_MAIN_DESC": "Vous voulez plus d'infos sur Stark? Consultez nos liens de documentation ci-dessous!", - "DOCUMENTATION_CORE_DESC": "

Stark Core, aussi appelé stark-core, est un module fournissant des APIs réutilisables, comme par exemple une API de routing, de logging, de log shipping,etc...

Vous trouverez la documentation la plus récente en cliquant ici.

Ou allez jeter un oeil aux anciennes versions de l'API par ici.

", - "DOCUMENTATION_UI_DESC": "

Stark UI fournit des composants UI réutilisables: table de données, boite de dialogue, ... mais également des thèmes.

Pour consulter la dernière documentation de cette API, cliquez ici.

Ou allez jeter un oeil aux anciennes versions de l'API par ici.

", - "DOCUMENTATION_SHOWCASE_DESC": "

Le Showcase, vous vous y trouvez en ce moment même!

Amusez-vous à parcourir notre liste de composants visuels ainsi que leur documentation et à découvrir de vos propres yeux nos guidelines en matière de design.

Si vous le souhaitez, vous pouvez toujours consulter l'ancienne version de ce showcase en cliquant sur ce lien.

", - "TITLE": "Home" + "CORE":"Stark Core", + "DESCRIPTION_DETAIL":"

Stark fournit les principaux outils pour accélérer le développement front-end.
Vous y trouverez un build fiable et réutilisable basé sur Webpack, un projet Starter, des modules core et ui fournissant des composants ui incroyables, ...
Tous ces modules sont comme des LEGO: ajoutez ce dont vous avez besoin, ni plus, ni moins!

", + "DOCUMENTATION_CORE_DESC": "

Stark Core, aussi appelé stark-core, est un module fournissant des APIs réutilisables, comme par exemple une API de routing, de logging, de log shipping,etc...

", + "DOCUMENTATION_MAIN_TITLE": "Documentation", + "DOCUMENTATION_SHOWCASE_DESC": "

Le Showcase, vous vous y trouvez en ce moment même!
Amusez-vous à parcourir notre liste de composants visuels ainsi que leur documentation et à découvrir de vos propres yeux nos guidelines en matière de design.

", + "DOCUMENTATION_UI_DESC": "

Stark UI fournit des composants UI réutilisables: table de données, boite de dialogue, ... mais également des thèmes.

", + "GETTING_STARTED":"Démarrer", + "INTRODUCTION": "Un framework front-end basé sur Angular 7", + "LATEST_API":"Dernière API", + "LATEST_NEWS":"Dernières nouvelles", + "MAIN_TITLE": "Qu'est-ce que Stark?", + "PREVIOUS_API":"API précédentes", + "PREVIOUS_VERSIONS":"Versions précédentes", + "SHOWCASE":"Showcase", + "TITLE": "Home", + "UI":"Stark UI" }, "ICONS": { "GITHUB": "Repo Github", diff --git a/showcase/src/assets/translations/nl.json b/showcase/src/assets/translations/nl.json index 66d88d31b1..87e5c58156 100644 --- a/showcase/src/assets/translations/nl.json +++ b/showcase/src/assets/translations/nl.json @@ -267,20 +267,22 @@ "TITLE": "Begonnen" }, "HOMEPAGE": { - "MAIN_TITLE": "Over Stark", - "DESCRIPTION_BEFORE_DETAIL": "

Stark is een front-end framework gebaseerd op Angular 5 en bouwt voort op de kenmerken van Angular Stark... Een geweldig hulpmiddel dat gebruikt Webpack, een front-end spitstechnologie voor geintegreered ondersteuning.

Stark levert de belangrijkste instrumenten om de front-end ontwikkeling te versnellen:

", - "DESCRIPTION_DETAIL": "
  • een betrouwbare en herbruikbare build gebouwd op Webpack
  • een Starter projekt geïnspireerd door Angular Starter van AngularClass en door Web Starter Kit van Google
  • core modules dat praktijken APIs leveren
  • UI modules dat interessante visuele componenten verschaffen
  • een Showcase toepassing waarin liggen:
    • een live demonstratie van onze guidelinesdes e
    • voorbeelden van onze componenten implementatie
    • een ontwikkelaar gids
", - "DESCRIPTION_DETAIL_LEGO_BLOCKS": "

Stark modules zijn zoals LEGO: Voegt wat u nodig hebt, niet meer en niet minder. Als u onze standaard implementatie niet mag, kunt u wat stoort u vervangen/opnieuw implementeren/negeren.

", - "DESCRIPTION_AFTER_DETAIL": "

Nog beter, de Stark repository is beschikbaar op de Github pagina van de Nationale Bank van België!

Ga nou maar naar onze leuke opensource projekten kijken!

", - "NEWS_TITLE": "Stark Nieuws", - "NEWS_DESCRIPTION": "Wilt u iets over wat er nieuw is met Stark weten?", - "NEWS_CONTENT": "Ga nou maar naar onze nieuws pagina !", - "DOCUMENTATION_MAIN_TITLE": "Stark documentatie", - "DOCUMENTATION_MAIN_DESC": "Meer info over Stark zoeken? Raadpleeg onze documentatie weblinken hieronder!", - "DOCUMENTATION_CORE_DESC": "

Stark Core, ook bekend als stark-core, is een module dat herbruikbare APIs verstrekt, zoals routing, logging, log shipping,enzovoort.

U zult de meest recente documentatie door hier te klikken.

U kunt de oude versies van dat API hier vinden.

", - "DOCUMENTATION_UI_DESC": "

Stark UI levert UI herbruikbare componenten : gegevenstabel, dialoogvenster, ... maar ook themas.

Om de meeste recente versie van de documentatie over dat API raadpleggen, klik op dat link.

U kunt de oude versies van dat API hier vinden.

", - "DOCUMENTATION_SHOWCASE_DESC": "

De Showcase, u zich hier bevindt!

Veel plezier met de ontdekking van onze componenten lijst !

Als u wilt kunt u de oude versie van deze toepassing zien door op dat link te klikken.

", - "TITLE": "Home" + "CORE":"Stark Core", + "DESCRIPTION_DETAIL":"

Stark levert de belangrijkste instrumenten om de front-end ontwikkeling te versnellen.
U zult een betrouwbare en herbruikbare build gebouwd op Webpack vinden, een Starter project, core en ui modules dat interessante visuele componenten verschaffen, ...
Deze modules zijn zoals LEGO: Voegt wat u nodig hebt, niet meer en niet minder!

", + "DOCUMENTATION_CORE_DESC": "

Stark Core, ook bekend als stark-core, is een module dat herbruikbare APIs verstrekt, zoals routing, logging, log shipping,enzovoort.

", + "DOCUMENTATION_MAIN_TITLE": "Documentatie", + "DOCUMENTATION_SHOWCASE_DESC": "

De Showcase, u zich hier bevindt!
Veel plezier met de ontdekking van onze componenten lijst !

", + "DOCUMENTATION_UI_DESC": "

Stark UI levert UI herbruikbare componenten : gegevenstabel, dialoogvenster, ... maar ook themas.

", + "GETTING_STARTED":"Ermee beginnen", + "INTRODUCTION":"Een front-end framework gebaseerd op Angular 7", + "LATEST_API":"Laatste API", + "LATEST_NEWS":"Laatste nieuws", + "MAIN_TITLE": "Wat is Stark?", + "PREVIOUS_API":"Vorige API", + "PREVIOUS_VERSIONS":"Vorige versies", + "SHOWCASE":"Showcase", + "TITLE": "Home", + "UI":"Stark UI" }, "ICONS": { "GITHUB": "Github repo", diff --git a/showcase/src/styles/_theme.scss b/showcase/src/styles/_theme.scss index bfc286fd5a..afd05a059c 100644 --- a/showcase/src/styles/_theme.scss +++ b/showcase/src/styles/_theme.scss @@ -9,6 +9,8 @@ Import the local variables file first to set the correct variables, see: @import "../app/shared/components/example-viewer/example-viewer-theme"; @import "../app/shared/components/table-of-contents/table-of-contents-theme"; @import "../app/welcome/pages/getting-started/getting-started-page-theme"; +@import "../app/welcome/pages/home/home-page-theme"; +@import "../app/welcome/components/news-item/news-item-theme"; @import "../app/styleguide/pages/typography/styleguide-typography-page-theme"; @import "../app/demo-ui/pages/route-search/demo-route-search-page.component-theme.scss"; @import "../app/styleguide/pages/layout/styleguide-layout-page.theme.scss"; diff --git a/showcase/src/styles/styles.scss b/showcase/src/styles/styles.scss index def6767733..2f34d3415f 100644 --- a/showcase/src/styles/styles.scss +++ b/showcase/src/styles/styles.scss @@ -9,8 +9,8 @@ IMPORTANT: Stark styles are provided as SCSS styles so they should be imported i @import "../app/app.component"; @import "../app/shared/components/reference-block/reference-block.component"; @import "../app/shared/components/table-of-contents/table-of-contents.component"; -@import "../app/welcome/pages/home/home-page.component"; @import "../app/welcome/pages/getting-started/getting-started-page.component"; +@import "../app/welcome/pages/home/home-page.component"; @import "../app/welcome/pages/news/news-page.component"; @import "../app/welcome/components/news-item/news-item.component"; @import "../app/demo-ui/pages/message-pane/demo-message-pane-page.component";