Skip to content

Commit 1cc65dd

Browse files
committed
Update gitignore and build paths to nest build directory inside includes/
1 parent 13e07d0 commit 1cc65dd

33 files changed

Lines changed: 3916 additions & 34 deletions

.gitignore

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/vendor/
22
/node_modules/
3-
/build/
3+
/includes/build/
44
/phpcompat-tools/
55

66
# Lock files

includes/admin/class-settings.php

Lines changed: 60 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,7 @@ class Settings {
8383
*/
8484
public function __construct() {
8585
add_action( 'admin_menu', array( $this, 'initialise_settings' ) );
86+
add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_language_data' ), 20 );
8687
}
8788

8889
/**
@@ -182,16 +183,13 @@ public static function get_registered_settings(): array {
182183
'options' => self::$color_schemes,
183184
),
184185
array(
185-
'id' => 'default-lang',
186-
'name' => __( 'Default Language', 'webberzone-code-block-highlighting' ),
187-
'desc' => sprintf(
188-
/* translators: %s: link to Prism supported languages list */
189-
__( 'Automatically set this language when a code block is inserted. Use a language alias from the %s. Leave blank to disable.', 'webberzone-code-block-highlighting' ),
190-
'<a href="https://prismjs.com/#supported-languages" target="_blank" rel="noopener noreferrer">' . __( 'supported languages list', 'webberzone-code-block-highlighting' ) . '</a>'
191-
),
192-
'type' => 'text',
193-
'default' => '',
194-
'placeholder' => 'javascript',
186+
'id' => 'default-lang',
187+
'name' => __( 'Default Language', 'webberzone-code-block-highlighting' ),
188+
'desc' => __( 'Automatically set this language when a code block is inserted. Leave blank to disable.', 'webberzone-code-block-highlighting' ),
189+
'type' => 'csv',
190+
'default' => '',
191+
'field_class' => 'ts_autocomplete',
192+
'field_attributes' => self::get_language_field_attributes(),
195193
),
196194
),
197195
);
@@ -227,6 +225,56 @@ public static function settings_defaults(): array {
227225
return apply_filters( self::$prefix . '_settings_defaults', $defaults ); // phpcs:ignore WordPress.NamingConventions.PrefixAllGlobals.DynamicHooknameFound
228226
}
229227

228+
/**
229+
* Get field attributes for the Tom Select language picker.
230+
*
231+
* @since 1.1.0
232+
*
233+
* @return array
234+
*/
235+
public static function get_language_field_attributes(): array {
236+
return array(
237+
'data-wp-prefix' => strtoupper( self::$prefix ),
238+
'data-wp-endpoint' => 'prism_languages',
239+
'data-ts-config' => wp_json_encode(
240+
array(
241+
'maxItems' => 1,
242+
'plugins' => array( 'dropdown_input', 'clear_button' ),
243+
'render' => (object) array(),
244+
)
245+
),
246+
);
247+
}
248+
249+
/**
250+
* Inject Prism language list into WZTomSelectSettings for the settings page autocomplete.
251+
*
252+
* @since 1.1.0
253+
*
254+
* @param string $hook Current admin page hook.
255+
*/
256+
public function enqueue_language_data( string $hook ): void {
257+
if ( ! isset( $this->settings_api ) || $hook !== $this->settings_api->settings_page ) {
258+
return;
259+
}
260+
261+
$languages = \WebberZone\Code_Block_Highlighting\Frontend\Blocks::get_languages();
262+
$options = array();
263+
264+
foreach ( $languages as $slug => $label ) {
265+
$options[] = array(
266+
'id' => $slug,
267+
'name' => $label,
268+
);
269+
}
270+
271+
wp_add_inline_script(
272+
'wz-' . self::$prefix . '-tom-select-init',
273+
'window.WZTomSelectSettings = window.WZTomSelectSettings || {}; window.WZTomSelectSettings.prism_languages = ' . wp_json_encode( $options ) . ';',
274+
'before'
275+
);
276+
}
277+
230278
/**
231279
* Get the URL (or filesystem path) to the active color scheme CSS file.
232280
*
@@ -239,10 +287,10 @@ public static function settings_defaults(): array {
239287
*/
240288
public static function get_color_scheme_css( bool $return_path = false ): string {
241289
$option = wz_cbh_get_option( 'color-scheme', 'prism-a11y-dark' );
242-
$rel_path = "assets/{$option}.css";
290+
$rel_path = "includes/assets/{$option}.css";
243291

244292
if ( ! file_exists( WZ_CBH_PLUGIN_DIR . $rel_path ) ) {
245-
$rel_path = 'assets/prism-a11y-dark.css';
293+
$rel_path = 'includes/assets/prism-a11y-dark.css';
246294
}
247295

248296
if ( $return_path ) {
Lines changed: 169 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,169 @@
1+
/* Admin banner base styles
2+
----------------------------------*/
3+
.wz-admin-banner {
4+
margin: -20px -20px 0 -20px;
5+
padding: 26px 36px;
6+
background: linear-gradient(-180deg, #041f4e 0%, #031337 55%, #010713 100%);
7+
color: #f6f8ff;
8+
display: flex;
9+
align-items: center;
10+
gap: 28px;
11+
box-sizing: border-box;
12+
}
13+
14+
.wz-admin-banner__intro {
15+
flex: 1 1 auto;
16+
min-width: 220px;
17+
color: #f6f8ff;
18+
}
19+
20+
.wz-admin-banner__eyebrow {
21+
display: inline-block;
22+
padding: 2px 10px;
23+
border-radius: 999px;
24+
background-color: rgba(127, 195, 255, 0.2);
25+
color: #7fc3ff;
26+
font-size: 0.9rem;
27+
text-transform: uppercase;
28+
letter-spacing: 0.06em;
29+
font-weight: 600;
30+
}
31+
32+
.wz-admin-banner__title {
33+
margin: 10px 0 6px;
34+
font-size: 1rem;
35+
font-weight: 700;
36+
line-height: 1.24;
37+
color: #ffffff;
38+
}
39+
40+
.wz-admin-banner__text {
41+
margin: 0;
42+
font-size: 0.9rem;
43+
line-height: 1.6;
44+
color: #dfe6ff;
45+
max-width: 540px;
46+
}
47+
48+
.wz-admin-banner__links {
49+
display: flex;
50+
flex-wrap: wrap;
51+
gap: 10px;
52+
align-items: center;
53+
}
54+
55+
.wz-admin-banner__link {
56+
display: inline-flex;
57+
align-items: center;
58+
gap: 8px;
59+
padding: 9px 16px;
60+
border-radius: 999px;
61+
font-size: 0.9rem;
62+
font-weight: 600;
63+
text-decoration: none;
64+
color: inherit;
65+
transition:
66+
transform 0.2s ease,
67+
box-shadow 0.2s ease,
68+
background-color 0.2s ease,
69+
outline 0.2s ease;
70+
outline: none;
71+
}
72+
73+
.wz-admin-banner__link:focus,
74+
.wz-admin-banner__link:focus-visible,
75+
.wz-admin-banner__link:active {
76+
outline: 2px solid rgba(255, 255, 255, 0.7);
77+
outline-offset: 2px;
78+
}
79+
80+
.wz-admin-banner__link--primary {
81+
background-color: #ffbd59;
82+
color: #0a0a0a;
83+
box-shadow: 0 8px 24px rgba(255, 189, 89, 0.45);
84+
}
85+
86+
.wz-admin-banner__link--primary:hover,
87+
.wz-admin-banner__link--primary:focus,
88+
.wz-admin-banner__link--primary:focus-visible,
89+
.wz-admin-banner__link--primary:active {
90+
background-color: #f08c00;
91+
transform: translateY(-1px);
92+
outline: 2px solid #ffffff;
93+
outline-offset: 2px;
94+
color: #0a0a0a;
95+
}
96+
97+
.wz-admin-banner__link--secondary {
98+
background-color: rgba(3, 32, 117, 0.18);
99+
color: #f6f8ff;
100+
box-shadow: inset 0 0 0 1px rgba(3, 32, 117, 0.45);
101+
}
102+
103+
.wz-admin-banner__link--secondary:hover,
104+
.wz-admin-banner__link--secondary:focus,
105+
.wz-admin-banner__link--secondary:focus-visible,
106+
.wz-admin-banner__link--secondary:active {
107+
background-color: #0d2f8d;
108+
transform: translateY(-1px);
109+
outline: 2px solid #ffbd59;
110+
outline-offset: 2px;
111+
color: #ffffff;
112+
}
113+
114+
.wz-admin-banner__link--current {
115+
background-color: #c8302e;
116+
color: #ffffff;
117+
box-shadow: 0 8px 24px rgba(200, 48, 46, 0.4);
118+
}
119+
120+
.wz-admin-banner__link--current:hover,
121+
.wz-admin-banner__link--current:focus,
122+
.wz-admin-banner__link--current:focus-visible,
123+
.wz-admin-banner__link--current:active {
124+
background-color: #e04841;
125+
color: #ffffff;
126+
outline: 2px solid #ffffff;
127+
outline-offset: 2px;
128+
transform: translateY(-1px);
129+
}
130+
131+
@media screen and (max-width: 782px) {
132+
.wz-admin-banner {
133+
flex-direction: column;
134+
align-items: flex-start;
135+
gap: 18px;
136+
margin: -16px -16px 12px -16px;
137+
padding: 20px 20px;
138+
}
139+
140+
.wz-admin-banner__title {
141+
font-size: 1.125rem;
142+
}
143+
}
144+
145+
@media (prefers-reduced-motion: reduce) {
146+
.wz-admin-banner__link {
147+
transition: none;
148+
}
149+
}
150+
151+
@media screen and (max-width: 600px) {
152+
body.wp-admin #wpbody {
153+
padding-top: 0;
154+
}
155+
156+
body.wp-admin .wz-admin-banner {
157+
margin: 0px -16px 0 -16px;
158+
padding: 48px 20px 28px 20px;
159+
}
160+
161+
.wz-admin-banner__link {
162+
font-size: 0.875rem;
163+
}
164+
165+
body.wp-admin .wz-admin-banner__title,
166+
body.wp-admin .wz-admin-banner__text {
167+
display: none;
168+
}
169+
}

includes/admin/css/admin-banner-rtl.min.css

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)