fixed metacode select lists to be flexible to metacodes

This commit is contained in:
Connor Turland 2014-11-27 18:10:17 -05:00
parent caa80c067b
commit 0e3393e1b5
3 changed files with 24 additions and 16 deletions

View file

@ -1261,7 +1261,7 @@ h3.realtimeBoxTitle {
background-position: 0 -32px; background-position: 0 -32px;
} }
.rc-metacode li img { .rc-metacode li img {
float: left; display: inline-block;
} }
.rightclickmenu .rc-permission ul, .rightclickmenu .rc-permission ul,
.rightclickmenu .rc-metacode ul, .rightclickmenu .rc-metacode ul,
@ -1308,8 +1308,9 @@ float: left;
} }
.rightclickmenu .rc-metacode > ul > li, .rightclickmenu .rc-metacode > ul > li,
.rightclickmenu .rc-siblings > ul > li { .rightclickmenu .rc-siblings > ul > li {
padding: 6px 10px 6px 8px; padding: 6px 24px 6px 8px;
width: 100px; width: auto;
white-space: nowrap;
} }
.rightclickmenu .rc-metacode ul ul, .rightclickmenu .rc-metacode ul ul,
.rightclickmenu .rc-siblings ul ul { .rightclickmenu .rc-siblings ul ul {
@ -1325,7 +1326,9 @@ float: left;
.rightclickmenu .rc-metacode ul ul li, .rightclickmenu .rc-metacode ul ul li,
.rightclickmenu .rc-siblings ul ul li { .rightclickmenu .rc-siblings ul ul li {
padding: 4px 10px 4px 8px; padding: 4px 10px 4px 8px;
width: 120px; width: auto;
white-space: nowrap;
height: 24px;
} }
.rightclickmenu .expandMetacodeSet { .rightclickmenu .expandMetacodeSet {
position: absolute; position: absolute;
@ -1338,8 +1341,10 @@ float: left;
background-position: 0 -32px; background-position: 0 -32px;
} }
.rightclickmenu .rc-metacode .mSelectName { .rightclickmenu .rc-metacode .mSelectName {
padding: 6px 0 0 32px; padding: 0 16px 0 4px;
display: block; display: inline-block;
position: relative;
top: -7px;
} }
.moveMenusUp .rc-metacode ul, .moveMenusUp .rc-metacode ul,

View file

@ -487,11 +487,12 @@ cursor: pointer;
} }
.CardOnGraph .metacodeSelect { .CardOnGraph .metacodeSelect {
display:none; display:none;
width:200px; width:auto;
z-index: 2; z-index: 2;
position: absolute; position: absolute;
background: #EAEAEA; background: #EAEAEA;
left: 300px; left: 300px;
white-space: nowrap;
} }
.CardOnGraph .metacodeSelect ul { .CardOnGraph .metacodeSelect ul {
position: relative; position: relative;
@ -506,10 +507,10 @@ cursor: pointer;
border: 1px solid #BDBDBD; border: 1px solid #BDBDBD;
} }
.CardOnGraph .metacodeSelect ul li { .CardOnGraph .metacodeSelect ul li {
background-color: #F5F5F5; background-color: #F5F5F5;
cursor:pointer; cursor:pointer;
position: relative; position: relative;
padding: 9px 12px; padding: 9px 24px 9px 12px;
} }
.CardOnGraph .metacodeSelect ul li:hover { .CardOnGraph .metacodeSelect ul li:hover {
background-color: #E0E0E0; background-color: #E0E0E0;
@ -520,15 +521,17 @@ background-color: #E0E0E0;
left: 8px; left: 8px;
} }
.CardOnGraph .metacodeSelect ul li .mSelectName { .CardOnGraph .metacodeSelect ul li .mSelectName {
padding-left: 28px; margin-left: 28px;
margin-right: 4px;
} }
.CardOnGraph .metacodeSelect ul ul { .CardOnGraph .metacodeSelect ul ul {
display:none; display:none;
position: absolute; position: absolute;
left: 200px; left: 100%;
top: -1px; top: -1px;
max-height: 270px; max-height: 270px;
overflow-y: auto; overflow-y: auto;
width: auto;
} }
.CardOnGraph .metacodeSelect li:hover ul { .CardOnGraph .metacodeSelect li:hover ul {
display: block; display: block;
@ -552,7 +555,7 @@ background-color: #E0E0E0;
} }
.onRightEdge.metacodeSelect ul ul { .onRightEdge.metacodeSelect ul ul {
left: auto; left: auto;
right: 200px; right: 100%;
} }
/* too close to bottom of screen case */ /* too close to bottom of screen case */
.onBottomEdge.metacodeSelect { .onBottomEdge.metacodeSelect {

View file

@ -13,7 +13,7 @@
<% set.metacodes.sort { |a, b| a.name <=> b.name }.each do |m| %> <% set.metacodes.sort { |a, b| a.name <=> b.name }.each do |m| %>
<li data-id="<%= m.id.to_s %>"> <li data-id="<%= m.id.to_s %>">
<img width="24" height="24" src="<%= m.icon %>" alt="<%= m.name %>" /> <img width="24" height="24" src="<%= m.icon %>" alt="<%= m.name %>" />
<span class="mSelectName"><%= m.name %></span> <div class="mSelectName"><%= m.name %></div>
<div class="clearfloat"></div> <div class="clearfloat"></div>
</li> </li>
<% end %> <% end %>
@ -27,7 +27,7 @@
<% Metacode.order("name").all.each do |m| %> <% Metacode.order("name").all.each do |m| %>
<li data-id="<%= m.id.to_s %>"> <li data-id="<%= m.id.to_s %>">
<img width="24" height="24" src="<%= m.icon %>" alt="<%= m.name %>" /> <img width="24" height="24" src="<%= m.icon %>" alt="<%= m.name %>" />
<span class="mSelectName"><%= m.name %></span> <div class="mSelectName"><%= m.name %></div>
<div class="clearfloat"></div> <div class="clearfloat"></div>
</li> </li>
<% end %> <% end %>