diff --git a/system/typemill/Models/Extension.php b/system/typemill/Models/Extension.php index 21096bc..cf0151c 100644 --- a/system/typemill/Models/Extension.php +++ b/system/typemill/Models/Extension.php @@ -87,11 +87,17 @@ class Extension $themeSettings = $this->storage->getYaml('themesFolder', $themeName, $themeName . '.yaml'); # add standard-textarea for custom css - $themeSettings['forms']['fields']['customcss'] = [ - 'type' => 'codearea', - 'label' => Translations::translate('Custom CSS'), - 'class' => 'codearea', - 'description' => Translations::translate('You can overwrite the theme-css with your own css here.') + $themeSettings['forms']['fields']['fieldsetcss'] = [ + 'type' => 'fieldset', + 'legend' => Translations::translate('Custom CSS'), + 'fields' => [ + 'customcss' => [ + 'type' => 'codearea', + 'label' => Translations::translate('Add your individual CSS'), + 'class' => 'codearea', + 'description' => Translations::translate('You can overwrite the theme-css with your own css here.') + ] + ] ]; $themeSettings['preview'] = '/themes/' . $themeName . '/' . $themeName . '.png'; diff --git a/system/typemill/author/css/custom.css b/system/typemill/author/css/custom.css index 3eddfb6..7a214bc 100644 --- a/system/typemill/author/css/custom.css +++ b/system/typemill/author/css/custom.css @@ -57,8 +57,21 @@ opacity: 0; } +.accordion-enter-active, .accordion-leave-active { + transition: max-height 0.5s ease, padding 0.5s ease; + overflow: hidden; +} - .editableinput { +.accordion-enter, .accordion-leave-to { + max-height: 0; + padding: 0; +} + +.accordion-content { + overflow: hidden; +} + +.editableinput { border: none; outline: none; background-color: transparent; diff --git a/system/typemill/author/css/output.css b/system/typemill/author/css/output.css index 701d534..569cb67 100644 --- a/system/typemill/author/css/output.css +++ b/system/typemill/author/css/output.css @@ -718,18 +718,6 @@ video { top: 2.5rem; } -.left-1 { - left: 0.25rem; -} - -.right-1 { - right: 0.25rem; -} - -.bottom-1 { - bottom: 0.25rem; -} - .z-10 { z-index: 10; } @@ -746,6 +734,10 @@ video { float: right; } +.float-left { + float: left; +} + .m-0 { margin: 0px; } @@ -898,14 +890,14 @@ video { margin-top: 1rem; } -.mt-7 { - margin-top: 1.75rem; -} - .mt-auto { margin-top: auto; } +.mt-7 { + margin-top: 1.75rem; +} + .block { display: block; } @@ -982,10 +974,6 @@ video { height: 12rem; } -.h-64 { - height: 16rem; -} - .h-40 { height: 10rem; } @@ -1130,10 +1118,6 @@ video { flex-grow: 1; } -.grow { - flex-grow: 1; -} - .border-collapse { border-collapse: collapse; } @@ -1412,6 +1396,16 @@ video { border-top-color: rgb(255 255 255 / var(--tw-border-opacity)); } +.border-t-black { + --tw-border-opacity: 1; + border-top-color: rgb(0 0 0 / var(--tw-border-opacity)); +} + +.border-b-black { + --tw-border-opacity: 1; + border-bottom-color: rgb(0 0 0 / var(--tw-border-opacity)); +} + .bg-teal-600 { --tw-bg-opacity: 1; background-color: rgb(13 148 136 / var(--tw-bg-opacity)); @@ -1480,6 +1474,11 @@ video { background-color: rgb(234 179 8 / var(--tw-bg-opacity)); } +.bg-stone-300 { + --tw-bg-opacity: 1; + background-color: rgb(214 211 209 / var(--tw-bg-opacity)); +} + .bg-opacity-90 { --tw-bg-opacity: 0.9; } @@ -2356,10 +2355,6 @@ video { width: 25%; } - .lg\:w-full { - width: 100%; - } - .lg\:flex-row { flex-direction: row; } diff --git a/system/typemill/author/js/vue-themes.js b/system/typemill/author/js/vue-themes.js index 3578cd8..0b19ccb 100644 --- a/system/typemill/author/js/vue-themes.js +++ b/system/typemill/author/js/vue-themes.js @@ -86,17 +86,21 @@ const app = Vue.createApp({
{{ page.meta.description }}
+ {{ page.meta.shorttitle }} +