Commit 6633066c65423d94cbae494ccb25d6c515696490

Authored by Leandro Santos
1 parent 66c7b785

adding block store css

public/proposal-app
1 -Subproject commit a86d8e6f498ef8a93411a287c1e772928fca369b 1 +Subproject commit e735ba016e49698a3dc781a82938944b3eeeec81
public/stylesheets/application.scss
@@ -79,3 +79,4 @@ @@ -79,3 +79,4 @@
79 @import 'api-playground'; 79 @import 'api-playground';
80 80
81 // Also avoid generic and prefer class over id selectors 81 // Also avoid generic and prefer class over id selectors
  82 +@import 'block-store';
public/stylesheets/block-store.css
@@ -1,164 +0,0 @@ @@ -1,164 +0,0 @@
1 -/************************************************  
2 - * the handles to where you can drag the blocks *  
3 - ************************************************/  
4 -  
5 -.block-target {  
6 - padding: 2px;  
7 - background: #81FF9B;  
8 - margin-bottom: 5px;  
9 - opacity: 0.8;  
10 - visibility: hidden;  
11 - height: 0;  
12 - font-size: 20px;  
13 - font-weight: bold;  
14 - color: white;  
15 - text-align: center;  
16 -}  
17 -.block-target-hover {  
18 - border: 1px solid #000;  
19 - box-shadow: 0 0 15px #888 inset;  
20 - opacity: 1;  
21 -}  
22 -.shadow .block-target-hover, .shadow .block-target-active {  
23 - visibility: visible;  
24 - height: 30px;  
25 -}  
26 -  
27 -/************************************************  
28 - * block store styles  
29 - ************************************************/  
30 -#block-store #block-store-filter {  
31 - float: right;  
32 - margin-bottom: 8px;  
33 -}  
34 -#block-store #block-types {  
35 - clear: both;  
36 -}  
37 -#block-store {  
38 - display: none;  
39 -}  
40 -#content #block-store .block-type {  
41 - position: relative;  
42 - border: 0px solid #AAA;  
43 - margin: 4px 0;  
44 - padding: 0;  
45 - text-align: center;  
46 - height: auto;  
47 - float: none;  
48 - display: inline-block;  
49 - overflow: hidden;  
50 - width: 112px;  
51 - cursor: move;  
52 - vertical-align: top;  
53 -}  
54 -#block-store .block-type:hover {  
55 - box-shadow: 0px 0px 0px 2px #FFF, 0px 0px 0px 2px #FFF, 0px 0px 10px rgba(0,0,0,0.6);  
56 - outline: none;  
57 -}  
58 -#block-store .block-type:hover .button-bar {  
59 - display: inline;  
60 -}  
61 -#block-store .button-bar {  
62 - margin: 0;  
63 - display: none;  
64 - position: absolute;  
65 - right: 0%;  
66 - border: 0px solid #AAA;  
67 - margin: 0px;  
68 - padding: 0px;  
69 -}  
70 -#block-store .button-bar .icon-help {  
71 - font-size: 0;  
72 - width: 0;  
73 -}  
74 -  
75 -#block-store .block-type .block-type-icon {  
76 - margin-right: auto;  
77 - margin-left: auto;  
78 -}  
79 -#block-store-draggables .block-type, #block-store-draggables .block, #block-store-draggables .block-type-icon, #block-store-draggables .ui-draggable-dragging {  
80 - display: inline-block;  
81 - height: auto;  
82 - z-index: 100;  
83 -}  
84 -#block-store-draggables .block-type .button-bar {  
85 - visibility: hidden;  
86 -}  
87 -#box-organizer.shadow .block {  
88 - opacity: 0.2;  
89 -}  
90 -#box-organizer.shadow .ui-draggable-dragging {  
91 - opacity: 1;  
92 - border: 5px solid red;  
93 - box-shadow: 0px 0px 10px 2px red, inset 0px 0px 10px 2px red;  
94 -}  
95 -#box-organizer .block {  
96 - transition: opacity 0.3s ease-in-out;  
97 -}  
98 -  
99 -/************************************************  
100 - * block info styles  
101 - ************************************************/  
102 -#block-info-container {  
103 - width: 770px;  
104 - padding: 15px;  
105 - color: #444;  
106 -}  
107 -  
108 -#block-info-container #block-info-icon {  
109 - float: left;  
110 - padding-right: 10px;  
111 -}  
112 -  
113 -#block-info-container #block-info-header {  
114 - float: left;  
115 -}  
116 -  
117 -#block-info-container #block-info-header .block-type-icon{  
118 - float: left;  
119 -}  
120 -  
121 -#block-info-container #block-info-header h1 {  
122 - margin: 0;  
123 - font-weight: normal;  
124 - font-family: "Arial Black", Liberation Sans, Arial, sans-serif;  
125 - margin-left: 5px;  
126 - white-space: nowrap;  
127 -}  
128 -  
129 -#block-info-container #block-info-header p{  
130 - margin-left: 55px;  
131 -}  
132 -  
133 -  
134 -#block-info-container h2 {  
135 - margin: 0;  
136 - margin-top: 10px;  
137 - font-weight: normal;  
138 - font-family: "Arial Black", Liberation Sans, Arial, sans-serif;  
139 -}  
140 -  
141 -#block-info-container p {  
142 - margin: 0;  
143 -}  
144 -  
145 -#block-info-images {  
146 - clear: both;  
147 - overflow-x: auto;  
148 - padding-top: 15px;  
149 -}  
150 -  
151 -#block-info-images ul{  
152 - margin: 0px;  
153 - padding: 0px;  
154 -}  
155 -#block-info-images li{  
156 - list-style: none;  
157 - display: inline;  
158 -  
159 -}  
160 -  
161 -  
162 -#block-info-description {  
163 - margin-top: 20px;  
164 -}  
public/stylesheets/block-store.scss 0 → 100644
@@ -0,0 +1,164 @@ @@ -0,0 +1,164 @@
  1 +/************************************************
  2 + * the handles to where you can drag the blocks *
  3 + ************************************************/
  4 +
  5 +.block-target {
  6 + padding: 2px;
  7 + background: #81FF9B;
  8 + margin-bottom: 5px;
  9 + opacity: 0.8;
  10 + visibility: hidden;
  11 + height: 0;
  12 + font-size: 20px;
  13 + font-weight: bold;
  14 + color: white;
  15 + text-align: center;
  16 +}
  17 +.block-target-hover {
  18 + border: 1px solid #000;
  19 + box-shadow: 0 0 15px #888 inset;
  20 + opacity: 1;
  21 +}
  22 +.shadow .block-target-hover, .shadow .block-target-active {
  23 + visibility: visible;
  24 + height: 30px;
  25 +}
  26 +
  27 +/************************************************
  28 + * block store styles
  29 + ************************************************/
  30 +#block-store #block-store-filter {
  31 + float: right;
  32 + margin-bottom: 8px;
  33 +}
  34 +#block-store #block-types {
  35 + clear: both;
  36 +}
  37 +#block-store {
  38 + display: none;
  39 +}
  40 +#content #block-store .block-type {
  41 + position: relative;
  42 + border: 0px solid #AAA;
  43 + margin: 4px 0;
  44 + padding: 0;
  45 + text-align: center;
  46 + height: auto;
  47 + float: none;
  48 + display: inline-block;
  49 + overflow: hidden;
  50 + width: 112px;
  51 + cursor: move;
  52 + vertical-align: top;
  53 +}
  54 +#block-store .block-type:hover {
  55 + box-shadow: 0px 0px 0px 2px #FFF, 0px 0px 0px 2px #FFF, 0px 0px 10px rgba(0,0,0,0.6);
  56 + outline: none;
  57 +}
  58 +#block-store .block-type:hover .button-bar {
  59 + display: inline;
  60 +}
  61 +#block-store .button-bar {
  62 + margin: 0;
  63 + display: none;
  64 + position: absolute;
  65 + right: 0%;
  66 + border: 0px solid #AAA;
  67 + margin: 0px;
  68 + padding: 0px;
  69 +}
  70 +#block-store .button-bar .icon-help {
  71 + font-size: 0;
  72 + width: 0;
  73 +}
  74 +
  75 +#block-store .block-type .block-type-icon {
  76 + margin-right: auto;
  77 + margin-left: auto;
  78 +}
  79 +#block-store-draggables .block-type, #block-store-draggables .block, #block-store-draggables .block-type-icon, #block-store-draggables .ui-draggable-dragging {
  80 + display: inline-block;
  81 + height: auto;
  82 + z-index: 100;
  83 +}
  84 +#block-store-draggables .block-type .button-bar {
  85 + visibility: hidden;
  86 +}
  87 +#box-organizer.shadow .block {
  88 + opacity: 0.2;
  89 +}
  90 +#box-organizer.shadow .ui-draggable-dragging {
  91 + opacity: 1;
  92 + border: 5px solid red;
  93 + box-shadow: 0px 0px 10px 2px red, inset 0px 0px 10px 2px red;
  94 +}
  95 +#box-organizer .block {
  96 + transition: opacity 0.3s ease-in-out;
  97 +}
  98 +
  99 +/************************************************
  100 + * block info styles
  101 + ************************************************/
  102 +#block-info-container {
  103 + width: 770px;
  104 + padding: 15px;
  105 + color: #444;
  106 +}
  107 +
  108 +#block-info-container #block-info-icon {
  109 + float: left;
  110 + padding-right: 10px;
  111 +}
  112 +
  113 +#block-info-container #block-info-header {
  114 + float: left;
  115 +}
  116 +
  117 +#block-info-container #block-info-header .block-type-icon{
  118 + float: left;
  119 +}
  120 +
  121 +#block-info-container #block-info-header h1 {
  122 + margin: 0;
  123 + font-weight: normal;
  124 + font-family: "Arial Black", Liberation Sans, Arial, sans-serif;
  125 + margin-left: 5px;
  126 + white-space: nowrap;
  127 +}
  128 +
  129 +#block-info-container #block-info-header p{
  130 + margin-left: 55px;
  131 +}
  132 +
  133 +
  134 +#block-info-container h2 {
  135 + margin: 0;
  136 + margin-top: 10px;
  137 + font-weight: normal;
  138 + font-family: "Arial Black", Liberation Sans, Arial, sans-serif;
  139 +}
  140 +
  141 +#block-info-container p {
  142 + margin: 0;
  143 +}
  144 +
  145 +#block-info-images {
  146 + clear: both;
  147 + overflow-x: auto;
  148 + padding-top: 15px;
  149 +}
  150 +
  151 +#block-info-images ul{
  152 + margin: 0px;
  153 + padding: 0px;
  154 +}
  155 +#block-info-images li{
  156 + list-style: none;
  157 + display: inline;
  158 +
  159 +}
  160 +
  161 +
  162 +#block-info-description {
  163 + margin-top: 20px;
  164 +}