Skip to content

Commit 87f0676

Browse files
Johnkat-MjJohnkat-Mj
authored
Merge pull request #2 from unoforge/dev
add : UI and Registries
2 parents 24f1ad1 + eda7d02 commit 87f0676

File tree

404 files changed

+12328
-106
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

404 files changed

+12328
-106
lines changed

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
/storage/*.key
2020
/storage/pail
2121
/vendor
22+
/__dev-test
2223
Homestead.json
2324
Homestead.yaml
2425
Thumbs.db

‎app/Livewire/ComponentPage.php‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,10 +32,10 @@ public function mount(?string $main = null, ?string $children = null)
3232
if ($segments[0] === 'livewire') {
3333
array_shift($segments);
3434
}
35-
$this->path = str_replace('/content', '', '/'.implode('/', $segments));
35+
$this->path = str_replace('/content', '', '/' . implode('/', $segments));
3636
}
3737

38-
#[Layout('layouts.docs', ['activeGroup' => 'components'])]
38+
#[Layout('layouts::docs')]
3939
public function render()
4040
{
4141
if (! View::exists($this->view)) {

‎app/Livewire/DocsPage.php‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ public function mount(?string $main = null, ?string $children = null)
4343
$this->path = str_replace('/content', '', '/'.implode('/', $segments));
4444
}
4545

46-
#[Layout('layouts.docs', ['activeGroup' => 'getting-started', 'activeItem' => 'introduction', 'hideTableOfContent' => false, 'title' => '', 'description' => ''])]
46+
#[Layout('layouts::docs')]
4747
public function render()
4848
{
4949
if (! View::exists($this->view)) {
@@ -59,7 +59,6 @@ public function render()
5959
$this->description = $this->current['seoDescription'] ?? '';
6060
$this->keywords = $this->current['keywords'] ?? '';
6161

62-
// dd($this->nextSlug);
6362

6463
return view($this->view);
6564
}

‎app/Support/DocsCode/installation.php‎

Lines changed: 153 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,5 +15,157 @@
1515
'lang' => 'css',
1616
'name' => 'Shell',
1717
'code' => 'npm i @flexilla/alpine-accordion'
18-
]
18+
],
19+
'install-dark-mode-blade' => [
20+
'lang' => 'css',
21+
'name' => 'Shell',
22+
'code' => 'npm i @flexilla/utilities'
23+
],
24+
'theme-toggle-button' => [
25+
'lang'=>'blade',
26+
'name'=>'theme-toggle.blade.php',
27+
'code'=><<<'HTML'
28+
<x-ui.button variant="ghost" size="sm" iconOnly radius="none" x-on:click="$store.theme.toggle()"
29+
aria-label="toggle theme" class="rounded-global relative">
30+
<span
31+
class="absolute top-1/2 -translate-1/2 left-1/2 ease-linear duration-200 iconify ph--sun invisible dark:visible"></span>
32+
<span
33+
class="absolute top-1/2 -translate-1/2 left-1/2 ease-linear duration-200 iconify ph--moon-stars visible dark:invisible"></span>
34+
</x-ui.button>
35+
HTML
36+
],
37+
38+
'theme-alpine-head' => [
39+
'lang' => 'html',
40+
'name' => 'HTML',
41+
'code' => <<<'HTML'
42+
<head>
43+
<!-- Other head content -->
44+
<script>
45+
(function(){const s=document.documentElement,d=s.dataset.theme,l=localStorage.getItem('theme'),m=window.matchMedia('(prefers-color-scheme: dark)').matches;s.classList.toggle('dark',d?d==='dark':l?l==='dark':m)})();
46+
</script>
47+
</head>
48+
HTML
49+
],
50+
'theme-vanilla-init-head' => [
51+
'lang' => 'html',
52+
'name' => 'HTML',
53+
'code' => <<<'HTML'
54+
<head>
55+
<!-- Other head content -->
56+
<script>
57+
!(function () { try {var e = "flexilla-theme", t = localStorage.getItem(e) || "system",c = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light",r = "system" === t ? c : t,a = document.documentElement;(a.classList.toggle("dark", "dark" === r), a.setAttribute("data-theme", r), (a.style.colorScheme = r));} catch (e) {}})();
58+
</script>
59+
</head>
60+
HTML
61+
],
62+
'theme-usage' => [
63+
'lang' => 'javascript',
64+
'name' => 'JavaScript',
65+
'code' => <<<'JS'
66+
import { flexiTheme } from '@flexilla/utilities'
67+
68+
const theme = flexiTheme()
69+
// init theme
70+
theme.initTheme()
71+
72+
// set theme : dark, light, system
73+
theme.setTheme("dark")
74+
JS
75+
],
76+
'theme-alpine' => [
77+
'lang' => 'javascript',
78+
'name' => 'JavaScript',
79+
'code' => <<<'JS'
80+
import { disableTransitionsTemporarily } from "@flexilla/utilities";
81+
82+
document.addEventListener("alpine:init", () => {
83+
Alpine.store("theme", {
84+
isDark: false,
85+
init() {
86+
const localTheme = localStorage.getItem("theme");
87+
const systemPrefersDark = window.matchMedia(
88+
"(prefers-color-scheme: dark)"
89+
).matches;
90+
91+
if (localTheme) {
92+
this.isDark = localTheme === "dark";
93+
} else {
94+
this.isDark = systemPrefersDark;
95+
}
96+
97+
this.updateTheme();
98+
window
99+
.matchMedia("(prefers-color-scheme: dark)")
100+
.addEventListener("change", (e) => {
101+
if (!localStorage.getItem("theme")) {
102+
this.isDark = e.matches;
103+
this.updateTheme();
104+
}
105+
});
106+
107+
document.addEventListener("livewire:navigated", () => {
108+
disableTransitionsTemporarily(() => {
109+
document.documentElement.classList.toggle(
110+
"dark",
111+
this.isDark
112+
);
113+
});
114+
});
115+
},
116+
117+
toggle() {
118+
this.isDark = !this.isDark;
119+
this.updateTheme();
120+
},
121+
122+
setToDark() {
123+
this.isDark = true;
124+
this.updateTheme();
125+
},
126+
127+
setToLight() {
128+
this.isDark = false;
129+
this.updateTheme();
130+
},
131+
132+
updateTheme() {
133+
disableTransitionsTemporarily(() => {
134+
document.documentElement.classList.toggle("dark", this.isDark);
135+
localStorage.setItem("theme", this.isDark ? "dark" : "light");
136+
window.dispatchEvent(new CustomEvent("theme-changed", {
137+
detail: { theme: this.isDark ? "dark" : "light", isDark: this.isDark }
138+
}));
139+
});
140+
},
141+
});
142+
});
143+
144+
document.addEventListener("livewire:navigated", () => {
145+
const theme =
146+
localStorage.getItem("theme") ||
147+
(window.matchMedia("(prefers-color-scheme: dark)").matches
148+
? "dark"
149+
: "light");
150+
document.documentElement.classList.toggle("dark", theme === "dark");
151+
});
152+
153+
window.toggleTheme = function () {
154+
const currentTheme =
155+
localStorage.getItem("theme") ||
156+
(document.documentElement.classList.contains("dark")
157+
? "dark"
158+
: "light");
159+
const newTheme = currentTheme === "dark" ? "light" : "dark";
160+
161+
localStorage.setItem("theme", newTheme);
162+
document.documentElement.classList.toggle("dark", newTheme === "dark");
163+
window.dispatchEvent(
164+
new CustomEvent("theme-changed", {
165+
detail: { theme: newTheme },
166+
})
167+
);
168+
};
169+
JS
170+
],
19171
];

‎config/base.php‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<?php
2+
3+
return [
4+
'githubRepoUrl' => 'https://github.com/unoforge/flexiwind',
5+
'editContentBaseUrl'=>'https://github.com/unoforge/flexiwind/blob/main/resources/content/',
6+
'discussionBaseUrl'=>'https://github.com/unoforge/flexiwind/discussions',
7+
'keywords_def'=>'Laravel UI Components, Laravel Components, Tailwind Component',
8+
'default_og_image'=>'/default-og.png',
9+
'default_og_alt'=>'Default OG Alt'
10+
];

0 commit comments

Comments
 (0)