From ff0e7e685c0228984254677756afec9651639288 Mon Sep 17 00:00:00 2001 From: Nathan Gray Date: Tue, 24 Feb 2015 22:23:17 +0000 Subject: [PATCH] Add hover action to show whole link template --- home/templates/default/app.css | 25 ++++- home/templates/pixelegg/app.css | 155 +------------------------------ home/templates/pixelegg/app.less | 3 +- 3 files changed, 23 insertions(+), 160 deletions(-) diff --git a/home/templates/default/app.css b/home/templates/default/app.css index e0fb9d45d6..1b07cb3eb1 100644 --- a/home/templates/default/app.css +++ b/home/templates/default/app.css @@ -73,12 +73,15 @@ div.calendar_favorite_portlet.et2_portlet.ui-widget-content > div:last-of-type { position: relative; top: -20px; } -.et2_portlet.home_link_portlet:hover > .ui-widget-header { - display: block; - z-index: 90; -} .et2_portlet.home_link_portlet.ui-widget-content > div:last-of-type { - top: 0px + position: relative; + margin-top: -20px; + height: 100%; + min-height: 45px; + transition: none; + -webkit-transition: none; + -moz-transition: none; + -o-transition: none; } .et2_portlet.home_link_portlet > div:last-of-type > div { padding: 10px; @@ -91,6 +94,18 @@ div.calendar_favorite_portlet.et2_portlet.ui-widget-content > div:last-of-type { max-width: 100%; max-height: 64px; } +/* Single entry hover */ +.et2_portlet.home_link_portlet:hover > .ui-widget-header { + display: block; + z-index: 90; +} +.et2_portlet.home_link_portlet:hover > div:last-of-type { + bottom: inherit; + top: 1px; + height: auto; + z-index: 10; + border-bottom: inherit; +} /* Favorite / nextmatch * NB: using class attribute contains as favorites have an app-specific prefix diff --git a/home/templates/pixelegg/app.css b/home/templates/pixelegg/app.css index 7bc709d0d1..775f85728d 100755 --- a/home/templates/pixelegg/app.css +++ b/home/templates/pixelegg/app.css @@ -1,3 +1,4 @@ +@import "../default/app.css"; /** * EGroupware: CSS with less preprocessor * @@ -9,157 +10,3 @@ * @package home * @version $Id$ */ -/** - * Home CSS - */ -/** - * Basic layout and structural CSS - */ -#home-index_home-index { - height: 100%; -} -#home-index_portlets { - background-color: inherit; -} -#portlets { - border: 1px solid silver; - width: 100%; - min-width: 100px; - min-height: 100px; - position: relative; -} -.home .et2_portlet > .ui-widget-header { - cursor: pointer; -} -.et2_portlet.ui-widget-content > div:last-of-type { - /* Allow space for header, as the whole portlet is sized by auto-generated css */ - position: absolute; - bottom: 0px; - top: 20px; - width: 100%; - overflow: hidden; -} -.et2_portlet .et2_container { - height: 100%; -} -/* give not automatic sizing old calendar views a scrollbar, if necessary */ -div.calendar_favorite_portlet.et2_portlet.ui-widget-content > div:last-of-type { - overflow-y: auto; -} -/* Gridster */ -#portlets { - position: relative; -} -.home .et2_portlet { - position: absolute; -} -.home .et2_portlet.dragging { - z-index: 99; -} -.preview-holder { - margin: 5px; - list-style: none; - background: rgba(0, 0, 0, 0.3); - border: 1px solid silver; - position: absolute; -} -/** - * Portlet styling (cosmetic) - */ -.et2_portlet.ui-widget-content > div:last-of-type > .et2_container { - background: linear-gradient(to bottom, rgba(255, 255, 255, 0.9) 10%, rgba(255, 255, 255, 0.75) 90%) /* W3C */; -} -/* Single entry */ -.et2_portlet.home_link_portlet > .ui-widget-header { - display: none; - position: relative; - top: -20px; -} -.et2_portlet.home_link_portlet:hover > .ui-widget-header { - display: block; - z-index: 90; -} -.et2_portlet.home_link_portlet.ui-widget-content > div:last-of-type { - top: 0px; -} -.et2_portlet.home_link_portlet > div:last-of-type > div { - padding: 10px; -} -/* Thumbnail / icon */ -.et2_portlet.home_link_portlet > div:last-of-type img:first-of-type { - float: left; - margin-right: 8px; - margin-bottom: 8px; - max-width: 100%; - max-height: 64px; -} -/* Favorite / nextmatch - * NB: using class attribute contains as favorites have an app-specific prefix - */ -[class*="favorite_portlet"].et2_portlet .ui-widget-header > .et2_button { - float: left; - padding: 0px !important; - margin-top: 3px; - height: 12px; - width: 12px; - z-index: 50; -} -[class*="favorite_portlet"].et2_portlet .ui-widget-header > button.et2_button_with_image.closed { - background-position: 0 0 !important; -} -[class*="favorite_portlet"].et2_portlet .ui-widget-header > button.et2_button_with_image.opened { - background-position: -10px 0 !important; -} -/* We can't just set display:none for the header as that changes the column spacing */ -[class*="favorite_portlet"].et2_portlet .et2_nextmatch.header_hidden { - padding-top: 0px; -} -[class*="favorite_portlet"].et2_portlet .et2_nextmatch.header_hidden .egwGridView_outer thead:first-of-type th, -[class*="favorite_portlet"].et2_portlet .et2_nextmatch.header_hidden .egwGridView_outer thead:first-of-type div.innerContainer, -[class*="favorite_portlet"].et2_portlet .et2_nextmatch.header_hidden .egwGridView_outer thead:first-of-type th.optcol span.selectcols { - height: 0px; - padding-top: 0px; - padding-bottom: 0px; - margin-top: 0px; - margin-bottom: 0px; - line-height: 0px; -} -[class*="favorite_portlet"].et2_portlet .et2_nextmatch.header_hidden .egwGridView_outer thead:first-of-type th { - visibility: hidden; -} -/** - * Weather - */ -.home_weather_portlet table[id$="current"] { - max-width: 250px; -} -.home_weather_portlet .temperature:after { - content: "\00B0"; -} -.home_weather_portlet .current { - font-size: large; -} -.home_weather_portlet .forecast [id$="day"] { - font-size: smaller; -} -.home_weather_portlet .forecast > div { - display: inline-block; - margin-bottom: 15px; - width: 52px; -} -.home_weather_portlet .forecast img { - margin: -10px -6px; - width: 40px; - height: auto; -} -.home_weather_portlet .high_low { - padding: 3px; -} -.home_weather_portlet .high_low[id$="min"] { - background-color: rgba(200, 200, 255, 0.3); -} -.home_weather_portlet .attribution { - position: relative; - bottom: 0.5em; - font-size: smaller; -} diff --git a/home/templates/pixelegg/app.less b/home/templates/pixelegg/app.less index 3401c01a72..de4396ab51 100755 --- a/home/templates/pixelegg/app.less +++ b/home/templates/pixelegg/app.less @@ -13,4 +13,5 @@ @import (reference) "../../../pixelegg/less/def_buttons.less"; @import (reference) "../../../pixelegg/less/def_design_pattern_color_font_shadow.less"; -@import (less) "../default/app.css"; +@import (reference) "../default/app.css"; +