From eec15db7dd1f6dd61ab67cf1a3fd8ce7d8eeb45d Mon Sep 17 00:00:00 2001 From: Ryjek Date: Mon, 6 Jul 2026 22:44:05 +0200 Subject: [PATCH] choose type view --- project/assets/app.js | 1 + project/assets/styles/main.less | 93 ++++++++++++++++++++++ project/templates/base.html.twig | 8 +- project/templates/index/index.html.twig | 42 +++++++--- project/templates/index/indexOld.html.twig | 14 ++++ 5 files changed, 146 insertions(+), 12 deletions(-) create mode 100644 project/assets/styles/main.less create mode 100644 project/templates/index/indexOld.html.twig diff --git a/project/assets/app.js b/project/assets/app.js index a9d6912..959fb3d 100644 --- a/project/assets/app.js +++ b/project/assets/app.js @@ -7,6 +7,7 @@ // any CSS you import will output into a single css file (app.css in this case) import './styles/global.less'; +import './styles/main.less'; // start the Stimulus application import './bootstrap'; diff --git a/project/assets/styles/main.less b/project/assets/styles/main.less new file mode 100644 index 0000000..03887f8 --- /dev/null +++ b/project/assets/styles/main.less @@ -0,0 +1,93 @@ +.main-container { + font-family: 'Public Sans', system-ui, sans-serif; + color: #1C1C1A; + background: #EFEEE9; + min-height: 100vh; + padding: 56px 24px; + display: flex; + justify-content: center; + -webkit-font-smoothing: antialiased; +} + +.card { + position: relative; + width: 100%; + max-width: 660px; + background: #FBFBF9; + border: 1px solid #E6E5E0; + border-radius: 18px; + padding: 36px 34px 42px; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03); +} + +.badge { + position: absolute; + top: -13px; + left: 28px; + background: #1C1C1A; + color: #FBFBF9; + font-family: 'IBM Plex Mono', monospace; + font-size: 12px; + font-weight: 600; + padding: 3px 10px; + border-radius: 6px; +} + +.rail { + display: flex; + align-items: center; + margin-bottom: 28px; + .rail-step { + display: flex; + align-items: center; + gap: 10px; + } + .rail-dot { + width: 26px; + height: 26px; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-family: 'IBM Plex Mono', monospace; + font-size: 12px; + font-weight: 600; + background: #FFFFFF; + color: #B7B6B0; + border: 1px solid #E0DFD9; + } + .rail-label { + font-size: 12.5px; + font-weight: 600; + color: #A6A5A0; + } + .rail-line { + flex: 1; + height: 1px; + background: #E0DFD9; + margin: 0 14px; + min-width: 24px; + } + + &.is-done { + .rail-dot { + background: #E7EFE9; + color: #3F8F6B; + border-color: #CDE3D5; + } + .rail-label { + color: #3B3A36; + } + } + &.is-active{ + .rail-dot { + background: #1C1C1A; + color: #FBFBF9; + border-color: #1C1C1A; + } + .rail-label { + color: #1C1C1A; + } + } +} + diff --git a/project/templates/base.html.twig b/project/templates/base.html.twig index d20edb5..532f08a 100644 --- a/project/templates/base.html.twig +++ b/project/templates/base.html.twig @@ -2,9 +2,11 @@ - {% block title %}Welcome!{% endblock %} - - {# Run `composer require symfony/webpack-encore-bundle` to start using Symfony UX #} + {% block title %}{% endblock %} + + + + {% block stylesheets %} {{ encore_entry_link_tags('app') }} {% endblock %} diff --git a/project/templates/index/index.html.twig b/project/templates/index/index.html.twig index bd640a5..aaee9ce 100644 --- a/project/templates/index/index.html.twig +++ b/project/templates/index/index.html.twig @@ -1,14 +1,38 @@ {% extends 'base.html.twig' %} -{% block title %}Index{% endblock %} - +{% block title %}Rozliczenie podatkowe{% endblock %} {% block body %} -
-
- Dividends -
-
- Cryptocurrency -
+
+
+
+ {% for row in [{i:'1', label:'Wybór'}, {i:'2', label:'Pliki'}, {i:'3', label:'Wynik'}] %} +
+
{{ row.i }}
+ {{ row.label }} +
+ {% if not loop.last %} +
+ {% endif %} + {% endfor %} +
+
+ + +
+
{% endblock %} \ No newline at end of file diff --git a/project/templates/index/indexOld.html.twig b/project/templates/index/indexOld.html.twig new file mode 100644 index 0000000..bd640a5 --- /dev/null +++ b/project/templates/index/indexOld.html.twig @@ -0,0 +1,14 @@ +{% extends 'base.html.twig' %} + +{% block title %}Index{% endblock %} + +{% block body %} +
+
+ Dividends +
+
+ Cryptocurrency +
+
+{% endblock %} \ No newline at end of file