feat(main-page): redesign using new components #24
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,38 +1,47 @@ | ||
| [ | ||
| { | ||
| "artId":"ghost", | ||
| "bgColor":"Bgc-$artGhost", | ||
| "showInMain": true | ||
| }, | ||
| { | ||
| "artId":"flushed-emoji", | ||
| "bgColor":"Bgc-$artFlushedEmoji", | ||
| "showInMain": true | ||
| }, | ||
| { | ||
| "artId":"penrose-triangle", | ||
| "bgColor":"Bgc-$artPenroseTriangle", | ||
| "showInMain": true | ||
| }, | ||
| { | ||
| "artId":"exploding-head", | ||
| "bgColor":"Bgc-$artExplodingHead", | ||
| "showInMain": true | ||
| }, | ||
| { | ||
| "artId":"clown-emoji", | ||
| "bgColor":"Bgc-$artClownEmoji", | ||
| "showInMain": false | ||
| }, | ||
| { | ||
| "artId":"mushroom", | ||
| "bgColor":"Bgc-$artMushroom", | ||
| "showInMain": true | ||
| }, | ||
| { | ||
| "artId":"robot-hare", | ||
| "bgColor":"Bgc-$artRobotHare", | ||
| "showInMain": true | ||
| }, | ||
| { | ||
| "artId":"funny-cake", | ||
| "bgColor":"Bgc-$artFunnyCake", | ||
| "showInMain": false | ||
| }, | ||
| { | ||
| "artId":"cat", | ||
| "bgColor":"Bgc-$artCat", | ||
| "showInMain": false | ||
| } | ||
| ] |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| [ | ||
| { | ||
| "name":"X", | ||
| "icon":"xcom", | ||
| "link":"https://x.com/mlutcss" | ||
| }, | ||
| { | ||
| "name":"Github", | ||
| "icon":"github", | ||
| "link":"https://github.com/mlutcss/mlut" | ||
| } | ||
| ] |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| [ | ||
| { | ||
| "link":"#0", | ||
| "text":"Features" | ||
| }, | ||
| { | ||
| "link":"/arts", | ||
| "text":"Art" | ||
| }, | ||
| { | ||
| "link":"#0", | ||
| "text":"Showcase" | ||
| }, | ||
| { | ||
| "link":"https://docs.mlut.style/", | ||
| "text":"Docs" | ||
| }, | ||
| { | ||
| "link":"https://play.mlut.style/", | ||
| "text":"Sandbox" | ||
| } | ||
| ] |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| <% | ||
| const css = { | ||
| buttonShape:"-Sz100p D-f Jc-c Ai-c P10 Fns4u Lnh100p Lts0 Fnst-n Fnw400 Bdrd8 Ts-$shortTs Bd1;s;$brand", | ||
| } | ||
|
|
||
| if (it.variant === 'brand') { | ||
| css.buttonColors = "Bgc-$brand Bgc-$brand500_h Bgc-$brand200_a"; | ||
| css.textColor = "C#fff"; | ||
| } else { | ||
| css.buttonColors = "Bgc-$white100 Bgc-$white200_h Bgc-$white300_a"; | ||
| css.textColor = "C#22141A"; | ||
| } | ||
|
|
||
| if (!it.tag) { | ||
| it.tag = 'a' | ||
| } else { | ||
| href = '' | ||
| } | ||
| %> | ||
| <<%= it.tag %> class="btn <%= css.buttonShape %> <%= css.buttonColors %> <%= css.textColor %>" href="<%= it.url %>"> | ||
| <%= it.text %> | ||
| </<%= it.tag %>> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| <% | ||
| if(it.name === "X") { | ||
| css.width = "24", | ||
| css.height = "24" | ||
| } else { | ||
| css.width = "26", | ||
| css.height = "26" | ||
| } | ||
| %> | ||
|
|
||
| <a | ||
| href="<%= it.link %>" | ||
| target="_blank" | ||
| class="-Ctx-logo Ps -Sz32 D-f Jc-c Ai-c" | ||
| > | ||
| <svg | ||
| class="Fi-$accent900 Fio1 ^logo:h:_Fi-$brand Ts-$shortTs" | ||
| width="<%= css.width %>" | ||
| height="<%= css.height %>" | ||
| > | ||
| <use href="/assets/img/icons.svg#<%= it.icon %>"></use> | ||
| </svg> | ||
| </a> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| <input type="checkbox" id="menu-toggle" hidden | ||
| class="-Ctx-burger Zi5 md_D-n"> | ||
|
|
||
| <label for="menu-toggle" | ||
| class="D md_D-n P1u Bd-n Bdrd1u H90p Apcr1 Ps-r Bgc-n Zi5 Tsd-$transD Cs | ||
| D_af,b Ct_af,b W4u_af,b H0.5u_af,b M0;0;1u_af,b Bgc-$accent900_af,b Zi10_af,b Bdrd2u_af,b | ||
| Bxsd0;1.5u;0;0;$accent900_af | ||
| :c:+_Bgc-$brand :c:+_Bdc-$brand :c:+_Bgc-$accent900_af,b :c:+_Bxsd0;1.5u;0;0;$accent900_af :c:+_Bdc-n"> | ||
| </label> | ||
|
|
||
| <label id="overlay" for="menu-toggle" | ||
|
Contributor
There was a problem hiding this comment. 2 лейбла на 1 инпут - это что-то странное |
||
| class="Ps-a W100vw Tsd-$transD H100vh T0 R0 D-n Bgc-n :c:~_D :c:~_Bgc#000*60p md_D-n"> | ||
| </label> | ||
|
Contributor
There was a problem hiding this comment. Меняем основной хедер, отдельный шаблон не нужен
Contributor
There was a problem hiding this comment. На мобильном не соответствует макету + логотип надо чуть побольше: 64px хотя бы |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,59 @@ | ||
| <% | ||
| const css = { | ||
| navLinkDesktop: "md_Txd-n md_C-$brand_h Ts-$shortTs", | ||
| navLinkMobile: "C-$accent900 Txd-n C-$brand_a Pb2u Bdb1;s;$brand md_Bdb-n", | ||
| navLi: "md_Pb0 md_Bd-n md_M10" | ||
| } | ||
| %> | ||
|
|
||
| <header class=" D-f Jc-sb Ai-c P15u;4u;2u md_P0;5.5p Bgc-$core950 Bcf -Blr0.4 Ps-f H-$headerH W100p C-$headerC Zi20"> | ||
| <%# Logo %> | ||
| <a href="/#hero-section" id="header-logo" class="D-f Jc-c Ai-c <%= it.cssHeaderLogoVisibility %> Ts-O;$shortTs"> | ||
| <img src="/assets/img/logo.svg" alt="mlut logo" class="W64 md_W116 H-a"> | ||
| </a> | ||
|
|
||
| <%# Menu %> | ||
| <div class="D-f Fld-r Jc-fe md_D-f md_Jc-e md_Gap8u md_Fns-$headerFns"> | ||
| <%- include('./burger.ejs') %> | ||
| <div class="Bgc-$core950 Ps-a R0 T-$headerH Ts-$longTs Tf -Trx101p Bd1;s;$brand Bdr-n Bdtlr3u Bdblr3u Mxw50u ^burger:c:~_-Trx0 W50vw P10u;0 md_All-ust @:h<420_P3u;0"> | ||
|
Contributor
There was a problem hiding this comment.
Contributor
There was a problem hiding this comment.
|
||
| <nav class="M0;0;9u md_M0"> | ||
| <h2 class="P0;5u M0;0;7u Txa-r C-$brand md_D-n @:h<420_M0;0;4u"> Menu </h2> | ||
| <ul id="nav-menu" class="C-$accent900 H40p D-f Jc-c Fld-c Gap5u P0;5u Txa-r Fns4u Lsst-n M0 md_Fld-r md_Jc-sb md_P0 md_H100p lg_Gap8u md_Txa-c @:h<420:w<gMd_Fld-r @:h<420:w<gMd_Flw-w @:h<420:w<gMd_Jc-fe"> | ||
| <% for (let navLink of it.navLinksRedesign) {%> | ||
| <li class=" <%= css.navLi %>"> | ||
| <a href="<%= navLink.link %>" class="<%= css.navLinkMobile %> <%= css.navLinkDesktop %>"> | ||
| <%= navLink.text %> | ||
| </a> | ||
| </li> | ||
| <% }%> | ||
| </ul> | ||
| </nav> | ||
|
|
||
| <%# External links %> | ||
| <div> | ||
| <h2 class="P0;5u Txa-r M0;0;3u C-$brand md_D-n @:h<420_M0;0;4u"> Find us</h2> | ||
| <div class="D-f Fld-r Jc-fe Ai-c Gap3u P0;5u H8u md_D-n"> | ||
| <% for (let extLink of it.extLinksRedesign) {%> | ||
| <%- include('../components/sm-link.ejs',{ | ||
| icon: `${extLink.icon}`, | ||
| link: `${extLink.link}`, | ||
| name: `${extLink.name}` | ||
| }) %> | ||
| <% }%> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <%# Desktop links %> | ||
| <div class="Ai-c Jc-sb P1u;2.5u D-n md_D-f md_Gap8u md_P0"> | ||
| <% for (let extLink of it.extLinksRedesign) { %> | ||
| <%- include('../components/sm-link.ejs',{ | ||
| icon: `${extLink.icon}`, | ||
| link: `${extLink.link}`, | ||
| name: `${extLink.name}` | ||
| }) %> | ||
| <% } %> | ||
| </div> | ||
| </div> | ||
|
|
||
| </header> | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Нет смысла создавать подобные отдельный файлы на редизайн, может только в некоторых местах. Тут просто ссылки: их набор никак не влияет