change Twitter to X brand (#1880)

* change twitter to X brand

* build fix

* Create afraid-geese-sin.md

.changeset/afraid-geese-sin.md

@@ -0,0 +1,5 @@
+---
+"@tabler/core": patch
+---
+
+Change Twitter to X brand

Gemfile

@@ -1,6 +1,6 @@
 source "https://rubygems.org"
 
-gem "jekyll", "4.3.2"
+gem "jekyll", "4.3.3"
 
 group :jekyll_plugins do
 	gem "jekyll-random"

Gemfile.lock

@@ -1,23 +1,24 @@
 GEM
   remote: https://rubygems.org/
   specs:
-    addressable (2.8.5)
+    addressable (2.8.6)
       public_suffix (>= 2.0.2, < 6.0)
     colorator (1.1.0)
-    concurrent-ruby (1.2.2)
+    concurrent-ruby (1.2.3)
     em-websocket (0.5.3)
       eventmachine (>= 0.12.9)
       http_parser.rb (~> 0)
     eventmachine (1.2.7)
-    ffi (1.16.2)
+    ffi (1.16.3)
     forwardable-extended (2.6.0)
-    google-protobuf (3.24.3)
+    google-protobuf (4.26.1)
+      rake (>= 13)
     htmlbeautifier (1.4.2)
     htmlcompressor (0.4.0)
     http_parser.rb (0.8.0)
-    i18n (1.14.1)
+    i18n (1.14.4)
       concurrent-ruby (~> 1.0)
-    jekyll (4.3.2)
+    jekyll (4.3.3)
       addressable (~> 2.4)
       colorator (~> 1.0)
       em-websocket (~> 0.5)
@@ -52,34 +53,34 @@ GEM
     kramdown-parser-gfm (1.1.0)
       kramdown (~> 2.0)
     liquid (4.0.4)
-    listen (3.8.0)
+    listen (3.9.0)
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
     mercenary (0.4.0)
     mini_i18n (0.9.0)
     pathutil (0.16.2)
       forwardable-extended (~> 2.6)
-    public_suffix (5.0.3)
+    public_suffix (5.0.5)
-    rake (13.0.6)
+    rake (13.2.1)
     rb-fsevent (0.11.2)
     rb-inotify (0.10.1)
       ffi (~> 1.0)
     rexml (3.2.6)
-    rouge (4.1.3)
+    rouge (4.2.1)
     safe_yaml (1.0.5)
-    sass-embedded (1.68.0)
+    sass-embedded (1.75.0)
-      google-protobuf (~> 3.23)
+      google-protobuf (>= 3.25, < 5.0)
       rake (>= 13.0.0)
     terminal-table (3.0.2)
       unicode-display_width (>= 1.1.1, < 3)
-    unicode-display_width (2.4.2)
+    unicode-display_width (2.5.0)
     webrick (1.8.1)
 
 PLATFORMS
   ruby
 
 DEPENDENCIES
-  jekyll (= 4.3.2)
+  jekyll (= 4.3.3)
   jekyll-random
   jekyll-redirect-from
   jekyll-tidy

_config.yml

@@ -181,6 +181,9 @@ button-states:
     title: Disabled
 
 socials:
+  x:
+    icon: brand-x
+    title: X
   facebook:
     icon: brand-facebook
     title: Facebook

src/pages/_data/timeline.yml

@@ -7,9 +7,9 @@
   title: Products
   date: 2 hrs ago
 
-- icon: brand-twitter
+- icon: brand-x
-  icon-bg: twitter
+  icon-bg: x
-  title: Twitter
+  title: X
   date: 8 hrs ago
 
 - icon: brand-dribbble

src/pages/_includes/cards/profile-2.html

@@ -13,8 +13,8 @@
 						</a>
 					</li>
 					<li class="list-inline-item">
-						<a href="#" title="Twitter" data-bs-toggle="tooltip">
+						<a href="#" title="X" data-bs-toggle="tooltip">
-							{% include ui/icon.html icon="brand-twitter" %}
+							{% include ui/icon.html icon="brand-x" %}
 						</a>
 					</li>
 					<li class="list-inline-item">

src/pages/_includes/cards/profile.html

@@ -7,7 +7,7 @@
 		</p>
 
 		<button class="btn btn-outline-primary btn-sm">
-			{% include ui/icon.html icon="brand-twitter" %}
+			{% include ui/icon.html icon="brand-x" %}
 			Follow
 		</button>
 	</div>

src/pages/_includes/cards/sign-in.html

@@ -10,7 +10,7 @@
 	<div class="card-body">
 		<div class="row">
 			<div class="col">{% include ui/button.html  block=true icon="brand-github" icon-color="github" text="Login with Github" %}</div>
-			<div class="col">{% include ui/button.html  block=true icon="brand-twitter" icon-color="twitter" text="Login with Twitter" %}</div>
+			<div class="col">{% include ui/button.html  block=true icon="brand-x" icon-color="x" text="Login with X" %}</div>
 		</div>
 	</div>
 </div>

src/pages/_includes/cards/timeline.html

@@ -1,6 +1,6 @@
 <ul class="timeline{% if include.simple %} timeline-simple{% endif %}">
 	<li class="timeline-event">
-		<div class="timeline-event-icon bg-twitter-lt">{% include ui/icon.html icon="brand-twitter" %}</div>
+		<div class="timeline-event-icon bg-x-lt">{% include ui/icon.html icon="brand-x" %}</div>
 		<div class="card timeline-event-card">
 			<div class="card-body">
 				<div class="text-secondary float-end">10 hrs ago</div>

src/pages/_includes/forms/form-elements-6.html

@@ -26,7 +26,7 @@
 			{% include ui/button.html  block=true icon="brand-github" icon-color="github" text="Login with Github" %}
 		</div>
 		<div class="col">
-			{% include ui/button.html  block=true icon="brand-twitter" icon-color="twitter" text="Login with Twitter" %}
+			{% include ui/button.html  block=true icon="brand-x" icon-color="x" text="Login with X" %}
 		</div>
 	</div>
 </div>

src/pages/_includes/layout/homepage.html

@@ -22,7 +22,7 @@
 				{% include cards/small-stats.html color="green" icon="shopping-cart" title="78 Orders" description="32 shipped" %}
 			</div>
 			<div class="col-sm-6 col-lg-3">
-				{% include cards/small-stats.html icon="brand-twitter" color="twitter" title="623 Shares" description="16 today" %}
+				{% include cards/small-stats.html icon="brand-x" color="x" title="623 Shares" description="16 today" %}
 			</div>
 			<div class="col-sm-6 col-lg-3">
 				{% include cards/small-stats.html icon="brand-facebook" color="facebook" title="132 Likes" description="21 today" %}

src/scss/_variables.scss

@@ -251,6 +251,7 @@ $extra-colors: (
 ) !default;
 
 $social-colors: (
+  "x": #000000,
   "facebook": #1877f2,
   "twitter": #1da1f2,
   "linkedin": #0a66c2,