# SPDX-FileCopyrightText: © 2023 Christian BUHTZ <c.buhtz@posteo.jp>
#
# SPDX-License-Identifier: GPL-3.0-only
#
# This file is part of the program "Hyperorg" which is released under GNU
# General Public License v3 (GPLv3). See LICENSES directory or
# go to <https://spdx.org/licenses/GPL-3.0-only.html>.
"""The default css content."""
import inspect
import re
import hyperorg

# The latest version of Hyperog where a modification to the style.css file
# was introduced.
LAST_MODIFICATION = '0.1.1'

# Extract application name and version
REX_GENERATOR = re.compile(r'.*AUTO-GENERATED BY (.*) (.*)')

# pylint: disable-next=line-too-long,invalid-name
_CSS_GENERATOR_INFO = [
    f'  AUTO-GENERATED BY {hyperorg.__name__} '
    f'{hyperorg.__version_major_minor_patch__}',
    '',
    '  This CSS file is auto-generated by '
    f'{hyperorg.get_full_application_string()}.',
    f'  Any updates to {hyperorg.__name__} will overwrite this file.',
    '  The previous version will be kept as a backup named by the pattern',
    '  "style.<application>.<version>.css".'
]
# pylint: disable=invalid-name
_CSS_GENERATOR_INFO = '\n'.join(_CSS_GENERATOR_INFO)

# REUSE-IgnoreStart
_CSS_LICENSE = f'''
  SPDX-FileCopyrightText: © 2023 Christian BUHTZ <c.buhtz@posteo.jp>
  SPDX-License-Identifier: CC0-1.0

  This file is part of the program "{hyperorg.__name__}". Unlike the program,
  this file is licensed under Creative Commons Zero v1 (CC0-1.0). See folder
  LICENSES or go to <https://creativecommons.org/publicdomain/zero/1.0/>'''
# REUSE-IgnoreEnd

_CSS_CREDITS = '''
  CREDITS related to CSS:
    - Used CSS file from https://ddavis.io/posts/eglot-python-ide/
      as an inspiration.
    - About correct use of identifiers like names, tags and classes:
      https://stackoverflow.com/a/1426641/4865723
    - W3CSchools: https://www.w3schools.com/css'''

PYGMENTS_CSS_HEADER = '''/*
  This file is generated using the
  "pygments.formatters.HtmlFormatter().get_style_defs('pre')" function from
  the "pygments" Python package. For more information, please refer to the
  Pygments project website.

    - Website: https://pygments.org
    - Discussion about license: https://github.com/pygments/pygments/discussions/2679
*/
'''  # noqa: E501 line-too-long

_CSS_CONTENT_BASE = inspect.cleandoc('''/* Colors */
:root {
    --body-color: unset;
    --body-background-color: unset;

    --code-background-color: #f2f2f2;
    --code-border-color: #e6e6e6;
    --code-verbatim-background-color: unset;

    --hr-background-color: #333;
    --hr-gradient-color-1: #ccc;
    --hr-gradient-color-2: #333;

    --header-label-background-color: dimgray;

    --warning-color: Violet;
}

/* Main stuff */

body {
    /* About the width. Default for browser not supporting clamp() the
       first "width" is used.
       The second means a minimum of 55vw, ideally 600px and max. 100%.
       The 600px is a threshold making the width 100% when the browser
       window becomes to small.

       Credits:
         - https://stackoverflow.com/a/75109548/4865723
         - https://piccalil.li/quick-tip/
           use-css-clamp-to-create-a-more-flexible-wrapper-utility/
    */
    width: 55vw;
    width: clamp(55vw, 600px, 100%);
    font-family: sans-serif;
    margin: 0 auto;
    line-height: 1.5;
    color: var(--body-color);
    background-color: var(--body-background-color);
}

footer {
    font-family: monospace;
    font-size: x-small;
    text-align: center;
}

hr {
    border: 0;
    height: 1px;
    background: var(--hr-background-color);
    background-image: linear-gradient(
        45deg,
        var(--hr-gradient-color-1),
        var(--hr-gradient-color-2),
        var(--hr-gradient-color-1)
    );
}

/* "Links" declared as insecure or invalid. */
.insecure-link, .invalid-link {
    text-decoration-line: underline;
    text-decoration-style: dashed;
    text-decoration-color: var(--warning-color);
    text-decoration-thickness: .15em;
}

code {
    background-color: var(--code-background-color);
    padding: 0 .3em;
    border-radius: 4px;
    border: 1px solid var(--code-border-color);
}

code.verbatim {
    background-color: var(--code-verbatim-background-color);
}

pre:before {
    display: none;
    position: absolute;
    top: -8px;
    right: 12px;
    padding: 3px;
    /* color: #555; */
    /* background-color: #f2f2f299; */
}

pre:hover:before {
    display: inline;
    margin-top: 14px;
}

pre.src-python:before {
    content: 'Python';
}

pre {
    display: block;
    position: relative;
    border: 1px solid var(--code-border-color);
    border-radius: 3px;
    background-color: var(--code-background-color);
    padding: 8pt;
    font-family: monospace;
    overflow: auto;
    margin: 1.2em;
}

/* Navigation Menu */

nav {
    width: 100%;
    text-align: center;
    font-size: 1.1em;
    margin-top: .5em;
}

nav ul {
    display: flex;
    justify-content: space-around;
    list-style-type: none;
    margin: 0;
}

nav li {
    display: inline-block;
}

nav a {
    font-weight: bold;
}

/* Meta infos in the head */

h1 {
    margin-top: .5rem;
    margin-bottom: .25rem;
}

header {
    font-size: 0.875rem;
}

header ul {
    list-style-type: none;
    margin: 0;
    padding: 0 0 0 1em;
}

header li {
    margin-bottom: .375em;
}

header .label {
    color: var(--header-label-background-color);
}

#hyperorg-mtime {
    float: left;
}

#hyperorg-ctime {
    float: right;
}

/* Node index (sitemap like) */

#hyperorg-index hr {
    width: 90%
}

article.hyperorg-index {
    display: flex;
    justify-content: flex-start;
}

article.hyperorg-index div {
    flex-grow:1;
}

a.hyperorg-index__toplink {
    display: block;
    text-align: right;
    text-decoration: none;
}

a.hyperorg-index__toplink:before {
    content: "🡹 ";
    font-size: 110%;
}

a.hyperorg-index__toplink:after {
    content: " 🡹";
    font-size: 110%;
}

article.hyperorg-index ul {
    list-style-type: none;
    margin: 0;
    padding: .5em 0 0 1em;
}

article.hyperorg-index li {
    margin-bottom: .375em;
}

article.hyperorg-index h2 {
    font-family: monospace;
    font-size: 4em;
    padding: .25em .25em 0 0;
    margin: 0;
}

.hyperorg-index__letter-nav {
    display: flex;
    justify-content: space-around;
    padding: .5em 1.5em 0.5em 1.5em;
    font-family: monospace;
    font-size: 2em;
    }
''')

CSS_CONTENT = f'''/*
{_CSS_GENERATOR_INFO}
{_CSS_LICENSE}
{_CSS_CREDITS}
*/

{_CSS_CONTENT_BASE}
'''
