Commit Graph

74 Commits

Author SHA1 Message Date
Mathieu (mano)
41b5fb9cb7 [IMP] odoo_theme: toctrees-l1,l2 design improvement
Issue 1:
========
The toctrees in the documentation are visually inconsistent because of
the content. Sometimes we have titles that are also links and visually
collides with the rest of the toc making it hard to read. This applies
to toctree-l1 and toctree-l2.

Fix 1:
========
When we have a link and title toctree-l2 in a list containing other
nested toc, we apply another styling displaying it with the same color
as a title, but with an icon and hover behavior indicating that it is a
link. (This commit also changes the direction of the i-link icon to make
it standard).

Issue 2:
========
When we have only have toctree-l1 links without nested toc the toctree
is uselessly taking a lot of space.

Fix: 2
========

In these scenario we add a class to the toctree wrapper to replace the
toctree-l1 style with a toctree-l2.

task-3138525
task-3138563

part of

task-3059178

closes odoo/documentation#6500

X-original-commit: c62bf21987
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
2023-11-21 13:37:28 +00:00
Elisabeth Dickinson
b9f8186990 [IMP] odoo_theme: fix menu links
When searching for a word, if that word happens to be in the menu, the
`display-flex` on the `a` would remove the space around the word because
a `span class=highlight` gets added around it.
Fixed by changing `display-flex` on the `a` to display-block (but
keeping it for `.o_toc_entry_wrapper`)

closes odoo/documentation#4178

X-original-commit: c758071861
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
2023-04-14 19:50:24 +02:00
Elisabeth Dickinson
92e648f4ab [IMP] odoo_theme: design improvements
Revamp of the side menu;
Round all borders for consistency with the buttons;
Improve .sig-* and .o_code elements;
Improve sphinx-tabs hover effect;

task-3046383

closes odoo/documentation#4110

X-original-commit: 3056c7b62d
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
2023-04-12 09:58:52 +02:00
Elisabeth Dickinson
1de8bc18eb [IMP] odoo_theme: general cleanup
A general reorganization of the code was needed for more clarity.
The different markup styles have been grouped together under a common
"chapter", comments have been rewritten and example pages have been
added for context.

Some levels have been removed Where there were too many for no reason.
By removing one level of styles (e.g.: `#wrap`) we avoid needing to
force overrides or adding `!important` to our code.
⌙ e.g.: before commit 9ef86cd93d8c6fc0fd96b437f629237e7a562c6e,
`.o_spoilers .accordion-body >:first-child` was being involuntarily
overridden.

task-3046383

X-original-commit: 620e3c33ef
Part-of: odoo/documentation#4110
2023-04-12 09:58:52 +02:00
Mathieu (mano)
207b741d23 [IMP] toctrees: redesign and new card component
The goal of this commit is to propose a first step towards a new
`.. card::` directive for the toctrees. This is a first design
proposition for this new card component in raw html for the fallback
page `howtos.rst`

The long term objective is to redesign the toctrees by implementing card
components, clearer toctree list design and custom html pages.

Related to task-3059229

closes odoo/documentation#3405

X-original-commit: 53035435f9
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
2023-01-26 17:10:47 +01:00
Elisabeth Dickinson
47ac776111 [IMP] odoo_theme: Fix alerts and accordions colors
closes odoo/documentation#3318

X-original-commit: 8aebb79237
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
2023-01-12 08:15:40 +01:00
Elisabeth Dickinson
83f30a8247 [IMP] odoo-theme: Revert $dark color variable to initial $gray-900
This was changed to get a good text/background contrast on the
alert-dark (Exercise).
By doing so, the .text-dark class generated by BS from the $dark
theme-color was gray instead of the intended near-black color.

By changing the variable, the contrast issue with the alert was back,
to solve this we directly override the alert's background color instead.

X-original-commit: 32c9e59ae6
Part-of: odoo/documentation#3318
2023-01-12 08:15:39 +01:00
Elisabeth Dickinson
fdca1dcc57 [IMP][CSS] Replace text-decoration on link with BS override 2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
acefce591d [IMP][CSS] Reorder styles according to styles guidelines 2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
620cdc2249 [IMP] fix typo 2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
725db742bf [IMP][CSS] Fix unresponsive font-size on alert text
By removing $font-size-sm on the alerts, the text is bigger. The title
text and its icon have been increased as well.
2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
6faece15a4 [IMP][CSS] Remove browser prefixes and unnecessary mixins 2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
6c02973f8a [IMP][CSS] Fix literals in alerts containing tabs 2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
a470171c19 [IMP][CSS] Fix data indentation 2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
ed55f50489 [REM] Removal of changelog
The idea was not developed and it has since been decided not to do it.
2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
6cf27d2dba [IMP][CSS] Use BS font-weight variables and fix
Instead of redefining font-weights, we override the BS variables and add
one extra font-weight in the newly-introduced extended utilities file.
After this change all the variables needed replacing and some tweaking
was needed to get the same or closely similar result as before this
change.

By doing so the font-weight classes in the typography file were obsolete
and hence removed.
Some other font-weight issues which were already there have been fixed
in this commit too.
2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
1dedf7c1d0 [IMP][CSS] Fix color variable issue 2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
77719c64ef [IMP][CSS] Revamp of the .o_spoiler element to use same code as alerts 2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
7b75586379 [IMP][CSS]Change order of imported scss files
The aim of this cleanup is to use as many bootstrap classes, functions
and utilities as possible to reduce the amount of extra code.
Instead of redefining variables, BS variables are overridden in the
bootstrap_overridden file.

In order to be able to reuse these overridden variables within our own
custom variable file — and after consultation with SRI — it was
determined that the variables.scss file should come after the bootstrap
files in the order of importation, unlike the order of odoo website's
scss files.

Changes to variables in bootstrap_overridden have been made to adapt to
the new structure.
2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
54ae084ba5 [IMP][CSS] Use CSS variables to style different alert types
CSS variables avoid having to repeat code for each alert type.
Also remove the need to add "tip" to the theme-colors (no need for "tip"
styled buttons, badges etc, especially as tips use the primary color) by
styling `.alert-tip` with customized copy of BS alert mechanism.

In order to be able to modify the icons with a CSS variable,
the `content` attribute has been removed from the `o-inline-icon` mixin.
Code where this mixin is called in other places has been adapted.
2023-01-04 11:10:09 +01:00
Elisabeth Dickinson
ced7f75438 [IMP][CSS] Clean up the file according to conventions
Includes reordering styles, renaming variables ($o-*),
re-indenting lines, removing commented code
2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
64e79eb69e [IMP][CSS] Improve literals styling (o_code, .sig-*) 2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
a38b3d8c63 [IMP][CSS] Remove repetitive or unnused CSS 2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
3b386da91c [IMP][CSS] Improve margins on headings and sections 2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
3b36e21109 [IMP][CSS] Replace margin and padding values with variables 2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
5d1cd7a239 [IMP][CSS] Revamp modal to use all BS classes and variables 2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
0f291e4cb9 [IMP][CSS] Rescale heading fonts 2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
6c995a0d62 [IMP][CSS] Cleanup font variables 2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
f3ccdf6da9 [IMP][CSS] Cleanup admonitions (alerts) 2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
4ccb4651b2 [IMP][CSS] Cleanup color variables 2023-01-04 11:10:08 +01:00
Elisabeth Dickinson
0869aeaf0a [IMP][CSS] update literals styles (.o_code, .sig-*) 2023-01-04 11:10:08 +01:00
Morgane (morm)
68f39f056e [FIX] documentation: tabs responsiveness
Prior of this commit, the tabs were not responsive in the documentation

closes odoo/documentation#3078

X-original-commit: c9a001d22b
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
2022-12-06 12:05:50 +01:00
Antoine Vandevenne (anv)
b35f5b4f4a [IMP] extensions/spoilers: add an extension for spoilers
It is often needed in developer tutorials to show excerpts of code for
examples and solutions. This takes quite some page space and, for the
latter, it is not always desired to show the final code result right
after the exercise objective.

This commit adds a spoiler feature to the documentation to allow hiding
content until the reader wants to display it.

The feature relies on the new `.. spoiler:: Button label` directive.

task-3036845

closes odoo/documentation#2874

X-original-commit: 4d7a88639a
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
Co-authored-by: Morgan Meganck <morm@odoo.com>
Co-authored-by: Stefano Rigano <sri@odoo.com>
2022-10-28 13:52:45 +02:00
stefanorigano (SRI)
fb65e6c4b0 [IMP] odoo_theme: add default BS functions
Prior to this change it was not possible to use Bootstrap default SCSS
functions in 'bootstrap_overridden.scss'.

This commit mirrors odoo framework's architecture, injecting bootstrap
'_functions.scss' at the beginning of the documentation's SCSS "bundle".

Commit preparatory to the introduction of the 'Spoiler' documentation
component.

task-3036845

X-original-commit: 1691e8970b
Part-of: odoo/documentation#2874
2022-10-28 13:52:44 +02:00
Antoine Vandevenne (anv)
66f4dd4692 [FIX] odoo_theme: show a cursor when hovering on an image without modal
The images that have the class `o-no-modal` cannot be clicked to open in
a modal, so the cursor should not be changed to a pointer when hovering
on them.

This commit also simplifies the theme's SCSS by replacing the hard-coded
SVG images used in the "Supported versions" page by unicode circles with
a custom styling.

X-original-commit: f648960c78
Part-of: odoo/documentation#2463
Co-authored-by: Elisabeth Dickinson (edi) <edi@odoo.com>
2022-07-13 16:46:31 +02:00
Antoine Vandevenne (anv)
198137a2ef [IMP] developer/views: apply the new API references style
The documentation of view attributes was lacking visual structure to
help the reader figure out which attribute relates to which parent
element. Since this documentation was relying on RST block quotes to
represent the hierarchy of view attributes, we can apply the same new
styling that was added with commit 934f45cf and designed for autodoc,
and which relies on the exact same HTML structure as block quotes.

task-2755298

closes odoo/documentation#2339

X-original-commit: e2a3ca0631
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
2022-06-29 10:06:35 +02:00
Elisabeth Dickinson
a52c9d986a [REF] odoo_theme: replace values with variables in SCSS files
X-original-commit: c82d95b17c
2022-06-27 15:39:09 +02:00
Elisabeth Dickinson
99a3aa0b7c [REF] odoo_theme: move stray mixins into the _mixins.scss file
X-original-commit: 7fa153594d
2022-06-27 15:39:08 +02:00
Elisabeth Dickinson
8ef05aa746 [CLN] odoo_theme: remove unnecessary css
X-original-commit: fca78f44db
2022-06-27 15:39:07 +02:00
Elisabeth Dickinson
0216c6ad6f [REF] odoo_theme: move scrollbar styling to .o_side_nav-inner
X-original-commit: b9ca38215d
2022-06-27 15:39:06 +02:00
Elisabeth Dickinson
1d8b75743e [IMP] odoo_theme: replace "hide search matches" by a close button
X-original-commit: 994d273a59
2022-06-27 15:39:04 +02:00
Elisabeth Dickinson
2529a712cd [IMP] odoo_theme: improve spacing around code blocks on reference pages
X-original-commit: 794e42f78b
2022-06-27 15:39:03 +02:00
Elisabeth Dickinson
b495bc67ec [FIX] odoo_theme: fix scrollTo margin/padding with new headers height
The scroll padding needed increasing with the new sub-header.
Unnecessary calc() and parenthesis on the headers-height variable are
removed.

X-original-commit: 0b536debac
2022-06-27 15:39:02 +02:00
Elisabeth Dickinson
8d54073979 [FIX] odoo_theme: remove the horizontal scroll bar
X-original-commit: 26bc1cd707
2022-06-27 15:39:01 +02:00
Elisabeth Dickinson
f1d248ee29 [IMP] odoo_theme: improve URL stylings
- Remove external-link icon on images.
- Remove underline from external-link icon on link hover.
- Add overflow-wrap on URLs on mobile.

X-original-commit: 91cb3ca026
2022-06-27 15:39:00 +02:00
Elisabeth Dickinson
5a2467af18 [IMP] odoo_theme: improve general spacings and paddings
X-original-commit: 2e693b3c4a
2022-06-27 15:38:59 +02:00
Elisabeth Dickinson
0f80cba80c [IMP] odoo_theme: improve special terms styling
Including the `:command:`, `:file:` and `:dfn:` roles, and code-styled
text in alerts.

task-2790284

X-original-commit: 7239986484
2022-06-27 15:38:58 +02:00
Antoine Vandevenne (anv)
135b328184 [IMP] odoo_theme: open images in a modal
task-2358082

closes odoo/documentation#2280

X-original-commit: 2a867b4f60
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
Co-authored-by: Elisabeth Dickinson (edi) <edi@odoo.com>
2022-06-23 14:05:00 +02:00
Elisabeth Dickinson
3c3bd536ca [FIX] odoo_theme: fix highlight blocks in field-list items
On pages such as /developer/reference/backend/orm.html#fields, the
highlight blocks inside `dl.field-list` items were pushing the width of
the page to go outside the screen on mobile. This is fixed by changing
the `.field-list`'s `display: grid` into `block` on mobile.

closes odoo/documentation#2227

X-original-commit: a689ea236d
Signed-off-by: Antoine Vandevenne (anv) <anv@odoo.com>
2022-06-15 14:48:31 +02:00
Elisabeth Dickinson
9bf93dcbb2 [FIX] odoo_theme: fix searchbox's highlight-link
task-2800937

X-original-commit: 3fd32fe92a
2022-06-15 11:38:07 +02:00