Start implementing flexbox grid

This commit is contained in:
Dennis Eichhorn 2017-01-28 13:57:23 +01:00
parent ff106e04fc
commit 5c01bd782d
6 changed files with 360 additions and 292 deletions

View File

@ -19,7 +19,9 @@
echo $this->getData('nav')->render(); ?> echo $this->getData('nav')->render(); ?>
<section class="box w-33 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-6">
<section class="box wf-100">
<header><h1><?= $this->getText('Group') ?></h1></header> <header><h1><?= $this->getText('Group') ?></h1></header>
<div class="inner"> <div class="inner">
<form id="group-create" action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="<?= \phpOMS\Message\Http\RequestMethod::PUT; ?>"> <form id="group-create" action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="<?= \phpOMS\Message\Http\RequestMethod::PUT; ?>">
@ -38,8 +40,10 @@ echo $this->getData('nav')->render(); ?>
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-66 floatLeft"> <div class="col-xs-12 col-md-6">
<section class="box wf-100">
<header><h1><?= $this->getText('Parent') ?></h1></header> <header><h1><?= $this->getText('Parent') ?></h1></header>
<div class="inner"> <div class="inner">
<form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="post"> <form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="post">
@ -52,8 +56,10 @@ echo $this->getData('nav')->render(); ?>
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-66 floatLeft"> <div class="col-xs-12 col-md-6">
<section class="box wf-100">
<header><h1><?= $this->getText('Permissions') ?></h1></header> <header><h1><?= $this->getText('Permissions') ?></h1></header>
<div class="inner"> <div class="inner">
<form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="post"> <form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="post">
@ -66,3 +72,5 @@ echo $this->getData('nav')->render(); ?>
</form> </form>
</div> </div>
</section> </section>
</div>
</div>

View File

@ -26,8 +26,9 @@ $footerView->setResults($this->getData('list:count') ?? 1);
echo $this->getData('nav')->render(); ?> echo $this->getData('nav')->render(); ?>
<div class="box w-100"> <div class="row">
<table class="table"> <div class="col-xs-12">
<table class="box table">
<caption><?= $this->getText('Groups'); ?></caption> <caption><?= $this->getText('Groups'); ?></caption>
<thead> <thead>
<tr> <tr>
@ -53,3 +54,4 @@ echo $this->getData('nav')->render(); ?>
<?php endif; ?> <?php endif; ?>
</table> </table>
</div> </div>
</div>

View File

@ -35,7 +35,7 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
?> ?>
<div class="tabular-2"> <div class="tabular-2">
<div class="box"> <div class="box wf-100">
<ul class="tab-links"> <ul class="tab-links">
<li><label for="c-tab-1"><?= $this->getText('General') ?></label></li> <li><label for="c-tab-1"><?= $this->getText('General') ?></label></li>
<li><label for="c-tab-2"><?= $this->getText('Localization') ?></label></li> <li><label for="c-tab-2"><?= $this->getText('Localization') ?></label></li>
@ -44,7 +44,9 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
<div class="tab-content"> <div class="tab-content">
<input type="radio" id="c-tab-1" name="tabular-2" checked> <input type="radio" id="c-tab-1" name="tabular-2" checked>
<div class="tab"> <div class="tab">
<section class="box w-50 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-6">
<section class="box wf-100">
<header><h1><?= $this->getText('Settings') ?></h1></header> <header><h1><?= $this->getText('Settings') ?></h1></header>
<div class="inner"> <div class="inner">
<form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/settings/general'); ?>" method="post"> <form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/settings/general'); ?>" method="post">
@ -60,9 +62,13 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</div> </div>
</section> </section>
</div> </div>
</div>
</div>
<input type="radio" id="c-tab-2" name="tabular-2"> <input type="radio" id="c-tab-2" name="tabular-2">
<div class="tab"> <div class="tab">
<section class="box w-33 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Localization') ?></h1></header> <header><h1><?= $this->getText('Localization') ?></h1></header>
<div class="inner"> <div class="inner">
<form id="fLocalization" action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/settings/localization'); ?>" method="post"> <form id="fLocalization" action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/settings/localization'); ?>" method="post">
@ -100,8 +106,10 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-33 floatLeft"> <div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Numeric') ?></h1></header> <header><h1><?= $this->getText('Numeric') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -121,8 +129,10 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-33 floatLeft"> <div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Weight') ?></h1></header> <header><h1><?= $this->getText('Weight') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -147,8 +157,12 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
</div>
<section class="box w-33 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Speed') ?></h1></header> <header><h1><?= $this->getText('Speed') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -176,8 +190,10 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-33 floatLeft"> <div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Length') ?></h1></header> <header><h1><?= $this->getText('Length') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -205,8 +221,10 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-33 floatLeft"> <div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Area') ?></h1></header> <header><h1><?= $this->getText('Area') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -231,8 +249,12 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
</div>
<section class="box w-33 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Volume') ?></h1></header> <header><h1><?= $this->getText('Volume') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -269,3 +291,5 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</div> </div>
</div> </div>
</div> </div>
</div>
</div>

View File

@ -19,7 +19,9 @@
echo $this->getData('nav')->render(); ?> echo $this->getData('nav')->render(); ?>
<section class="box w-33 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-6">
<section class="box wf-100">
<header><h1><?= $this->getText('Group') ?></h1></header> <header><h1><?= $this->getText('Group') ?></h1></header>
<div class="inner"> <div class="inner">
<form id="group-create" action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="<?= \phpOMS\Message\Http\RequestMethod::PUT; ?>"> <form id="group-create" action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="<?= \phpOMS\Message\Http\RequestMethod::PUT; ?>">
@ -38,8 +40,10 @@ echo $this->getData('nav')->render(); ?>
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-66 floatLeft"> <div class="col-xs-12 col-md-6">
<section class="box wf-100">
<header><h1><?= $this->getText('Parent') ?></h1></header> <header><h1><?= $this->getText('Parent') ?></h1></header>
<div class="inner"> <div class="inner">
<form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="post"> <form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="post">
@ -52,8 +56,10 @@ echo $this->getData('nav')->render(); ?>
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-66 floatLeft"> <div class="col-xs-12 col-md-6">
<section class="box wf-100">
<header><h1><?= $this->getText('Permissions') ?></h1></header> <header><h1><?= $this->getText('Permissions') ?></h1></header>
<div class="inner"> <div class="inner">
<form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="post"> <form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/group'); ?>" method="post">
@ -66,3 +72,5 @@ echo $this->getData('nav')->render(); ?>
</form> </form>
</div> </div>
</section> </section>
</div>
</div>

View File

@ -26,8 +26,9 @@ $footerView->setResults($this->getData('list:count') ?? 1);
echo $this->getData('nav')->render(); ?> echo $this->getData('nav')->render(); ?>
<div class="box w-100"> <div class="row">
<table class="table"> <div class="col-xs-12">
<table class="box table">
<caption><?= $this->getText('Groups'); ?></caption> <caption><?= $this->getText('Groups'); ?></caption>
<thead> <thead>
<tr> <tr>
@ -53,3 +54,4 @@ echo $this->getData('nav')->render(); ?>
<?php endif; ?> <?php endif; ?>
</table> </table>
</div> </div>
</div>

View File

@ -35,7 +35,7 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
?> ?>
<div class="tabular-2"> <div class="tabular-2">
<div class="box"> <div class="box wf-100">
<ul class="tab-links"> <ul class="tab-links">
<li><label for="c-tab-1"><?= $this->getText('General') ?></label></li> <li><label for="c-tab-1"><?= $this->getText('General') ?></label></li>
<li><label for="c-tab-2"><?= $this->getText('Localization') ?></label></li> <li><label for="c-tab-2"><?= $this->getText('Localization') ?></label></li>
@ -44,7 +44,9 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
<div class="tab-content"> <div class="tab-content">
<input type="radio" id="c-tab-1" name="tabular-2" checked> <input type="radio" id="c-tab-1" name="tabular-2" checked>
<div class="tab"> <div class="tab">
<section class="box w-50 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-6">
<section class="box wf-100">
<header><h1><?= $this->getText('Settings') ?></h1></header> <header><h1><?= $this->getText('Settings') ?></h1></header>
<div class="inner"> <div class="inner">
<form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/settings/general'); ?>" method="post"> <form action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/settings/general'); ?>" method="post">
@ -60,9 +62,13 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</div> </div>
</section> </section>
</div> </div>
</div>
</div>
<input type="radio" id="c-tab-2" name="tabular-2"> <input type="radio" id="c-tab-2" name="tabular-2">
<div class="tab"> <div class="tab">
<section class="box w-33 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Localization') ?></h1></header> <header><h1><?= $this->getText('Localization') ?></h1></header>
<div class="inner"> <div class="inner">
<form id="fLocalization" action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/settings/localization'); ?>" method="post"> <form id="fLocalization" action="<?= \phpOMS\Uri\UriFactory::build('/{/lang}/api/admin/settings/localization'); ?>" method="post">
@ -100,8 +106,10 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-33 floatLeft"> <div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Numeric') ?></h1></header> <header><h1><?= $this->getText('Numeric') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -121,8 +129,10 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-33 floatLeft"> <div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Weight') ?></h1></header> <header><h1><?= $this->getText('Weight') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -147,8 +157,12 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
</div>
<section class="box w-33 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Speed') ?></h1></header> <header><h1><?= $this->getText('Speed') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -176,8 +190,10 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-33 floatLeft"> <div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Length') ?></h1></header> <header><h1><?= $this->getText('Length') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -205,8 +221,10 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
<section class="box w-33 floatLeft"> <div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Area') ?></h1></header> <header><h1><?= $this->getText('Area') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -231,8 +249,12 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</form> </form>
</div> </div>
</section> </section>
</div>
</div>
<section class="box w-33 floatLeft"> <div class="row">
<div class="col-xs-12 col-md-4">
<section class="box wf-100">
<header><h1><?= $this->getText('Volume') ?></h1></header> <header><h1><?= $this->getText('Volume') ?></h1></header>
<div class="inner"> <div class="inner">
<form> <form>
@ -269,3 +291,5 @@ $currencies = \phpOMS\Localization\ISO4217Enum::getConstants();
</div> </div>
</div> </div>
</div> </div>
</div>
</div>