mirror of
https://github.com/Combodo/iTop.git
synced 2026-02-13 15:34:12 +01:00
e1ffa65d8b
* Rebase onto develop * Use exit condition instead of englobing condition * Add informative modals that can be called from modal toolbox * Refactor "apply_modify" and "apply_new" into own controller, handle ajax requests with a json response and handle these responses in linkset creation/edition * Fix merge issues * Remove inverted condition * Move linkset create button to a better place, still needs to fix duplicate "New" button caused by a refactor * Handle "Cancel" button in modals * Do not display relations when editing an object in a modal * More elegant way to add "New" button to relations lists * Factorize vertical highlights in alerts and modal in a single mixin * Replace button name with dict entry code * Change route name to snake case * More elegant way to add "Create in modal" button to relations lists * Replace triple if with in_array * Move listener to body * Rename variable to match boolean rules * Rename event * Rename extra param * Add phpdoc * Revert changes * Check indirect linkset rights before allowing creation in modal
Description
This is a brief description of the SASS 7-1 system and how to use it.
File structure
SCSS files are structured following the 7-1 pattern.
@rveitch made a great summary with the following, which can also be found here.
Note: Folders with an * are customizations we made to the original 7-1 pattern to best fit our needs
css/backoffice/
|
|– utils/
| |– _variables.scss # Sass Variables
| |– _functions.scss # Sass Functions
| |– _mixins.scss # Sass Mixins
| |– _helpers.scss # Class & placeholders helpers
|
|– vendors/
| |– _bootstrap.scss # Bootstrap
| |– _jquery-ui.scss # jQuery UI
| ... # Etc…
|
|– base/
| |– _reset.scss # Reset/normalize
| |– _typography.scss # Typography rules
| ... # Etc…
|
|– components/
| |– _buttons.scss # Buttons
| |– _carousel.scss # Carousel
| |– _cover.scss # Cover
| |– _dropdown.scss # Dropdown
| ... # Etc…
|
|– layout/
| |– _navigation.scss # Navigation
| |– _grid.scss # Grid system
| |– _header.scss # Header
| |– _footer.scss # Footer
| |– _sidebar.scss # Sidebar
| |– _forms.scss # Forms
| ... # Etc…
|
|- *application/ # Elements that are not usable as a standalone (like componants and layouts are) and very application (the backoffice) specific
| |- display-block
| |- tabular-fields
| ...
|
|- *datamodel/ # SCSS / CSS3 variables and CSS classes for PHP classes of the DM that are part of the core (not in a module) and cannot be styled otherwise
| |- _user.scss
| ...
|
|– pages/
| |– _home.scss # Home specific styles
| |– _contact.scss # Contact specific styles
| ... # Etc…
|
|- *blocks-integrations # Specific rules for the integration of a block with another one, those kind of rules should never be in the block partial directly
| |- _panel-with-datatable.scss # Changes the negative margins of the datatable so it overlaps the panel's original padding
| ...
|
|– themes/
| |– _theme.scss # Default theme
| |– _admin.scss # Admin theme
| ... # Etc…
|
|
`- _shame.scss # Shame file, should contain all the ugly hacks (https://sass-guidelin.es/#shame-file)
`– main.scss # Main Sass file
Usage
To avoid common errors, files should be imported in the final file in the following order. Again those are just following the SASS guidelines:
- Utils
- Variables
- Functions
- Mixins
- Helpers
- Vendors
- Base
- Components
- Layout
- *Application
- Pages
- *Block integrations
- Themes
- Shame file