Skip to content

Commit 9b1b1b3

Browse files
committed
[Site] Add BlueSky
1 parent 49ec396 commit 9b1b1b3

File tree

6 files changed

+100
-47
lines changed

6 files changed

+100
-47
lines changed
Lines changed: 3 additions & 0 deletions
Loading

ux.symfony.com/assets/styles/sections/_header.scss

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,9 +88,14 @@ body.locked {
8888

8989
@media (min-width: 860px) {
9090
.AppHeader_logo {
91-
--height: 2.5rem;
91+
--height: 2rem;
9292
}
9393
.AppHeader_toggler {
9494
display: none !important;
9595
}
9696
}
97+
@media (min-width: 1020px) {
98+
.AppHeader_logo {
99+
--height: 2.5rem;
100+
}
101+
}

ux.symfony.com/assets/styles/sections/_nav.scss

Lines changed: 29 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,6 @@
55
flex-direction: row;
66
gap: 1.5rem;
77
justify-content: space-between;
8-
9-
@media (max-width: 859px) {
10-
flex-wrap: wrap;
11-
}
12-
position: relative;
13-
display: flex;
14-
flex-direction: row;
15-
gap: 1.5rem;
16-
justify-content: space-between;
178
@media (max-width: 859px) {
189
flex-wrap: wrap;
1910
}
@@ -32,6 +23,29 @@
3223
}
3324
}
3425

26+
.AppNav_socials {
27+
display: flex;
28+
gap: 1rem;
29+
align-items: center;
30+
justify-content: center;
31+
32+
@media (max-width: 576px) {
33+
position: absolute;
34+
top: 80vh;
35+
width: 100%;
36+
display: none;
37+
}
38+
}
39+
.AppHeader.open .AppNav_socials {
40+
@media (max-width: 576px) {
41+
display: flex;
42+
gap: 2rem;
43+
.AppNav_item--icon .Icon {
44+
font-size: 2rem;
45+
}
46+
}
47+
}
48+
3549
.AppNav_menu {
3650
justify-content: flex-end;
3751
display: flex;
@@ -90,13 +104,18 @@
90104
border: none;
91105
background: none;
92106
text-align: center;
93-
line-height: 2rem;
107+
line-height: 1.45;
94108
position: relative;
95109
transition: all 250ms;
96110
&:hover {
97111
opacity: 1;
98112
}
99113
}
114+
.AppNav_item--cs {
115+
@media (min-width: 860px) and (max-width: 1023px) {
116+
display: none;
117+
}
118+
}
100119
.AppNav_item--desktop {
101120
@media (min-width: 860px) {
102121
display: none;
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
did:plc:qvqugq4wjihbrwtua5du6d4l

ux.symfony.com/templates/_header.html.twig

Lines changed: 31 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -16,35 +16,46 @@
1616
<twig:ux:icon name="menu"/>
1717
</button>
1818
<twig:ThemeSwitcher class="AppNav_item AppNav_item--icon" aria-label="Switch dark/light mode"/>
19-
<a
20-
class="AppNav_item AppNav_item--icon d-none d-sm-grid"
21-
href="https://x.com/symfonyux"
22-
rel="external me"
23-
title="Symfony UX on X (Twitter)"
24-
>
25-
<twig:ux:icon name="x-twitter"/>
26-
</a>
27-
<a
28-
class="AppNav_item AppNav_item--icon d-none d-sm-grid"
29-
href="https://github.com/symfony/ux"
30-
rel="external me"
31-
title="Symfony UX on GitHub"
32-
>
33-
<twig:ux:icon name="github" />
34-
</a>
19+
<div class="AppNav_socials">
20+
<a
21+
class="AppNav_item AppNav_item--icon d-grid"
22+
href="https://x.com/symfonyux"
23+
rel="external me"
24+
title="Symfony UX on X (Twitter)"
25+
>
26+
<twig:ux:icon name="x-twitter"/>
27+
</a>
28+
<a
29+
class="AppNav_item AppNav_item--icon d-grid"
30+
href="https://bsky.app/profile/ux.symfony.com"
31+
rel="external me"
32+
title="Symfony UX on BlueSky"
33+
>
34+
<span class="AppNav_badge" data-content="New"></span>
35+
<twig:ux:icon name="bluesky"/>
36+
</a>
37+
<a
38+
class="AppNav_item AppNav_item--icon d-grid"
39+
href="https://github.com/symfony/ux"
40+
rel="external me"
41+
title="Symfony UX on GitHub"
42+
>
43+
<twig:ux:icon name="github" />
44+
</a>
45+
</div>
3546
</div>
3647

3748
<div class="AppNav_menu">
3849
<a href="{{ path('app_turbo') }}" class="AppNav_item">Turbo</a>
3950
<a href="{{ path('app_live_component') }}" class="AppNav_item">Live <span>Components</span></a>
4051
<a href="{{ path('app_icons') }}" class="AppNav_item">Icons</a>
4152
<a href="{{ path('app_packages') }}" class="AppNav_item">Packages</a>
42-
<a href="{{ path('app_cookbook') }}" class="AppNav_item">
53+
<a href="{{ path('app_demos') }}" class="AppNav_item">Demos</a>
54+
<a href="{{ path('app_cookbook') }}" class="AppNav_item AppNav_item--cs">Cookbook</a>
55+
<a href="{{ path('app_support') }}" class="AppNav_item AppNav_item--cs" rel="help">
4356
<span class="AppNav_badge" data-content="New"></span>
44-
Cookbook
57+
Support
4558
</a>
46-
<a href="{{ path('app_demos') }}" class="AppNav_item">Demos</a>
47-
<a href="{{ path('app_support') }}" class="AppNav_item AppNav_item--desktop" rel="help">Support</a>
4859
</div>
4960

5061
</nav>

ux.symfony.com/templates/support.html.twig

Lines changed: 30 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -16,25 +16,19 @@
1616
</div>
1717

1818
<section style="--padding:0;">
19-
<div class="container-fluid container px-4 pt-4 px-md-5" style="max-width: 1000px;">
19+
<div class="container-fluid container px-4 pt-4 px-md-5" style="max-width: 1200px;">
2020
<div style="display: grid; gap: 3rem; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))">
2121

2222
<div class="SupportBox">
2323
<div class="SupportBox_logo">
2424
<twig:ux:icon name="github" />
2525
</div>
26-
<div class="SupportBox_badge">
27-
<span class="Badge Badge--new">
28-
<twig:ux:icon name="bi:stars" style="width: 1.25em; display: block;" />
29-
New!
30-
</span>
31-
</div>
3226
<div class="SupportBox_content">
3327
<h2 class="SupportBox_title">
3428
<a href="https://github.com/symfony/ux/discussions" class="SupportBox_link" rel="external me">Github Discussions</a>
3529
</h2>
3630
<p class="SupportBox_description">
37-
Engage in our GitHub Discussions to find answers and ask the community for help.
31+
Engage in our GitHub Discussions to find answers, ideas or ask the <code>community</code> for help.
3832
</p>
3933
</div>
4034
</div>
@@ -55,14 +49,34 @@
5549

5650
<div class="SupportBox">
5751
<div class="SupportBox_logo">
58-
<twig:ux:icon name="x-twitter" />
52+
<twig:ux:icon name="bluesky" style="color:#0A7AFFFF;"/>
53+
</div>
54+
<div class="SupportBox_badge">
55+
<span class="Badge Badge--new">
56+
<twig:ux:icon name="bi:stars" style="width: 1.25em; display: block;" />
57+
New!
58+
</span>
5959
</div>
6060
<div class="SupportBox_content">
6161
<h2 class="SupportBox_title">
62-
<a href="https://x.com/SymfonyUX" class="SupportBox_link" rel="external me"><s>Twitter</s> X</a>
62+
<a href="https://bsky.app/profile/ux.symfony.com" class="SupportBox_link" rel="external me">BlueSky</a>
6363
</h2>
6464
<p class="SupportBox_description">
65-
Follow the conversation on X for the latest tips and updates about <code>#SymfonyUX</code>.
65+
Join and follow <code>@ux.symfony.com</code> to get updates and interact with the <code>#SymfonyUX</code> team!
66+
</p>
67+
</div>
68+
</div>
69+
70+
<div class="SupportBox">
71+
<div class="SupportBox_logo">
72+
<twig:ux:icon name="github" />
73+
</div>
74+
<div class="SupportBox_content">
75+
<h2 class="SupportBox_title">
76+
<a href="https://github.com/symfony/ux/issues" class="SupportBox_link" rel="external me">Github Issues</a>
77+
</h2>
78+
<p class="SupportBox_description">
79+
Submit <code>bug reports</code> or contribute to the documentation on our GitHub Issues tracker.
6680
</p>
6781
</div>
6882
</div>
@@ -81,19 +95,19 @@
8195
</div>
8296
</div>
8397

84-
{% if false %}
8598
<div class="SupportBox">
8699
<div class="SupportBox_logo">
87-
<twig:ux:icon name="logos:stackoverflow-icon" />
100+
<twig:ux:icon name="x-twitter" />
88101
</div>
89102
<div class="SupportBox_content">
90103
<h2 class="SupportBox_title">
91-
<a href="https://stackoverflow.com/questions/tagged/symfonyux" class="SupportBox_link">Stack Overflow</a>
104+
<a href="https://x.com/SymfonyUX" class="SupportBox_link" rel="external me"><s>Twitter</s> X</a>
92105
</h2>
93-
<p class="SupportBox_description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.<code>#ux</code> Nullam auctor, nunc nec</p>
106+
<p class="SupportBox_description">
107+
Follow the conversation on X for the latest tips and updates about <code>#SymfonyUX</code>.
108+
</p>
94109
</div>
95110
</div>
96-
{% endif %}
97111

98112
</div>
99113
</div>

0 commit comments

Comments
 (0)