diff --git a/plugins/Installation/stylesheets/installation.css b/plugins/Installation/stylesheets/installation.css index a66fb80fea86f7ace7a0d51d3b7948b6e00a2a58..759461f6b96b143360c6cc3fc941efbe6c6b805a 100644 --- a/plugins/Installation/stylesheets/installation.css +++ b/plugins/Installation/stylesheets/installation.css @@ -65,16 +65,9 @@ p.next-step:first-child { margin-top: 0; } -table { - margin: 20px 0; - width: 100%; -} -th, td { - border-top: 1px solid #cccccc; - padding: 8px; -} -tr:nth-of-type(odd) { - background-color: #FAFAFA; +/* This rule is duplicated here from systemCheckPage.less */ +.system-check td:first-child { + width: 40%; } /* Form classes that we can't change */ diff --git a/plugins/Installation/stylesheets/systemCheckPage.less b/plugins/Installation/stylesheets/systemCheckPage.less index 3c5f6ddfa04ed9b80619ff8f2daa15e3f70e3ceb..007671e849bb2c3e079fccc7c30ca1ee826f99e6 100755 --- a/plugins/Installation/stylesheets/systemCheckPage.less +++ b/plugins/Installation/stylesheets/systemCheckPage.less @@ -1,24 +1,5 @@ -#systemCheckOptional, -#systemCheckRequired { - width: 100%; - max-width: 900px; -} - -#systemCheckOptional { - margin-bottom: 2em; -} - -#systemCheckOptional td, -#systemCheckRequired td { - padding: 1em .5em 1em 2em; - vertical-align: middle; - margin: 0; - min-width: 200px; -} - -#systemCheckOptional tr, -#systemCheckRequired tr { - background-color: #f2f2f2; +.system-check td:first-child { + width: 40%; } .error { diff --git a/plugins/Installation/templates/_systemCheckSection.twig b/plugins/Installation/templates/_systemCheckSection.twig index c1f8c14332c723f6a646a648299bcd4dc86c97a4..2e8aaac1804bec7445bf8738ac7b7c1a9048b1fc 100755 --- a/plugins/Installation/templates/_systemCheckSection.twig +++ b/plugins/Installation/templates/_systemCheckSection.twig @@ -1,12 +1,12 @@ {% import _self as local %} -<table class="infosServer" id="systemCheckRequired"> +<table class="simple-table system-check" id="systemCheckRequired"> {{ local.diagnosticTable(diagnosticReport.getMandatoryDiagnosticResults()) }} </table> <h3>{{ 'Installation_Optional'|translate }}</h3> -<table class="infos" id="systemCheckOptional"> +<table class="simple-table system-check" id="systemCheckOptional"> {{ local.diagnosticTable(diagnosticReport.getOptionalDiagnosticResults()) }} </table> @@ -21,7 +21,7 @@ {% for result in results %} <tr> - <td class="label">{{ result.label }}</td> + <td>{{ result.label }}</td> <td> {% for item in result.items %} diff --git a/plugins/Morpheus/stylesheets/base.less b/plugins/Morpheus/stylesheets/base.less index 54cb655df59898cd18424aeee02e8f635cca8631..97f02fa3248a82497df7e67ee99ee23d27e9dce5 100644 --- a/plugins/Morpheus/stylesheets/base.less +++ b/plugins/Morpheus/stylesheets/base.less @@ -35,6 +35,7 @@ @import "../../CoreHome/stylesheets/_donate.less"; @import "ui/_code"; +@import "ui/_tables"; @import "ui/_alerts"; @import "ui/_list-group"; @import "ui/_progress-bars"; diff --git a/plugins/Morpheus/stylesheets/ui/_tables.less b/plugins/Morpheus/stylesheets/ui/_tables.less new file mode 100644 index 0000000000000000000000000000000000000000..a96cc83b24f5631243a9a49b9caaafe4efdf9882 --- /dev/null +++ b/plugins/Morpheus/stylesheets/ui/_tables.less @@ -0,0 +1,16 @@ +// We have to use a class (and not <table> directly) because HTML tables +// are used for layouts (e.g. forms in the admin section use tables) +// TODO refactor that: https://github.com/piwik/piwik/issues/8023 +.simple-table { + margin: 20px 0; + width: 100%; + border-top: 1px solid @theme-color-border; + + th, td { + border-bottom: 1px solid @theme-color-border; + padding: 14px; + } + th { + text-align: left; + } +} diff --git a/plugins/Morpheus/templates/demo.twig b/plugins/Morpheus/templates/demo.twig index 94df4e00b3be0853232192696aeda71c9498a551..ec6d541f90c1a5a2e67c6545ff4910bdead7f1c6 100644 --- a/plugins/Morpheus/templates/demo.twig +++ b/plugins/Morpheus/templates/demo.twig @@ -298,6 +298,9 @@ </tbody> </table> </div> + <div class="demo-code"> + <pre><table>...</table></pre> + </div> </div> diff --git a/plugins/Morpheus/templates/genericForm.twig b/plugins/Morpheus/templates/genericForm.twig index cbbf13a7d8eea3e66b15372a7f554ceb423db380..466387fac15dcf8faec5b9d586a35fce38969208 100644 --- a/plugins/Morpheus/templates/genericForm.twig +++ b/plugins/Morpheus/templates/genericForm.twig @@ -11,7 +11,7 @@ <form {{ form_data.attributes|raw }}> <div class="centrer"> - <table class="centrer"> + <table class="centrer simple-table"> {% for fieldname in element_list %} {% if form_data[fieldname].type == 'checkbox' %} <tr>