development refactoring

This commit is contained in:
Burak Civan 2022-12-07 17:20:25 +03:00
parent 7d88423e24
commit 5599b41fd3
10 changed files with 108 additions and 81 deletions

8
public/css/app.css vendored
View File

@ -57297,6 +57297,10 @@ body{
margin-top: 0px; margin-top: 0px;
} }
.lg\:-mt-16{
margin-top: -4rem;
}
.lg\:mb-0{ .lg\:mb-0{
margin-bottom: 0px; margin-bottom: 0px;
} }
@ -57413,6 +57417,10 @@ body{
width: 46.875rem; width: 46.875rem;
} }
.lg\:w-4\/5{
width: 80%;
}
.lg\:w-3\/5{ .lg\:w-3\/5{
width: 60%; width: 60%;
} }

View File

@ -1,82 +1,99 @@
/* content */
@media (min-width: 1024px) { @media (min-width: 1024px) {
.content-modal { .lg\:w-4\/5 {
width: 100%; width: 80%;
}
.lg\:-mt-16 {
margin-top: -4rem;
}
.lg\:flex {
display: flex;
} }
} }
.content-modal {
position: fixed;
width: 80%;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
margin-left: -0.25rem;
margin-right: -0.25rem;
z-index: 60;
top: 0px;
bottom: 0px;
background-color: rgb(252, 252, 252);
z-index: 60;
}
[dir="ltr"] .content-modal { [dir="ltr"] .ltr\:right-0 {
right: 0px; right: 0px;
} }
[dir="rtl"] .content-modal { [dir="rtl"] .ltr\:left-0 {
left: 0px; left: 0px;
} }
@media (min-width: 1024px) { .bg-body {
.content-modal img { background-color: #fcfcfc;
margin-top: -4rem;
}
} }
.content-modal img {
.justify-center {
justify-content: center;
}
.items-center {
align-items: center;
}
.items-start {
align-items: flex-start;
}
.w-full {
width: 100%;
}
.h-screen {
height: 100vh;
}
.-mx-1 {
margin-left: -0.25rem;
margin-right: -0.25rem;
}
.bottom-0 {
bottom: 0px;
}
.top-0 {
top: 0px;
}
.left-0 {
left: 0px;
}
.right-0 {
right: 0px;
}
.fixed {
position: fixed;
}
.absolute {
position: absolute;
}
.w-28 {
width: 7rem; width: 7rem;
height: 7rem;
} }
/* content */
/* absolute */ .h-28 {
@media (min-width: 1024px) {
.absolute-modal {
display: block;
}
}
.absolute-modal {
position: absolute;
width: 100%;
display: flex;
align-items: start;
justify-content: center;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
background-color: rgb(252, 252, 252);
z-index: 60;
}
.absolute-modal img {
width: 7rem;
height: 7rem; height: 7rem;
} }
/* absolute */
.material-icons-outlined { .material-icons-outlined {
font-family: 'Material Icons Outlined'; font-family: 'Material Icons Outlined';
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
font-size: 24px; font-size: 24px;
line-height: 1; line-height: 1;
letter-spacing: normal; letter-spacing: normal;
text-transform: none; text-transform: none;
display: inline-block; display: inline-block;
white-space: nowrap; white-space: nowrap;
word-wrap: normal; word-wrap: normal;
direction: ltr; direction: ltr;
-webkit-font-feature-settings: 'liga'; -webkit-font-feature-settings: 'liga';
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
} }

View File

@ -4,8 +4,6 @@
<head> <head>
@stack('head_start') @stack('head_start')
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
@ -17,6 +15,8 @@
<base href="{{ config('app.url') . '/' }}"> <base href="{{ config('app.url') . '/' }}">
<x-layouts.pwa.head /> <x-layouts.pwa.head />
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<!-- Favicon --> <!-- Favicon -->
<link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png"> <link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png">

View File

@ -5,8 +5,6 @@
<head> <head>
@stack('head_start') @stack('head_start')
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
@ -18,6 +16,8 @@
<x-layouts.pwa.head /> <x-layouts.pwa.head />
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<!-- Favicon --> <!-- Favicon -->
<link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png"> <link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png">

View File

@ -5,8 +5,6 @@
<head> <head>
@stack('head_start') @stack('head_start')
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
@ -18,6 +16,8 @@
<x-layouts.pwa.head /> <x-layouts.pwa.head />
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<!-- Favicon --> <!-- Favicon -->
<link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png"> <link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png">

View File

@ -5,8 +5,6 @@
<head> <head>
@stack('head_start') @stack('head_start')
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
@ -18,6 +16,8 @@
<x-layouts.pwa.head /> <x-layouts.pwa.head />
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<!-- Favicon --> <!-- Favicon -->
<link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png"> <link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png">

View File

@ -5,8 +5,6 @@
<head> <head>
@stack('head_start') @stack('head_start')
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
@ -18,6 +16,8 @@
<x-layouts.pwa.head /> <x-layouts.pwa.head />
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<!-- Favicon --> <!-- Favicon -->
<link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png"> <link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png">

View File

@ -5,8 +5,6 @@
<head> <head>
@stack('head_start') @stack('head_start')
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
@ -18,6 +16,8 @@
<x-layouts.pwa.head /> <x-layouts.pwa.head />
<link rel="stylesheet" href="{{ asset('public/css/custom_loading.css?v=' . version('short')) }}" type="text/css">
<!-- Favicon --> <!-- Favicon -->
<link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png"> <link rel="icon" href="{{ asset('public/img/favicon.ico') }}" type="image/png">

View File

@ -2,8 +2,9 @@
x-data="{ }" x-data="{ }"
x-init="document.querySelector('[data-modal-handle]') ? document.querySelectorAll('[data-modal-handle]').forEach((item) => { item.classList.add('invisible') }) : null, setTimeout(() => $refs.loadingAbsoluteContent.remove(), 1000), setTimeout(() => document.querySelector('[data-modal-handle]') ? document.querySelectorAll('[data-modal-handle]').forEach((item) => { item.classList.remove('invisible') }) : null , 1010)" x-init="document.querySelector('[data-modal-handle]') ? document.querySelectorAll('[data-modal-handle]').forEach((item) => { item.classList.add('invisible') }) : null, setTimeout(() => $refs.loadingAbsoluteContent.remove(), 1000), setTimeout(() => document.querySelector('[data-modal-handle]') ? document.querySelectorAll('[data-modal-handle]').forEach((item) => { item.classList.remove('invisible') }) : null , 1010)"
x-ref="loadingAbsoluteContent" x-ref="loadingAbsoluteContent"
class="absolute-modal" class="absolute w-full lg:flex items-start justify-center bg-body top-0 bottom-0 left-0 right-0 z-50"
style="z-index: 60;"
> >
<img src="{{ asset('public/img/akaunting-loading.gif') }}" alt="Akaunting" /> <img src="{{ asset('public/img/akaunting-loading.gif') }}" class="w-28 h-28" alt="Akaunting" />
</div> </div>
<!--data attr added because for none vue.js pages--> <!--data attr added because for none vue.js pages-->

View File

@ -2,8 +2,9 @@
x-data="{ }" x-data="{ }"
x-init="document.querySelector('[data-modal-handle]') ? document.querySelectorAll('[data-modal-handle]').forEach((item) => { item.classList.add('invisible') }) : null, setTimeout(() => $refs.loadingContent.remove(), 1000), setTimeout(() => document.querySelector('[data-modal-handle]') ? document.querySelectorAll('[data-modal-handle]').forEach((item) => { item.classList.remove('invisible') }) : null , 1010)" x-init="document.querySelector('[data-modal-handle]') ? document.querySelectorAll('[data-modal-handle]').forEach((item) => { item.classList.add('invisible') }) : null, setTimeout(() => $refs.loadingContent.remove(), 1000), setTimeout(() => document.querySelector('[data-modal-handle]') ? document.querySelectorAll('[data-modal-handle]').forEach((item) => { item.classList.remove('invisible') }) : null , 1010)"
x-ref="loadingContent" x-ref="loadingContent"
class="content-modal" class="fixed w-full lg:w-4/5 h-screen flex items-center justify-center bg-body top-0 bottom-0 ltr:right-0 rtl:left-0 -mx-1 z-50"
style="z-index: 60;"
> >
<img src="{{ asset('public/img/akaunting-loading.gif') }}" alt="Akaunting" /> <img src="{{ asset('public/img/akaunting-loading.gif') }}" class="w-28 h-28 lg:-mt-16" alt="Akaunting" />
</div> </div>
<!--data attr added because for none vue.js pages--> <!--data attr added because for none vue.js pages-->