Download as
Browse Code »

Commit 80758fff2f3cf203e883f4e4186fa4dc22fc15a6

Authored by Valessio Brito
Committed by Daniel
1 parent 06f5295f
Exists in master and in 22 other branches angular_poc, api-article-archived, article-readonly, backup-7-jan-2016, captcha_serpro_plugin, content-manager-hostspot, export-comment-paragraph, fix_event_date_issue, login-captcha, master_rails3, new_video_plugin, pg_search_rank, production, refactor_with_role, refactor_with_role_scope, remove_profile_cat_icons, resend_confirmation_email, staging, staging_rails3, tasks_keep_filter_params, theme-brasil-digital-from-staging, travis

New style for box-organizer on 'edition mode'

Showing 1 changed file with 66 additions and 25 deletions   Show diff stats
public/stylesheets/application.css
  Diff comments   View file @80758ff
... ... @@ -1588,7 +1588,7 @@ a.button.disabled, input.disabled {
1588 1588 }
1589 1589  
1590 1590 /***********************************************************
1591   - * style for blocks
  1591 + * style for blocks
1592 1592 ***********************************************************/
1593 1593  
1594 1594 #content .communities-block .profile-image {
... ... @@ -1652,23 +1652,21 @@ a.button.disabled, input.disabled {
1652 1652 ************************************************/
1653 1653  
1654 1654 .block-target {
1655   - margin: 5px;
1656   - height: 2px;
1657   - height: 15px;
1658   - border: 1px dashed #e0e0e0;
  1655 + padding: 2px;
  1656 + background: #ffd;
  1657 + margin-bottom: 5px;
1659 1658 }
1660 1659 .block-target-hover {
1661 1660 background: #ffd;
1662   - border: 1px solid red;
  1661 + border: 1px solid #000;
1663 1662 height: 30px;
  1663 + box-shadow: 0 0 15px #888 inset;
1664 1664 }
1665 1665 /*************************************************************
1666 1666 * put borders around boxes and blocks when organizing boxes *
1667 1667 *************************************************************/
1668 1668  
1669 1669 #box-organizer div.box {
1670   - border: 1px solid #ccc;
1671   - background-color: white;
1672 1670 background-repeat: no-repeat;
1673 1671 background-position: top right;
1674 1672 }
... ... @@ -1681,28 +1679,72 @@ a.button.disabled, input.disabled {
1681 1679 #box-organizer div.box-3 {
1682 1680 background-image: url(../images/blocks/3.png);
1683 1681 }
1684   -#box-organizer div.box-1 .block {
1685   - outline: 2px dashed green;
  1682 +#box-organizer .block {
  1683 + cursor: move;
  1684 +}
  1685 +#box-organizer .block:hover {
  1686 + box-shadow: 0px 0px 0px 2px #FFF,
  1687 + 0px 0px 0px 2px #FFF,
  1688 + 0px 0px 10px rgba(0, 0, 0, 0.6);
  1689 + outline: none;
1686 1690 }
  1691 +#box-organizer .block {
  1692 + cursor: move;
  1693 + position: relative;
  1694 + min-height: 20px;
  1695 +}
  1696 +
  1697 +#box-organizer .block .button-bar {
  1698 + cursor: move;
  1699 + position: absolute;
  1700 + display: block;
  1701 + width: 100%;
  1702 + height: 100%;
  1703 + background: rgba(255, 255, 255, 0.3);
  1704 + top: -40px;
  1705 + padding-bottom: 40px;
  1706 + display: none;
  1707 +}
  1708 +
  1709 +#box-organizer .block:focus .button-bar,
  1710 +#box-organizer .block:hover .button-bar {
  1711 + display: block;
  1712 +}
  1713 +
1687 1714 .msie #box-organizer div.box-1 .block {
1688 1715 border: 2px dashed green;
1689 1716 }
1690   -#box-organizer div.box-2 .block {
1691   - outline: 2px dashed red;
1692   -}
1693 1717 .msie #box-organizer div.box-1 .block {
1694 1718 border: 2px dashed red;
1695 1719 }
1696   -#box-organizer div.box-3 .block {
1697   - outline: 2px dashed blue;
1698   -}
1699 1720 .msie #box-organizer div.box-1 .block {
1700 1721 border: 2px dashed blue;
1701 1722 }
1702   -.block-footer-content {
1703   - clear: both;
1704   - margin-top: 1em;
  1723 +/************************************************************
  1724 + * custom interation blocks on drag n drop *
  1725 + ***********************************************************/
  1726 +#box-organizer .main-block {
  1727 + font-size: 24px;
1705 1728 text-align: center;
  1729 + box-shadow: none;
  1730 + outline: none;
  1731 + display: block;
  1732 + height: 150px;
  1733 + line-height: 120px;
  1734 +}
  1735 +#box-organizer .main-block:hover {
  1736 + border: 0px;
  1737 + border-style: none;
  1738 + box-shadow: none;
  1739 + outline: none;
  1740 +}
  1741 +#box-organizer .article-block,
  1742 +#box-organizer .recent-documents-block {
  1743 + overflow: visible !important;
  1744 +}
  1745 +
  1746 +#box-organizer .blog-post {
  1747 + margin: auto;
1706 1748 }
1707 1749  
1708 1750 /****************************************
... ... @@ -1750,7 +1792,7 @@ a.button.disabled, input.disabled {
1750 1792 margin: 3px 0;
1751 1793 }
1752 1794  
1753   -/* ==> blocks/tags-block.css <<= */
  1795 +/* ==> blocks/tags-block.css <<= */
1754 1796  
1755 1797 .tags-block {
1756 1798 }
... ... @@ -1761,7 +1803,7 @@ a.button.disabled, input.disabled {
1761 1803 .tags-block .tag_cloud a:hover {
1762 1804 color: red;
1763 1805 }
1764   -/* ==> blocks/my-network-block.css <<= */
  1806 +/* ==> blocks/my-network-block.css <<= */
1765 1807  
1766 1808 #content .my-network-block {
1767 1809 padding: 10px 0px 10px 10px;
... ... @@ -1769,7 +1811,7 @@ a.button.disabled, input.disabled {
1769 1811 .my-network-block a {
1770 1812 text-decoration: none;
1771 1813 }
1772   -/* ==> blocks/link-list-block.css <<= */
  1814 +/* ==> blocks/link-list-block.css <<= */
1773 1815  
1774 1816 #edit-link-list-block table {
1775 1817 width: 100%;
... ... @@ -1828,8 +1870,7 @@ a.button.disabled, input.disabled {
1828 1870 border: 1px solid black;
1829 1871 background-color: #555;
1830 1872 }
1831   -/* ==> blocks/profile-list-block.css <<= */
1832   -
  1873 +/* ==> blocks/profile-list-block.css <<= */
1833 1874  
1834 1875 #content .profile-list-block h3 {
1835 1876 text-align: center;
... ... @@ -1968,7 +2009,7 @@ a.button.disabled, input.disabled {
1968 2009 opacity: 0.5;
1969 2010 filter: alpha(opacity=50);
1970 2011 }
1971   -/* ==> blocks/recent-documents-block.css <<= */
  2012 +/* ==> blocks/recent-documents-block.css <<= */
1972 2013  
1973 2014 #content .recent-documents-block {
1974 2015 padding: 10px 0px 10px 10px;
... ...