composer/iTop
6
0
Fork 0
mirror of https://github.com/Combodo/iTop.git synced 2026-04-21 01:28:47 +02:00
Code Issues Packages Projects Releases Wiki Activity

N°2847 - Theme: Add elevations as SCSS and CSS variables

Browse Source
This commit is contained in:
Molkobain
2020-07-21 22:06:37 +02:00
parent 87d7693be5
commit 20ed4fe2d1
1 changed files with 19 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
css/backoffice/utils/helpers/_elevation.scss
View File

@@ -16,18 +16,32 @@
* You should have received a copy of the GNU Affero General Public License
*/
$ibo-elevation-100: 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px 3px rgba(0, 0, 0, 0.12) !default;
$ibo-elevation-200: 0 2px 4px rgba(0, 0, 0, 0.12), 0 3px 6px rgba(0, 0, 0, 0.15) !default;
$ibo-elevation-300: 0 3px 6px rgba(0, 0, 0, 0.10), 0 10px 20px rgba(0, 0, 0, 0.15) !default;
$ibo-elevation-400: 0 5px 10px rgba(0, 0, 0, 0.05), 0 15px 25px rgba(0, 0, 0, 0.15) !default;
$ibo-elevation-500: 0 20px 40px rgba(0, 0, 0, 0.20) !default;
:root{
--ibo-elevation-100: #{$ibo-elevation-100};
--ibo-elevation-200: #{$ibo-elevation-200};
--ibo-elevation-300: #{$ibo-elevation-300};
--ibo-elevation-400: #{$ibo-elevation-400};
--ibo-elevation-500: #{$ibo-elevation-500};
}
%ibo-elevation-100{
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px 3px rgba(0, 0, 0, 0.12);
box-shadow: $ibo-elevation-100;
}
%ibo-elevation-200{
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 3px 6px rgba(0, 0, 0, 0.15);
box-shadow: $ibo-elevation-200;
}
%ibo-elevation-300{
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.10), 0 10px 20px rgba(0, 0, 0, 0.15);
box-shadow: $ibo-elevation-300;
}
%ibo-elevation-400{
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05), 0 15px 25px rgba(0, 0, 0, 0.15);
box-shadow: $ibo-elevation-400;
}
%ibo-elevation-500{
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.20);
box-shadow: $ibo-elevation-500;
}