Шаблон добавления страницы для Cotonti Siena (grid-модель)

Шаблон добавления страницы для Cotonti Siena (grid-модель)

Типовой шаблон добавления страницы с заменой табличной модели на grid-модель

<!-- BEGIN: MAIN -->
<main id="page_add" class="my-4">
	<div class="container">
		{FILE "{PHP.cfg.themes_dir}/{PHP.theme}/warnings.tpl"}
		<h2 class="mb-3">{PAGEADD_PAGETITLE}</h2>

		<form action="{PAGEADD_FORM_SEND}" enctype="multipart/form-data" method="post" name="pageform">
			<div class="d-md-grid mb-4" id="pageadmin">

				<div class="interim">
					<div>{PHP.L.Category}:</div>
					<div>{PAGEADD_FORM_CAT}</div>
				</div>
				<div class="interim">
					<div>{PHP.L.Title}:</div>
					<div>{PAGEADD_FORM_TITLE|cot_rc_modify($this, 'class="form-control"')}</div>
				</div>
				<div class="interim">
					<div>{PHP.L.Description}:</div>
					<div>{PAGEADD_FORM_DESCRIPTION|cot_rc_modify($this, 'class="form-control"')}</div>
				</div>
				<div class="interim">
					<div>{PHP.L.Begin}:</div>
					<div>{PAGEADD_FORM_BEGIN}</div>
				</div>
				<div class="interim">
					<div>{PHP.L.Expire}:</div>
					<div>{PAGEADD_FORM_EXPIRE}</div>
				</div>
				<div class="interim">
					<div>{PHP.L.Alias}:</div>
					<div>{PAGEADD_FORM_ALIAS|cot_rc_modify($this, 'class="form-control"')}</div>
				</div>
				<div class="interim">
					<div>{PHP.L.page_metatitle}:</div>
					<div>{PAGEADD_FORM_METATITLE|cot_rc_modify($this, 'class="form-control"')}</div>
				</div>
				<div class="interim">
					<div>{PHP.L.page_metadesc}:</div>
					<div>{PAGEADD_FORM_METADESC|cot_rc_modify($this, 'class="form-control"')}</div>
				</div>

				<!-- IF {PAGEADD_FORM_TAGS} -->
				<div class="interim">
					<div>{PAGEADD_TOP_TAGS}:</div>
					<div>{PAGEADD_FORM_TAGS} ({PAGEADD_TOP_TAGS_HINT})</div>
				</div>
				<!-- ENDIF -->

				<div class="interim">
					<div>{PHP.L.Owner}:</div>
					<div>{PAGEADD_FORM_OWNER}</div>
				</div>
				<div class="interim">
					<div>{PHP.L.Author}:</div>
					<div>{PAGEADD_FORM_AUTHOR|cot_rc_modify($this, 'class="form-control"')}</div>
				</div>
				<div class="interim">
					<div>{PHP.L.Parser}:</div>
					<div>{PAGEADD_FORM_PARSER|cot_rc_modify($this, 'class="form-control"')}</div>
				</div>
				<div class="interim">
					<div class="fullwidth px-0 py-3">{PAGEADD_FORM_TEXT}</div>
				</div>

				<div class="interim">
					<div class="fullwidth p-md-3 d-flex gap-2">
						<!-- IF {PHP.usr_can_publish} -->
						<button type="submit" name="rpagestate" value="0" class="btn btn-success btn-sm">
							{PHP.L.Publish}
						</button>
						<!-- ENDIF -->
						<button type="submit" name="rpagestate" value="2" class="btn btn-warning btn-sm">
							{PHP.L.Saveasdraft}
						</button>
						<button type="submit" name="rpagestate" value="1" class="btn btn-danger btn-sm">
							{PHP.L.Submitforapproval}
						</button>
					</div>
				</div>

			</div>
		</form>

	</div>
</main>

<style media="screen">
	div#pageadmin	{ grid-template-columns: 20% 80%; }
	div.interim		{ margin-bottom: .75rem; }
	div.interim > div:first-child	{ margin-bottom: .125rem; }

	span.select2	{ width: 100%!important; }

	@media (min-width: 768px) {
		div.interim	{ display: contents; }
		div.interim > div	{ padding: .5rem .75rem; }
		div.interim > div:first-child	{ margin-bottom: 0; }
		div.interim:nth-child(odd) > div	{ background: #f3f3f3; }
		div.interim:nth-child(even) > div	{ background: #fefefe; }
		div.fullwidth	{ grid-column: span 2; }
	}
</style>

<script>
	$(document).ready(function() {
		/* Stylize Form Select */
		$('form select').addClass('form-select').css({'width': 'auto', 'display': 'inline-block'});
		$('form select option').addClass('fs-6');
	});
</script>
<!-- END: MAIN -->