@@N°1370 Portal badge : improve tile on low resolutions

SVN:trunk[5758]
This commit is contained in:
Pierre Goiffon
2018-04-27 15:53:34 +00:00
parent 8f56032d49
commit 6f7351ecc3
2 changed files with 88 additions and 21 deletions

View File

@@ -80,6 +80,7 @@ footer {
}
/* Sidebar */
@media (min-width: 768px) {
/* Main content */
#sidebar {
position: fixed;
top: 0px;
@@ -141,6 +142,9 @@ footer {
width: 40%;
max-width: 100%;
}
#main-wrapper {
margin-top: 20px;
}
}
/* Warning : Not a offical BS breakpoint */
@media (min-width: 1600px) {
@@ -152,12 +156,6 @@ footer {
margin-right: 20px;
}
}
/* Main content */
@media (min-width: 768px) {
#main-wrapper {
margin-top: 20px;
}
}
/* Overlays*/
.global_overlay {
z-index: 9999;
@@ -343,6 +341,9 @@ footer {
display: none;
color: #555;
}
/**********************************/
/* ManageBrick badge tile display */
/**********************************/
.home div.tile-badge > a.tile {
padding: 0;
margin: 0;
@@ -350,12 +351,10 @@ footer {
height: 12em;
min-height: unset;
}
.home div.tile-badge > a.tile > div {
padding: 12% 10% 0;
}
.home div.tile-badge > a.tile > div {
display: table;
width: 100%;
padding: 12% 10% 0;
}
.home div.tile-badge > a.tile > div > div {
display: table-row;
@@ -400,6 +399,34 @@ footer {
.home div.tile-chart > a > div {
padding: 0.25em;
}
@media (max-width: 768px) {
.home div.tile-badge > a.tile {
height: auto;
padding: inherit;
}
.home div.tile-badge > a.tile > div {
padding: 0;
}
.home div.tile-badge > a.tile > div > div > div.tile_decoration {
vertical-align: middle;
}
.home div.tile-badge > a.tile > div > div > div.tile_body > div:first-child > div {
display: inline-block;
}
.home div.tile-badge > a.tile > div > div > div.tile_body > div:first-child > div.tile_title {
margin: 0;
font-size: 2.5em;
font-weight: bold;
}
.home div.tile-badge > a.tile > div > div > div.tile_body > div:first-child > div.tile_description {
display: unset;
margin: 0;
margin-left: 3em;
}
.home div.tile-badge > a.tile > div.tile_description {
display: none;
}
}
@media (min-width: 768px) {
.home .tile {
display: block;
@@ -434,6 +461,9 @@ footer {
display: block;
text-align: left;
}
.home div.tile-badge > a.tile > div > div > div.tile_decoration > span.icon {
font-size: 2em;
}
}
@media (min-width: 992px) {
.home .tile {
@@ -452,6 +482,9 @@ footer {
.home .tile .tile_description {
font-size: 1.2em;
}
.home div.tile-badge > a.tile > div > div > div.tile_decoration > span.icon {
font-size: 6em;
}
}
@media (min-width: 1200px) {
.home .tile {

View File

@@ -147,6 +147,11 @@ footer{
width: 40%;
max-width: 100%;
}
/* Main content */
#main-wrapper{
margin-top: 20px;
}
}
@media (min-width: 992px){
@@ -162,12 +167,6 @@ footer{
}
}
/* Main content */
@media (min-width: 768px) {
#main-wrapper{
margin-top: 20px;
}
}
/* Overlays*/
.global_overlay{
@@ -366,8 +365,10 @@ footer{
}
.home div.tile-badge > a.tile {
/**********************************/
/* ManageBrick badge tile display */
/**********************************/
.home div.tile-badge > a.tile {
padding: 0;
margin: 0;
margin-bottom: 25px;
@@ -375,13 +376,10 @@ footer{
min-height: unset;
}
.home div.tile-badge > a.tile > div {
padding: 12% 10% 0;
}
.home div.tile-badge > a.tile > div {
display: table;
width: 100%;
padding: 12% 10% 0;
}
.home div.tile-badge > a.tile > div > div {
@@ -436,6 +434,35 @@ footer{
}
@media (max-width: 768px) {
.home div.tile-badge > a.tile {
height: auto;
padding: inherit;
}
.home div.tile-badge > a.tile > div {
padding: 0;
}
.home div.tile-badge > a.tile > div > div > div.tile_decoration {
vertical-align: middle;
}
.home div.tile-badge > a.tile > div > div > div.tile_body > div:first-child > div {
display: inline-block;
}
.home div.tile-badge > a.tile > div > div > div.tile_body > div:first-child > div.tile_title {
margin: 0;
font-size: 2.5em;
font-weight: bold;
}
.home div.tile-badge > a.tile > div > div > div.tile_body > div:first-child > div.tile_description {
display: unset;
margin: 0;
margin-left: 3em;
}
.home div.tile-badge > a.tile > div.tile_description {
display: none;
}
}
@media (min-width: 768px) {
.home .tile{
display: block;
@@ -470,6 +497,9 @@ footer{
display: block;
text-align: left;
}
.home div.tile-badge > a.tile > div > div > div.tile_decoration > span.icon {
font-size: 2em;
}
}
@media (min-width: 992px) {
.home .tile{
@@ -488,6 +518,10 @@ footer{
.home .tile .tile_description{
font-size: 1.2em;
}
.home div.tile-badge > a.tile > div > div > div.tile_decoration > span.icon {
font-size: 6em;
}
}
@media (min-width: 1200px) {
.home .tile{