From b0ae2317255f591941910a0e22878d15aca8d604 Mon Sep 17 00:00:00 2001 From: Iziram Date: Mon, 26 Aug 2024 17:39:49 +0200 Subject: [PATCH] remove bootstrap : add styles WIP --- app/__init__.py | 3 + app/static/css/scodoc.css | 2 +- app/static/css/scodoc97.css | 177 +++++++++++++++++++++++++++++++++++- app/templates/base.j2 | 1 + app/templates/wtf.j2 | 8 +- 5 files changed, 185 insertions(+), 6 deletions(-) diff --git a/app/__init__.py b/app/__init__.py index c9a7a60d..aab9ef3f 100755 --- a/app/__init__.py +++ b/app/__init__.py @@ -353,6 +353,9 @@ def create_app(config_class=DevConfig): app.jinja_env.autoescape = select_autoescape(default_for_string=True, default=True) app.jinja_env.trim_blocks = True app.jinja_env.lstrip_blocks = True + app.jinja_env.globals["is_hidden_field"] = lambda field: isinstance( + field, HiddenField + ) # https://scodoc.fr/ScoDoc app.register_blueprint(scodoc_bp) diff --git a/app/static/css/scodoc.css b/app/static/css/scodoc.css index e54fa801..a8b5f27e 100644 --- a/app/static/css/scodoc.css +++ b/app/static/css/scodoc.css @@ -480,7 +480,7 @@ div.box-chercheetud { } div.box-chercheetud form input { - width: 120px; + max-width: 120px; } /* Page accueil général */ diff --git a/app/static/css/scodoc97.css b/app/static/css/scodoc97.css index 0e5f1ac5..39be45ef 100644 --- a/app/static/css/scodoc97.css +++ b/app/static/css/scodoc97.css @@ -323,4 +323,179 @@ body { #tableau-modules-details:not([open]) #tableau_modules { display: none; -} \ No newline at end of file +} + +/* #region bootstrap <== Remplacement styles bootstrap ==> */ + +* { + box-sizing: border-box; +} + +.alert { + text-wrap: balance; +} + +.container { + max-width: 1140px; + --x: 1.5rem; + --y: 0; + width: 100%; + padding-right: calc(var(--x) * 0.5); + padding-left: calc(var(--x) * 0.5); + margin-right: auto; + margin-left: auto; +} + +/* #region btn */ + +.btn { + appearance: none; + background-color: #FAFBFC; + border: 1px solid rgba(27, 31, 35, 0.15); + border-radius: 6px; + box-shadow: rgba(27, 31, 35, 0.04) 0 1px 0, rgba(255, 255, 255, 0.25) 0 1px 0 inset; + box-sizing: border-box; + color: #24292E; + cursor: pointer; + display: inline-block; + font-family: -apple-system, system-ui, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; + font-size: 14px; + font-weight: 500; + line-height: 20px; + list-style: none; + padding: 6px 16px; + position: relative; + transition: background-color 0.2s cubic-bezier(0.3, 0, 0.5, 1); + user-select: none; + -webkit-user-select: none; + touch-action: manipulation; + vertical-align: middle; + white-space: nowrap; + word-wrap: break-word; + + margin: 4px 2px; +} + +a.btn { + text-decoration: none; +} + +.btn:hover { + background-color: #F3F4F6; + text-decoration: none; + transition-duration: 0.1s; +} + +.btn:disabled { + background-color: #FAFBFC; + border-color: rgba(27, 31, 35, 0.15); + color: #959DA5; + cursor: default; +} + +.btn:active { + background-color: #EDEFF2; + box-shadow: rgba(225, 228, 232, 0.2) 0 1px 0 inset; + transition: none 0s; +} + +.btn:focus { + outline: 1px transparent; +} + +.btn:before { + display: none; +} + +.btn:-webkit-details-marker { + display: none; +} + +/* #endregion btn */ + +/* #region form */ + +label, +input, +select, +textarea { + margin: 4px 2px; +} + +.control-label { + display: inline-block; + display: block; + margin-bottom: 8px; + font-weight: 500; + color: #333; +} + +.form-group input, +.form-control { + width: 100%; + padding: 10px; + margin-bottom: 16px; + border: 1px solid #ced4da; + border-radius: 4px; + font-size: 16px; + transition: border-color 0.2s ease-in-out; +} + +.form-group input:focus, +.form-control:focus { + outline: none; + border-color: #007bff; + box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25); +} + +.form-group input[type="submit"], +.form-control[type="submit"] { + background-color: #007bff; + color: white; + padding: 10px 16px; + border: none; + border-radius: 4px; + font-size: 16px; + cursor: pointer; + transition: background-color 0.2s ease-in-out; +} + +.form-group input[type="submit"]:hover, +.form-control[type="submit"]:hover { + background-color: #0056b3; + color: #fff; +} + +.form-group input[type="submit"][name="cancel"]:hover, +.form-control[type="submit"][name="cancel"]:hover { + background-color: #606060; + color: #fff; +} + +.form-group input[type="submit"][name="cancel"], +.form-control[type="submit"][name="cancel"] { + background-color: #8a8a8a; + color: #fff; +} + +fieldset { + min-width: 0; + padding: 0; + margin: 0; + border: 0; +} + +/* #endregion form */ +/* #region pagination */ + +.pagination { + list-style: none; + display: flex; +} + +/* #endregion pagination */ + +/* #region navbar */ +/* #endregion navbar */ + +/* #endregion bootstrap ==> */ \ No newline at end of file diff --git a/app/templates/base.j2 b/app/templates/base.j2 index fd22d3ea..73e71614 100644 --- a/app/templates/base.j2 +++ b/app/templates/base.j2 @@ -4,6 +4,7 @@ {% block styles %} {{super()}} + {% endblock %} diff --git a/app/templates/wtf.j2 b/app/templates/wtf.j2 index b71a0c1a..7f69ca9a 100644 --- a/app/templates/wtf.j2 +++ b/app/templates/wtf.j2 @@ -2,8 +2,8 @@ {% macro form_errors(form, hiddens=True) %} {%- if form.errors %} {%- for fieldname, errors in form.errors.items() %} - {%- if bootstrap_is_hidden_field(form[fieldname]) and hiddens or - not bootstrap_is_hidden_field(form[fieldname]) and hiddens != 'only' %} + {%- if is_hidden_field(form[fieldname]) and hiddens or + not is_hidden_field(form[fieldname]) and hiddens != 'only' %} {%- for error in errors %}

{{error}}

{%- endfor %} @@ -75,7 +75,7 @@ the necessary fix for required=False attributes, but will also not set the requi
{{field.label}} {%- for subfield in field %} - {% if not bootstrap_is_hidden_field(subfield) -%} + {% if not is_hidden_field(subfield) -%} {{ form_field(subfield, form_type=form_type, horizontal_columns=horizontal_columns, @@ -202,7 +202,7 @@ action="" is what we want, from http://www.ietf.org/rfc/rfc2396.txt: {{ form_errors(form, hiddens='only') }} {%- for field in form %} - {% if not bootstrap_is_hidden_field(field) -%} + {% if not is_hidden_field(field) -%} {{ form_field(field, form_type=form_type, horizontal_columns=horizontal_columns,