Skip to content
Snippets Groups Projects
Commit 0ba0257b authored by Marko Ivancic's avatar Marko Ivancic
Browse files

GUI tweaks

parent 585dee1a
No related branches found
No related tags found
1 merge request!2GUI tweaks
Showing
with 8440 additions and 4474 deletions
This diff is collapsed.
...@@ -157,13 +157,13 @@ $config = [ ...@@ -157,13 +157,13 @@ $config = [
* *
* Maximum execution time for the job runner. You can use this option to limit job runner activity by combining * Maximum execution time for the job runner. You can use this option to limit job runner activity by combining
* when the job runner will run (using cron configuration) and how long the job runner will be active * when the job runner will run (using cron configuration) and how long the job runner will be active
* (execution time). This can be null, meaning it will run indefinitely, or can be set as a duration * (execution time). This can be false, meaning it will run indefinitely, or can be set as a duration
* for DateInterval, examples being below. Note that when the job runner is run using Cron user * for DateInterval, examples being below. Note that when the job runner is run using Cron user
* interface in SimpleSAMLphp, the duration will be taken from the 'max_execution_time' ini * interface in SimpleSAMLphp, the duration will be taken from the 'max_execution_time' ini
* setting, and will override this setting if ini setting is shorter. * setting, and will override this setting if ini setting is shorter.
* @see https://www.php.net/manual/en/dateinterval.construct.php * @see https://www.php.net/manual/en/dateinterval.construct.php
*/ */
ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => null, ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => false,
//ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => 'PT9M', // 9 minutes //ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => 'PT9M', // 9 minutes
//ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => 'PT59M', // 59 minutes //ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => 'PT59M', // 59 minutes
//ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => 'P1D', // 1 day //ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => 'P1D', // 1 day
...@@ -172,7 +172,7 @@ $config = [ ...@@ -172,7 +172,7 @@ $config = [
* Number of processed jobs after which the job runner should take a 1-second pause. * Number of processed jobs after which the job runner should take a 1-second pause.
* *
* This option was introduced so that the job runner can act in a more resource friendly fashion when facing * This option was introduced so that the job runner can act in a more resource friendly fashion when facing
* backend store. If the value is null, there will be no pause. * backend store. If the value is false, there will be no pause.
*/ */
ModuleConfiguration::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED => 10, ModuleConfiguration::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED => 10,
......
This diff is collapsed.
#, fuzzy
msgid ""
msgstr ""
"Project-Id-Version: SimpleSAMLphp 2.0.0\n"
"Report-Msgid-Bugs-To: simplesamlphp-translation@googlegroups.com\n"
"POT-Creation-Date: 2016-10-12 09:31+0200\n"
"PO-Revision-Date: 2022-01-09 12:14+0200\n"
"Last-Translator: Marko Ivancic <mivanci@srce.hr\n"
"Language: hr\n"
"Language-Team: \n"
"Plural-Forms: nplurals=2; plural=(n != 1)\n"
"MIME-Version: 1.0\n"
"Content-Type: text/plain; charset=utf-8\n"
"Content-Transfer-Encoding: 8bit\n"
"Generated-By: Babel 2.3.4\n"
msgid "Accounting"
msgstr "Accounting"
msgid "Activity"
msgstr "Aktivnost"
msgid "Time"
msgstr "Vrijeme"
msgid "Access"
msgstr "Pristup"
msgid "Sent data"
msgstr "Poslani podaci"
\ No newline at end of file
...@@ -8,7 +8,6 @@ class NetworkHelper ...@@ -8,7 +8,6 @@ class NetworkHelper
{ {
public function resolveClientIpAddress(string $clientIpAddress = null): ?string public function resolveClientIpAddress(string $clientIpAddress = null): ?string
{ {
/** @var string|null $clientIpAddress */
$clientIpAddress = $clientIpAddress ?? $clientIpAddress = $clientIpAddress ??
$_SERVER['HTTP_CLIENT_IP'] ?? $_SERVER['HTTP_CLIENT_IP'] ??
$_SERVER['HTTP_X_FORWARDED_FOR'] ?? $_SERVER['HTTP_X_FORWARDED_FOR'] ??
......
...@@ -87,7 +87,7 @@ class ModuleConfiguration ...@@ -87,7 +87,7 @@ class ModuleConfiguration
{ {
$value = $this->get(self::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME); $value = $this->get(self::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME);
if (is_null($value)) { if ($value === false) {
return null; return null;
} }
...@@ -109,13 +109,13 @@ class ModuleConfiguration ...@@ -109,13 +109,13 @@ class ModuleConfiguration
{ {
$value = $this->get(self::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED); $value = $this->get(self::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED);
if (is_null($value)) { if ($value === false) {
return null; return null;
} }
if (! is_int($value)) { if (! is_int($value)) {
$message = sprintf( $message = sprintf(
'Option \'%s\' must be defined either as null, or positive integer.', 'Option \'%s\' must be defined either as false, or positive integer.',
self::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED self::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED
); );
throw new InvalidConfigurationException($message); throw new InvalidConfigurationException($message);
...@@ -465,7 +465,6 @@ class ModuleConfiguration ...@@ -465,7 +465,6 @@ class ModuleConfiguration
public function getTrackerDataRetentionPolicy(): ?DateInterval public function getTrackerDataRetentionPolicy(): ?DateInterval
{ {
/** @var string|null $value */
$value = $this->getConfiguration() $value = $this->getConfiguration()
->getOptionalString(self::OPTION_TRACKER_DATA_RETENTION_POLICY, null); ->getOptionalString(self::OPTION_TRACKER_DATA_RETENTION_POLICY, null);
......
...@@ -99,17 +99,6 @@ class Tracker implements AuthenticationDataTrackerInterface, AuthenticationDataP ...@@ -99,17 +99,6 @@ class Tracker implements AuthenticationDataTrackerInterface, AuthenticationDataP
{ {
$dateTime = (new DateTimeImmutable())->sub($retentionPolicy); $dateTime = (new DateTimeImmutable())->sub($retentionPolicy);
if ($dateTime === false) {
// @codeCoverageIgnoreStart
$message = sprintf(
'Could not create DateTime instance for data retention policy enforcement. Retention policy was: %s.',
var_export($retentionPolicy, true)
);
$this->logger->error($message);
throw new InvalidConfigurationException($message);
// @codeCoverageIgnoreEnd
}
$this->dataStore->deleteDataOlderThan($dateTime); $this->dataStore->deleteDataOlderThan($dateTime);
} }
} }
...@@ -8,6 +8,12 @@ ...@@ -8,6 +8,12 @@
<link rel="stylesheet" href="{{ asset('css/src/default.css', 'accounting') }}"> <link rel="stylesheet" href="{{ asset('css/src/default.css', 'accounting') }}">
<link rel="icon" href="{{ asset("icons/favicon.ico") }}"> <link rel="icon" href="{{ asset("icons/favicon.ico") }}">
<meta name="robots" content="noindex, nofollow"> <meta name="robots" content="noindex, nofollow">
<script>
function doPopup(popupId) {
var popup = document.getElementById(popupId);
popup.classList.toggle("show");
}
</script>
</head> </head>
<body id="{{ templateId }}"> <body id="{{ templateId }}">
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<span class="navicon"> <span class="navicon">
<img src="{{ asset('css/src/icons/prof-page.svg', 'accounting') }}" alt="Profile Page Icon"/> <img src="{{ asset('css/src/icons/prof-page.svg', 'accounting') }}" alt="Profile Page Icon"/>
</span> </span>
<span>{{ 'Personal Data'|trans }}</span> <span class="navlabel">{{ 'Personal Data'|trans }}</span>
</a> </a>
</li> </li>
<li> <li>
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
<img src="{{ asset('css/src/icons/conn-orgs.svg', 'accounting') }}" <img src="{{ asset('css/src/icons/conn-orgs.svg', 'accounting') }}"
alt="Connected Organizations Icon"/> alt="Connected Organizations Icon"/>
</span> </span>
<span>{{ 'Connected Organizations'|trans }}</span> <span class="navlabel">{{ 'Connected Organizations'|trans }}</span>
</a> </a>
</li> </li>
<li> <li>
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
<span class="navicon"> <span class="navicon">
<img src="{{ asset('css/src/icons/activity.svg', 'accounting') }}" alt="Activity Icon"/> <img src="{{ asset('css/src/icons/activity.svg', 'accounting') }}" alt="Activity Icon"/>
</span> </span>
<span>{{ 'Activity'|trans }}</span> <span class="navlabel">{{ 'Activity'|trans }}</span>
</a> </a>
</li> </li>
<li> <li>
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
<span class="navicon"> <span class="navicon">
<img src="{{ asset('css/src/icons/logout.svg', 'accounting') }}" alt="Logout Icon"/> <img src="{{ asset('css/src/icons/logout.svg', 'accounting') }}" alt="Logout Icon"/>
</span> </span>
<span>{{ 'Log out'|trans }}</span> <span class="navlabel">{{ 'Log out'|trans }}</span>
</a> </a>
</li> </li>
</ul> </ul>
......
...@@ -36,13 +36,11 @@ ...@@ -36,13 +36,11 @@
<ul><li>{{ activity.getClientIpAddress|default(' / ') }}</li></ul> <ul><li>{{ activity.getClientIpAddress|default(' / ') }}</li></ul>
<strong>{{ 'Information transfered to service'|trans }}</strong> <strong>{{ 'Information transfered to service'|trans }}</strong>
<ul> {% for name, value in activity.getUser.getAttributes %}
{% for name, value in activity.getUser.getAttributes %} <span class="label">
<li> {{ name|trans }}: {{ value|join(', ') }}
{{ name|trans }}: {{ value|join(', ') }} </span>
</li> {% endfor %}
{% endfor %}
</ul>
</div> </div>
</td> </td>
</tr> </tr>
......
...@@ -36,13 +36,13 @@ ...@@ -36,13 +36,13 @@
</ul> </ul>
<strong>{{ 'Information transfered to service'|trans }}</strong> <strong>{{ 'Information transfered to service'|trans }}</strong>
<ul>
{% for name, value in connectedServiceProvider.getUser.getAttributes %} {% for name, value in connectedServiceProvider.getUser.getAttributes %}
<li> <span class="label">
{{ name|trans }}: {{ value|join(', ') }} {{ name|trans }}: {{ value|join(', ') }}
</li> </span>
{% endfor %} {% endfor %}
</ul>
<strong>{{ 'Login details'|trans }}</strong> <strong>{{ 'Login details'|trans }}</strong>
<ul> <ul>
......
...@@ -25,9 +25,15 @@ ...@@ -25,9 +25,15 @@
<tr> <tr>
<td> <td>
{{ name|trans }} {{ name|trans }}
<a href="#"><img src="{{ asset('css/src/icons/i.svg', 'accounting') }}" alt="Info icon"></a> <div class="popup" onclick="doPopup('popup-{{ name }}')">
<img src="{{ asset('css/src/icons/i.svg', 'accounting') }}" alt="Info icon"/>
{% set helpId = 'help-attribute-' ~ name %}
<span class="popuptext" id="popup-{{ name }}">
{{ helpId|trans }}
</span>
</div>
</td> </td>
<td>{{ value }}</td> <td><span class="label">{{ value }}</span></td>
</tr> </tr>
{% endfor %} {% endfor %}
</table> </table>
......
...@@ -48,7 +48,7 @@ $config = [ ...@@ -48,7 +48,7 @@ $config = [
], ],
], ],
ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => null, ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => false,
ModuleConfiguration::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED => 10, ModuleConfiguration::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED => 10,
......
...@@ -219,7 +219,7 @@ class ModuleConfigurationTest extends TestCase ...@@ -219,7 +219,7 @@ class ModuleConfigurationTest extends TestCase
{ {
$moduleConfiguration = new ModuleConfiguration( $moduleConfiguration = new ModuleConfiguration(
null, null,
[ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => false] [ModuleConfiguration::OPTION_JOB_RUNNER_MAXIMUM_EXECUTION_TIME => []]
); );
$this->expectException(InvalidConfigurationException::class); $this->expectException(InvalidConfigurationException::class);
...@@ -255,7 +255,7 @@ class ModuleConfigurationTest extends TestCase ...@@ -255,7 +255,7 @@ class ModuleConfigurationTest extends TestCase
{ {
$moduleConfiguration = new ModuleConfiguration( $moduleConfiguration = new ModuleConfiguration(
null, null,
[ModuleConfiguration::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED => null] [ModuleConfiguration::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED => false]
); );
$this->assertNull($moduleConfiguration->getJobRunnerShouldPauseAfterNumberOfJobsProcessed()); $this->assertNull($moduleConfiguration->getJobRunnerShouldPauseAfterNumberOfJobsProcessed());
...@@ -268,7 +268,7 @@ class ModuleConfigurationTest extends TestCase ...@@ -268,7 +268,7 @@ class ModuleConfigurationTest extends TestCase
{ {
$moduleConfiguration = new ModuleConfiguration( $moduleConfiguration = new ModuleConfiguration(
null, null,
[ModuleConfiguration::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED => false] [ModuleConfiguration::OPTION_JOB_RUNNER_SHOULD_PAUSE_AFTER_NUMBER_OF_JOBS_PROCESSED => []]
); );
$this->expectException(InvalidConfigurationException::class); $this->expectException(InvalidConfigurationException::class);
......
...@@ -2,31 +2,31 @@ ...@@ -2,31 +2,31 @@
/* */ /* */
--main-text-c: #181E3C; --main-text-c: #181E3C;
--main-bg-c: #F5F5F5; --main-bg-c: #F5F5F5;
--heading-text-c: #5B6186; --heading-text-c: #5B6186;
--caption-bg-c: #F0F2F9; --caption-bg-c: #F0F2F9;
--table-border: #F0F2F9; --table-border: #F0F2F9;
--nav-bg-c: #F8F8FC; --nav-bg-c: #F8F8FC;
--button-bg-c: #4859B2; --button-bg-c: #4859B2;
--button-text-c: #ffffff; --button-text-c: #ffffff;
--link-c: #4859B2; --link-c: #4859B2;
--main-font-family: Raleway; --main-font-family: Raleway;
--main-font-weight: 500; --main-font-weight: 500;
--mainfont-size: 18pt; --main-font-size: 18pt;
--table-font-size: 18pt; --table-font-size: 16pt;
--large-font-size: 24px; --large-font-size: 24px;
} }
/* raleway-300 - latin-ext_latin */ /* raleway-300 - latin-ext_latin */
@font-face { @font-face {
font-family: 'Raleway'; font-family: 'Raleway';
font-style: normal; font-style: normal;
font-weight: 300; font-weight: 300;
...@@ -61,12 +61,12 @@ ...@@ -61,12 +61,12 @@
url('fonts/raleway-v28-latin-ext_latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('fonts/raleway-v28-latin-ext_latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('fonts/raleway-v28-latin-ext_latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ url('fonts/raleway-v28-latin-ext_latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
} }
/* ======================= */ /* ======================= */
/* mobile-first body */ /* mobile-first body */
/* ======================= */ /* ======================= */
body { body {
display: grid; display: grid;
grid-template-rows: 4em auto auto auto auto; grid-template-rows: 4em auto auto auto auto;
grid-template-columns: 1fr 18fr 1fr; grid-template-columns: 1fr 18fr 1fr;
...@@ -81,13 +81,13 @@ body { ...@@ -81,13 +81,13 @@ body {
font-family: var(--main-font-family); font-family: var(--main-font-family);
font-weight: var(--main-font-weight); font-weight: var(--main-font-weight);
margin: 0; margin: 0;
} }
/* ======================= */ /* ======================= */
/* header and logo */ /* header and logo */
/* ======================= */ /* ======================= */
header { header {
grid-area: header; grid-area: header;
background-color: var(--nav-bg-c); background-color: var(--nav-bg-c);
color: var(--link-c); color: var(--link-c);
...@@ -98,125 +98,132 @@ header { ...@@ -98,125 +98,132 @@ header {
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
} }
#logo { #logo {
margin-left: 2em; margin-left: 2em;
} }
/* ======================= */ /* ======================= */
/* Nav with hamburger menu */ /* Nav with hamburger menu */
/* ======================= */ /* ======================= */
#nav{ #nav{
grid-area: nav; grid-area: nav;
} }
nav { nav {
width: 100%; width: 100%;
padding: 1em; padding: 1em;
text-align: left; text-align: left;
display:none; display:none;
background-color: var(--nav-bg-c); background-color: var(--nav-bg-c);
} }
nav ul { nav ul {
margin: 0; margin: 0;
padding: 0; padding: 0;
list-style: none; list-style: none;
display: inline-flex; display: inline-flex;
flex-direction: column; flex-direction: column;
flex-wrap: wrap; flex-wrap: wrap;
align-items: left;
justify-content: flex-end; justify-content: flex-end;
} }
nav li { nav li {
margin-left: 0.5em; margin-left: 0.5em;
margin-right: 0.5em; margin-right: 0.5em;
color: var(--alt-color); }
}
nav > ul > li {
nav > ul > li {
font-variant: normal; font-variant: normal;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
margin-top: 0.5em; margin-top: 0.5em;
} }
nav > ul > li > a { nav > ul > li > a {
color: var(--banner-font-family);
text-decoration: none; text-decoration: none;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-items: center; justify-items: center;
} }
.nav-toggle { .nav-toggle {
display:none; display:none;
} }
.nav-toggle:checked ~ nav { .nav-toggle:checked ~ nav {
display: block; display: block;
} }
.nav-toggle:checked ~ div { .nav-toggle:checked ~ div {
display: none; display: none;
} }
.nav-toggle-label { .nav-toggle-label {
margin-right: 1em; margin-right: 1em;
margin-left: auto; margin-left: auto;
display: flex; display: flex;
height: 100%; height: 100%;
align-items: center; align-items: center;
align-self: flex-end; align-self: flex-end;
} }
.nav-toggle:not(:checked) ~ .nav-toggle-label { .nav-toggle:not(:checked) ~ .nav-toggle-label {
margin-left: auto; margin-left: auto;
} }
.nav-toggle-label span, .nav-toggle-label span,
.nav-toggle-label span:before, .nav-toggle-label span:before,
.nav-toggle-label span:after { .nav-toggle-label span:after {
display: block; display: block;
background: var(--link-c);; background: var(--link-c);;
height: 2px; height: 2px;
width: 2em; width: 2em;
position: relative; position: relative;
} }
.nav-toggle-label span:before, .nav-toggle-label span:before,
.nav-toggle-label span:after { .nav-toggle-label span:after {
content: ''; content: '';
position: absolute; position: absolute;
} }
.nav-toggle-label span:before { .nav-toggle-label span:before {
bottom: 7px; bottom: 7px;
} }
.nav-toggle-label span:after { .nav-toggle-label span:after {
top: 7px; top: 7px;
} }
.navicon { .navicon {
display: inline-grid; display: inline-grid;
justify-content: center; justify-content: center;
align-content: center; align-content: center;
width: 2em; min-width: 3em;
} min-height: 2.5em;
}
/* ======================= */
/* Banner */ .navlabel {
/* ======================= */ margin-top: auto;
#banner { margin-bottom: auto;
min-height: 2.5em;
font-size: 85%;
display: inline-flex;
align-items: center;
}
/* ======================= */
/* Banner */
/* ======================= */
#banner {
grid-area: banner; grid-area: banner;
} }
#banner div { #banner div {
color: var(--link-c); color: var(--link-c);
background-color: var(--nav-bg-c); background-color: var(--nav-bg-c);
margin: 2em; margin: 2em;
...@@ -224,99 +231,154 @@ nav > ul > li > a { ...@@ -224,99 +231,154 @@ nav > ul > li > a {
padding-right: 1em; padding-right: 1em;
padding-bottom: 1em; padding-bottom: 1em;
padding-top: 2.5em; padding-top: 2.5em;
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
border-color: var(--link-c); border-color: var(--link-c);
} }
/* ======================= */ /* ======================= */
/* Main */ /* Main */
/* ======================= */ /* ======================= */
#main{ #main{
grid-area: main; grid-area: main;
} font-size: 80%;
}
/* ======================= */
/* Table */ .label {
/* ======================= */ font-size: 90%;
padding-left:1em;
table { padding-right: 1em;
background-color: var(--caption-bg-c);
}
button {
border: none;
padding: 0.5em;
text-decoration: underline;
}
/* ======================= */
/* Table */
/* ======================= */
table {
margin:1em; margin:1em;
padding:1em; padding:1em;
margin-right: auto; margin-right: auto;
font-size: var(--table-font-size);
width: 100%; width: 100%;
} }
th { th {
text-align:left; text-align:left;
padding:0.5em; padding:0.5em;
word-wrap: break-word; word-wrap: break-word;
} }
td { td {
text-align:left; text-align:left;
padding-left:0.5em; padding-left:0.5em;
padding-right:0.5em; padding-right:0.5em;
padding-top:1.25em; padding-top:1.25em;
word-wrap: break-word; word-wrap: break-word;
border-top: solid 1px var(--table-border); border-top: solid 1px var(--table-border);
} vertical-align: top;
}
th a {
th a {
text-decoration:none; text-decoration:none;
} }
td a { td a {
text-decoration: none; text-decoration: none;
} }
.dropdown { .dropdown {
float:right; float:right;
} }
/* ======================= */ /* ======================= */
/* dropdown-box */ /* dropdown-box */
/* ======================= */ /* ======================= */
.dropdown-toggle { .dropdown-toggle {
display: none; display: none;
} }
.dropdown-container { .dropdown-container {
padding:0em; padding:0em;
border:none; border:none;
display:table-cell; display:table-cell;
} }
.dropdown-label { .dropdown-label {
float: right; float: right;
height: 1.25em; height: 1.25em;
position: relative; position: relative;
top: -1.5em; top: -1.5em;
} }
/* /*
.dropdown-toggle:checked ~ .dropdown-label:first-of-type { .dropdown-toggle:checked ~ .dropdown-label:first-of-type {
border: 3px solid black; border: 3px solid black;
} }
*/ */
.dropdown-box { .dropdown-box {
background-color: var(--caption-bg-c); background-color: var(--caption-bg-c);
display:none; display:none;
} padding: 1em;
}
.dropdown-toggle:checked ~ div.dropdown-box:first-of-type {
.dropdown-toggle:checked ~ div.dropdown-box:first-of-type {
display: block; display: block;
} }
/* ======================= */
/* Popup */
/* ======================= */
.popup {
position: relative;
display: inline-block;
cursor: pointer;
}
.popup .popuptext {
visibility: hidden;
width: 160px;
background-color: var(--heading-text-c);
color: #fff;
text-align: center;
border-radius: 6px;
padding: 8px 0;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -80px;
}
.popup .popuptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: var(--heading-text-c) transparent transparent transparent;
}
/* ======================= */ .popup .show {
/* Footer */ visibility: visible;
/* ======================= */ }
footer {
/* ======================= */
/* Footer */
/* ======================= */
footer {
display: flex; display: flex;
text-align: center; text-align: center;
width:100%; width:100%;
...@@ -327,16 +389,16 @@ footer { ...@@ -327,16 +389,16 @@ footer {
grid-area: footer; grid-area: footer;
color: var(--link-c); color: var(--link-c);
background-color: var(--nav-bg-c); background-color: var(--nav-bg-c);
} }
footer div { footer div {
margin: 2em; margin: 2em;
} }
/* ======================= */ /* ======================= */
/* desktop provisions */ /* desktop provisions */
/* ======================= */ /* ======================= */
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
body { body {
display: grid; display: grid;
grid-template-rows: 4em auto auto auto; grid-template-rows: 4em auto auto auto;
...@@ -347,30 +409,30 @@ footer div { ...@@ -347,30 +409,30 @@ footer div {
"nav . main ." "nav . main ."
"nav footer footer footer"; "nav footer footer footer";
min-height: 100vh; min-height: 100vh;
font-size: var(--body-font-size); font-size: var(--main-font-size);
font-family: var(--main-font-family); font-family: var(--main-font-family);
font-weight: var(--main-font-weight); font-weight: var(--main-font-weight);
margin: 0; margin: 0;
} }
header { header {
background-color: var(--main-bg-c); background-color: var(--main-bg-c);
} }
#nav { #nav {
background-color: var(--nav-bg-c); background-color: var(--nav-bg-c);
} }
nav { nav {
width: 100%; width: 100%;
padding: 0em; padding: 0em;
margin-left: 0em; margin-left: 0em;
} }
nav > ul { nav > ul {
width: 100%; width: 100%;
} }
nav > ul > li { nav > ul > li {
font-variant: normal; font-variant: normal;
font-size: 90%; font-size: 90%;
...@@ -379,46 +441,21 @@ footer div { ...@@ -379,46 +441,21 @@ footer div {
align-items: center; align-items: center;
padding-left: 1em; padding-left: 1em;
} }
nav > ul > li > a { nav > ul > li > a {
width: 100%; width: 100%;
} }
nav > ul > li > a > span > img { nav > ul > li > a > span > img {
display: inline; display: inline;
} }
.nav-toggle ~ nav { .nav-toggle ~ nav {
display: block; display: block;
} }
.nav-toggle-label { .nav-toggle-label {
display: none; display: none;
} }
/* ======================= */ }
/* pagination */ \ No newline at end of file
/* ======================= */
.center {
text-align: center;
}
.pagination {
display: inline-block;
}
.pagination a {
color: black;
float: left;
padding: 8px 16px;
text-decoration: none;
transition: background-color .3s;
border: 1px solid #ddd;
}
.pagination a.active {
background-color: #4CAF50;
color: white;
border: 1px solid #4CAF50;
}
}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment