From 2aa149d6acf96bcb0a1665cc2a7ecce1d13b1beb Mon Sep 17 00:00:00 2001 From: Mark Kevin Baldemor Date: Tue, 7 May 2019 06:12:16 +0800 Subject: [PATCH] Fixed Small IconMorphs in NavBar get clipped --- .../design/addins/client/iconmorph/resources/css/morph.css | 3 ++- .../design/addins/client/iconmorph/resources/css/morph.min.css | 2 +- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/src/main/resources/gwt/material/design/addins/client/iconmorph/resources/css/morph.css b/src/main/resources/gwt/material/design/addins/client/iconmorph/resources/css/morph.css index 15d28567a..00499db5c 100644 --- a/src/main/resources/gwt/material/design/addins/client/iconmorph/resources/css/morph.css +++ b/src/main/resources/gwt/material/design/addins/client/iconmorph/resources/css/morph.css @@ -7,7 +7,7 @@ position: relative; cursor: pointer; } -.anim-container .icons { +.anim-container .icons.material-icons { transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; @@ -17,6 +17,7 @@ width: 1em; position: absolute; left: 0; + line-height: normal; } .anim-container .source { transform: rotate(-135deg); diff --git a/src/main/resources/gwt/material/design/addins/client/iconmorph/resources/css/morph.min.css b/src/main/resources/gwt/material/design/addins/client/iconmorph/resources/css/morph.min.css index 98450b30e..0ac2926fe 100644 --- a/src/main/resources/gwt/material/design/addins/client/iconmorph/resources/css/morph.min.css +++ b/src/main/resources/gwt/material/design/addins/client/iconmorph/resources/css/morph.min.css @@ -1 +1 @@ -.anim-container{height:4rem;width:4rem;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s;position:relative;cursor:pointer}.anim-container .icons{transition:.3s;-moz-transition:.3s;-webkit-transition:.3s;font-size:4em!important;height:1em;width:1em;position:absolute;left:0}.anim-container .source{transform:rotate(-135deg);-moz-transform:rotate(-135deg);-webkit-transform:rotate(-135deg);opacity:0}.anim-container.morphed{transform:rotate(135deg);-moz-transform:rotate(135deg);-webkit-transform:rotate(135deg)}.anim-container.morphed .source{opacity:1;visibility:visible}.anim-container.morphed .target{opacity:0;visibility:hidden}.anim-container.tiny{height:1rem;width:1rem;font-size:.5rem}.anim-container.small{height:2rem;width:2rem;font-size:.5rem}.anim-container.medium{height:4rem;width:4rem;font-size:.5rem}.anim-container.large{height:6rem;width:6rem;font-size:.5rem}.anim-container.tiny .icons{font-size:2em!important}.anim-container.medium .icons{font-size:8em!important}.anim-container.large .icons{font-size:12em!important} \ No newline at end of file +.anim-container{height:4rem;width:4rem;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s;position:relative;cursor:pointer}.anim-container .icons.material-icons{transition:.3s;-moz-transition:.3s;-webkit-transition:.3s;position:absolute;font-size:4em!important;height:1em;width:1em;position:absolute;left:0;line-height:normal}.anim-container .source{transform:rotate(-135deg);-moz-transform:rotate(-135deg);-webkit-transform:rotate(-135deg);opacity:0}.anim-container.morphed{transform:rotate(135deg);-moz-transform:rotate(135deg);-webkit-transform:rotate(135deg)}.anim-container.morphed .source{opacity:1;visibility:visible}.anim-container.morphed .target{opacity:0;visibility:hidden}.anim-container.tiny{height:1rem;width:1rem;font-size:.5rem}.anim-container.small{height:2rem;width:2rem;font-size:.5rem}.anim-container.medium{height:4rem;width:4rem;font-size:.5rem}.anim-container.large{height:6rem;width:6rem;font-size:.5rem}.anim-container.tiny .icons{font-size:2em!important}.anim-container.medium .icons{font-size:8em!important}.anim-container.large .icons{font-size:12em!important} \ No newline at end of file