diff --git a/tools/tailwind.config.js b/tools/tailwind.config.js index 6d171b1..1439f21 100644 --- a/tools/tailwind.config.js +++ b/tools/tailwind.config.js @@ -1,6 +1,6 @@ /** @type {import('tailwindcss').Config} */ module.exports = { - content: ["../web/**/*.{html,js,mustache}"], + content: ["../web/**/*.{html,js}"], theme: { extend: {}, }, diff --git a/web/css/output.css b/web/css/output.css index 2642a65..233a46c 100644 --- a/web/css/output.css +++ b/web/css/output.css @@ -534,6 +534,40 @@ video { --tw-backdrop-sepia: ; } +.container { + width: 100%; +} + +@media (min-width: 640px) { + .container { + max-width: 640px; + } +} + +@media (min-width: 768px) { + .container { + max-width: 768px; + } +} + +@media (min-width: 1024px) { + .container { + max-width: 1024px; + } +} + +@media (min-width: 1280px) { + .container { + max-width: 1280px; + } +} + +@media (min-width: 1536px) { + .container { + max-width: 1536px; + } +} + .sr-only { position: absolute; width: 1px; @@ -647,6 +681,30 @@ video { margin-top: 1.5rem; } +.mb-1 { + margin-bottom: 0.25rem; +} + +.mb-3 { + margin-bottom: 0.75rem; +} + +.ml-2 { + margin-left: 0.5rem; +} + +.ml-auto { + margin-left: auto; +} + +.mr-1 { + margin-right: 0.25rem; +} + +.mr-3 { + margin-right: 0.75rem; +} + .block { display: block; } @@ -695,6 +753,10 @@ video { height: 2rem; } +.h-full { + height: 100%; +} + .w-12 { width: 3rem; } @@ -749,6 +811,10 @@ video { flex-direction: column; } +.flex-wrap { + flex-wrap: wrap; +} + .items-start { align-items: flex-start; } @@ -798,6 +864,11 @@ video { border-color: rgb(107 114 128 / 0.1); } +.divide-gray-300 > :not([hidden]) ~ :not([hidden]) { + --tw-divide-opacity: 1; + border-color: rgb(209 213 219 / var(--tw-divide-opacity)); +} + .overflow-hidden { overflow: hidden; } @@ -806,6 +877,10 @@ video { overflow-y: auto; } +.whitespace-nowrap { + white-space: nowrap; +} + .rounded { border-radius: 0.25rem; } @@ -830,8 +905,16 @@ video { border-width: 1px; } -.border-l-4 { - border-left-width: 4px; +.border-2 { + border-width: 2px; +} + +.border-r-2 { + border-right-width: 2px; +} + +.border-b { + border-bottom-width: 1px; } .border-gray-300 { @@ -839,9 +922,13 @@ video { border-color: rgb(209 213 219 / var(--tw-border-opacity)); } -.border-red-500 { +.border-gray-200 { --tw-border-opacity: 1; - border-color: rgb(239 68 68 / var(--tw-border-opacity)); + border-color: rgb(229 231 235 / var(--tw-border-opacity)); +} + +.border-opacity-60 { + --tw-border-opacity: 0.6; } .bg-gray-50 { @@ -854,16 +941,21 @@ video { background-color: rgb(79 70 229 / var(--tw-bg-opacity)); } -.bg-red-100 { - --tw-bg-opacity: 1; - background-color: rgb(254 226 226 / var(--tw-bg-opacity)); -} - .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } +.bg-indigo-200 { + --tw-bg-opacity: 1; + background-color: rgb(199 210 254 / var(--tw-bg-opacity)); +} + +.bg-red-200 { + --tw-bg-opacity: 1; + background-color: rgb(254 202 202 / var(--tw-bg-opacity)); +} + .bg-gradient-to-tr { background-image: linear-gradient(to top right, var(--tw-gradient-stops)); } @@ -878,6 +970,16 @@ video { --tw-gradient-to: #9089fc var(--tw-gradient-to-position); } +.object-cover { + -o-object-fit: cover; + object-fit: cover; +} + +.object-center { + -o-object-position: center; + object-position: center; +} + .p-1 { padding: 0.25rem; } @@ -894,14 +996,14 @@ video { padding: 0.625rem; } -.p-4 { - padding: 1rem; -} - .p-6 { padding: 1.5rem; } +.p-4 { + padding: 1rem; +} + .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; @@ -947,10 +1049,24 @@ video { padding-bottom: 2rem; } +.px-4 { + padding-left: 1rem; + padding-right: 1rem; +} + +.py-4 { + padding-top: 1rem; + padding-bottom: 1rem; +} + .pt-14 { padding-top: 3.5rem; } +.pr-3 { + padding-right: 0.75rem; +} + .text-center { text-align: center; } @@ -980,6 +1096,11 @@ video { line-height: 1.75rem; } +.text-xs { + font-size: 0.75rem; + line-height: 1rem; +} + .font-bold { font-weight: 700; } @@ -1012,10 +1133,22 @@ video { line-height: 1.25; } +.leading-none { + line-height: 1; +} + +.leading-relaxed { + line-height: 1.625; +} + .tracking-tight { letter-spacing: -0.025em; } +.tracking-widest { + letter-spacing: 0.1em; +} + .text-black { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); @@ -1046,11 +1179,6 @@ video { color: rgb(79 70 229 / var(--tw-text-opacity)); } -.text-red-700 { - --tw-text-opacity: 1; - color: rgb(185 28 28 / var(--tw-text-opacity)); -} - .text-slate-500 { --tw-text-opacity: 1; color: rgb(100 116 139 / var(--tw-text-opacity)); @@ -1061,6 +1189,21 @@ video { color: rgb(255 255 255 / var(--tw-text-opacity)); } +.text-gray-400 { + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); +} + +.text-indigo-500 { + --tw-text-opacity: 1; + color: rgb(99 102 241 / var(--tw-text-opacity)); +} + +.text-red-400 { + --tw-text-opacity: 1; + color: rgb(248 113 113 / var(--tw-text-opacity)); +} + .opacity-30 { opacity: 0.3; } @@ -1287,6 +1430,22 @@ video { margin-top: 0px; } + .md\:mb-2 { + margin-bottom: 0.5rem; + } + + .md\:ml-0 { + margin-left: 0px; + } + + .md\:h-36 { + height: 9rem; + } + + .md\:w-1\/3 { + width: 33.333333%; + } + .md\:space-y-6 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse))); @@ -1300,6 +1459,14 @@ video { } @media (min-width: 1024px) { + .lg\:mb-0 { + margin-bottom: 0px; + } + + .lg\:ml-auto { + margin-left: auto; + } + .lg\:flex { display: flex; } @@ -1308,6 +1475,10 @@ video { display: none; } + .lg\:h-48 { + height: 12rem; + } + .lg\:flex-1 { flex: 1 1 0%; } diff --git a/web/inc/classes/Page.class.php b/web/inc/classes/Page.class.php index 7a049d3..b8f66db 100644 --- a/web/inc/classes/Page.class.php +++ b/web/inc/classes/Page.class.php @@ -94,7 +94,7 @@ class Page function renderPagecontent() { $controller_dir = ROOT . DS . 'pages' . DS . $this->_controller . DS; - $partials = []; + /*$partials = []; if(is_dir($controller_dir.'partials')) $partials[] = new Mustache_Loader_FilesystemLoader($controller_dir.'partials'); $partials[] = new Mustache_Loader_FilesystemLoader(ROOT.DS.DS.'templates'.DS.'partials'); @@ -102,18 +102,20 @@ class Page 'entity_flags' => ENT_QUOTES, 'partials_loader' => new Mustache_Loader_CascadingLoader($partials) )); - $this->variables['translate'] = function($value) { return translate($value); }; - - $m = $this->addHelpers($m); + $m = $this->addHelpers($m);*/ if($this->variables['template'] && file_exists(ROOT . DS . 'pages' . DS . $this->_controller . DS . $this->variables['template'])) - $template = file_get_contents(ROOT . DS . 'pages' . DS . $this->_controller . DS . $this->variables['template']); - else - $template = file_get_contents(ROOT . DS . 'views' . DS . 'defaultcontainer.mustache'); - + $templatefile = ROOT . DS . 'pages' . DS . $this->_controller . DS . $this->variables['template']; - $pagecontent = $m->render($template, $this->variables); + //render template by running include + ob_start(); + include($templatefile); + $pagecontent = ob_get_contents(); + ob_end_clean(); + + + //$pagecontent = $m->render($template, $this->variables); return $pagecontent; } diff --git a/web/pages/home/controller.php b/web/pages/home/controller.php index c3da843..14e2e68 100644 --- a/web/pages/home/controller.php +++ b/web/pages/home/controller.php @@ -11,7 +11,7 @@ class Home extends Page function index() { - $this->set('template', "home.mustache"); + $this->set('template', "home.html"); return $this->renderPagecontent(); } diff --git a/web/pages/home/home.html b/web/pages/home/home.html new file mode 100644 index 0000000..ac494cd --- /dev/null +++ b/web/pages/home/home.html @@ -0,0 +1,84 @@ + +
+

Dogstats - der Agilityhelfer

+

Anim aute id magna aliqua ad ad non deserunt sunt. + Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat fugiat aliqua.

+
+ Get + started + Learn more +
+
+ +
+
+
+
+ + + + + + + + + + + + + 1, 'name' => 'Max', 'email' => 'test@test.ts'], + ['id' => 2, 'name' => 'Roxie', 'email' => 'loxie@test.ts'], + ] as $user) : ?> + + + + + + + + + + + + +
+ ID + + Name + + Email + + Created_at + + Edit + + Delete +
+ + +
+ +
+ 		+
+ 		+ 2021-1-12 + + Edit + + Delete +
+
+
+
+
\ No newline at end of file diff --git a/web/pages/home/home.mustache b/web/pages/home/home.mustache deleted file mode 100644 index 906a223..0000000 --- a/web/pages/home/home.mustache +++ /dev/null @@ -1,20 +0,0 @@ - -
-

Dogstats - der Agilityhelfer

-

Anim aute id magna aliqua ad ad non deserunt sunt. - Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat fugiat aliqua.

-
- Get - started - Learn more -
-
\ No newline at end of file