This patch updates the OPAC and staff interface to use Bootstrap 5.
Bootstrap CSS assets are now pulled from node_modules and compiled into
staff-global.css and opac.css at build time. This update lays the
foundations of some other chnages, especially the addition of a dark
mode in the future.
Hundreds of templates have been updated, mostly with updates to the grid
markup. Most of the responsive behavior is still the same with the
exception of improved flexibility of headers and footers in both the
OPAC and staff interface.
The other most common change is to add a new "namespace" to data
attributes used by Bootstrap, e.g. "data-bs-target" or "data-bs-toggle".
Modal markup has also been updated everywhere. Other common changes:
dropdown button markup, alert markup (we now use Bootstrap's "alert
alert-warning" and "alert alert-info" instead of our old "dialog alert"
and "dialog info").
Bootstrap 5 now uses CSS variables which we can override in our own
'_variables.scss' (in both the OPAC and staff) to accomplish a lot of
the style overrides which we previously put in staff-global.scss.
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
This patch makes the Koha::REST::V1 class use a bundled version of the
API spec.
For that to happen, this patch also adds:
* a `yarn api:bundle` task for generating the `swagger_bundle.yaml`
file
* the bundle file to `.gitignore`
* @redocly/cli to the packages.json dependencies (yarn add @redocly/cli)
* `api:bundle` is added to the `yarn build` general command
NOTE: A new workflow is introduced by this patch as developers will need
to call the `yarn api:bundle` command on each API spec change they make.
To test:
1. Have KTD running
2. Verify the API works as usual
=> SUCCESS: The API just works
3. Apply this patch
4. Run:
$ ktd --shell
k$ yarn api:bundle
5. Restart plack:
k$ koha-plack --restart kohadev ; tail -f /var/log/koha/kohadev/*.log
=> SUCCESS: The API loads correctly
6. Repeat 2
=> SUCCESS: Nothing changed
7. Sign off :-D
Signed-off-by: Paul Derscheid <paul.derscheid@lmscloud.de>
Signed-off-by: David Cook <dcook@prosentient.com.au>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
Signed-off-by: Jessica Zairo <jzairo@bywatersolutions.com>
Signed-off-by: Michaela Sieber <michaela.sieber@kit.edu>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
Signed-off-by: Jessica Zairo <jzairo@bywatersolutions.com>
Signed-off-by: Michaela Sieber <michaela.sieber@kit.edu>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
This patch converts the OPAC LESS files to SCSS. In the process of
converting opac.less (and other .less files) to .scss, I have improved
the completeness of the nesting, reordered properties, and in general
done cleanup based on rules in .scss-lint.yml. All of these changes
should have no impact on the style of the OPAC.
This patch modifies the commands used to compile CSS so that OPAC and
staff assets can be processed separately:
'yarn build' <-- Builds the staff client assets by default
'yarn build --view opac' <-- Builds OPAC assets
To test, apply the patch and compile the CSS by running the command
above (or apply the follow-up patch with compiled CSS).
Do a thorough review of the OPAC, taking care to cover as many pages as
possible and checking responsive behavior at the same time. There should
be no visual differences in the OPAC before and after applying the
patch.
Signed-off-by: Claire Gravely <claire.gravely@bsz-bw.de>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
This patch converts staff-global.css to Sass, using SCSS syntax. This
changes the build process for Koha to include installation and execution
of yarn to install npm dependencies and run SCSS -> CSS conversion.
To test, apply the patch and run the following:
$ sudo apt-get install nodejs npm [not necessary in kohadevbox]
$ sudo npm install -g yarn
$ yarn install
$ yarn build
Clear your browser cache if necessary and confirm that CSS styling
throughout the staff client looks correct.
The "yarn build" command triggers a gulp process which compiles SCSS to
CSS, adds automatic vendor-prefixing, and minifies the resulting CSS
file.
There is also a "yarn css" command available which might be used by
developers who are making changes to SCSS. This command does two things
differently:
1. Adds .css.map files which aid CSS debugging using in-browser
inspector tools.
2. Compiles staff-global.css without minification. It can be useful to
see unminified CSS during development, especially to see how SCSS
compiles.
This patch adds a configuration file for sass-lint, .sass-lint.yml.
Currently this configuration is not used during the build process but
can be used in a code editor which supports linting.
Signed-off-by: Claire Gravely <claire.gravely@bsz-bw.de>
Signed-off-by: Josef Moravec <josef.moravec@gmail.com>
Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
Ignore files generated by ExtUtils::MakeMaker
NOTE: Limited scope does not affect files created
by translation utilities
Signed-off-by: Mark Tompsett <mtompset@hotmail.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@gmail.com>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
* All configuration and run-time files created during
a test suite run now live under t/run
* made sure scripts copied to t/run/bin are executable
* added t/run and t/test-config.txt to .gitignore
Signed-off-by: Andrew Moore <andrew.moore@liblime.com>
Signed-off-by: Joshua Ferraro <jmf@liblime.com>
