Ran Shem Tov pushed to branch feature/create-content at cms-community /
hippo-addon-channel-manager
Commits:
b386e330 by Ran ShemTov at 2017-10-19T13:40:38+02:00
CHANNELMGR-1524 Style changes to adjust to the materials spec
- - - - -
e656d42d by Ran ShemTov at 2017-10-20T12:20:34+02:00
CHANNELMGR-1524 Change shadow behaviour according to click or hover
- - - - -
1b93f4c1 by Ran ShemTov at 2017-10-20T12:25:53+02:00
CHANNELMGR-1524 Add local variable to the variables file for reusability
- - - - -
507f78cf by Ran ShemTov at 2017-10-20T12:29:36+02:00
Merge branch 'feature/CC-CHANNELMGR-1524' into feature/create-content
- - - - -
2 changed files:
- frontend-ng/src/styles/_variables.scss
- frontend-ng/src/styles/string/hippo-iframe.scss
Changes:
=====================================
frontend-ng/src/styles/_variables.scss
=====================================
--- a/frontend-ng/src/styles/_variables.scss
+++ b/frontend-ng/src/styles/_variables.scss
@@ -174,6 +174,10 @@ $overlay-link-transition: 300ms cubic-bezier(.55, 0, .55,
.2);
$overlay-link-hover-bgcolor: #e06717;
$overlay-link-active-shadow-color: rgba(0, 0, 0, .4);
$overlay-link-clicked-bgcolor: $orange-a200;
+$overlay-link-shadow-color: rgba(0, 0, 0, .3);
+
+$overlay-link-shadow-active: 1px 3px 8px 2px $overlay-link-shadow-color;
+$overlay-link-shadow-hover: 1px 3px 8px 1px $overlay-link-shadow-color;
$overlay-icon-fill: $grey-600;
$overlay-icon-size: 36px;
=====================================
frontend-ng/src/styles/string/hippo-iframe.scss
=====================================
--- a/frontend-ng/src/styles/string/hippo-iframe.scss
+++ b/frontend-ng/src/styles/string/hippo-iframe.scss
@@ -271,6 +271,15 @@
border: 0;
fill: $overlay-link-shadow-color;
padding-top: 7px;
+
+ &:hover {
+ background-color: darken($white, 10%);
+ box-shadow: $overlay-link-shadow-hover !important;
+ }
+ &:active {
+ background-color: darken($white, 10%);
+ box-shadow: $overlay-link-shadow-active !important;
+ }
}
.hippo-fab-btn {
@extend %hippo-material-btn;
@@ -278,7 +287,14 @@
height: 100%;
padding: 8px 0 0 5px;
width: 100%;
-
+ &:hover {
+ background-color: darken($overlay-link-bgcolor, 12%);
+ box-shadow: $overlay-link-shadow-hover !important;
+ }
+ &:active {
+ background-color: darken($overlay-link-bgcolor, 12%);
+ box-shadow: $overlay-link-shadow-active !important;
+ }
&-open {
padding: 7px 0 0;
svg { fill: $white; }
View it on GitLab:
https://code.onehippo.org/cms-community/hippo-addon-channel-manager/compare/39ed3f28cdbdfc18f5dc982c0087c4bf36eb756e...507f78cf74b3ad925002c1010ef4c3f744ca0867
---
View it on GitLab:
https://code.onehippo.org/cms-community/hippo-addon-channel-manager/compare/39ed3f28cdbdfc18f5dc982c0087c4bf36eb756e...507f78cf74b3ad925002c1010ef4c3f744ca0867
You're receiving this email because of your account on code.onehippo.org.
_______________________________________________
Hippocms-svn mailing list
Hippocms-svn@lists.onehippo.org
https://lists.onehippo.org/mailman/listinfo/hippocms-svn
