Add mobile_apps css also remove the _new

pull/14080/head
rubenmoya 6 years ago
parent 54df7f985f
commit 4d7807ce19

@ -8,11 +8,7 @@
var organization_notifications = <%= safe_js_object @organization_notifications.to_json %>;
</script>
<% if @has_new_dashboard %>
<%= javascript_include_tag 'common_dashboard', 'mobile_apps_new_vendor', 'mobile_apps_new' %>
<% else %>
<%= javascript_include_tag 'cdb.js', 'models.js', 'mobile_apps_templates.js', 'account_deps.js', 'mobile_apps.js' %>
<% end %>
<%= javascript_include_tag 'common_dashboard', 'mobile_apps_vendor', 'mobile_apps' %>
<% end %>
<%= content_for(:css) do %>
<%= stylesheet_link_tag 'mobile_apps.css', :media => 'all' %>

@ -10,10 +10,7 @@
var organization_notifications = <%= safe_js_object @organization_notifications.to_json %>;
</script>
<% if @has_new_dashboard %>
<%= javascript_include_tag 'common_dashboard', 'mobile_apps_new_vendor', 'mobile_apps_new' %>
<% else %>
<%= javascript_include_tag 'cdb.js', 'models.js', 'mobile_apps_templates.js', 'account_deps.js', 'mobile_apps.js' %>
<%= javascript_include_tag 'common_dashboard', 'mobile_apps_vendor', 'mobile_apps' %>
<% end %>
<% end %>

@ -11,11 +11,7 @@
var organization_notifications = <%= safe_js_object @organization_notifications.to_json %>;
</script>
<% if @has_new_dashboard %>
<%= javascript_include_tag 'common_dashboard', 'mobile_apps_new_vendor', 'mobile_apps_new' %>
<% else %>
<%= javascript_include_tag 'cdb.js', 'models.js', 'mobile_apps_templates.js', 'account_deps.js', 'mobile_apps.js' %>
<% end %>
<%= javascript_include_tag 'common_dashboard', 'mobile_apps_vendor', 'mobile_apps' %>
<% end %>
<%= content_for(:css) do %>
<%= stylesheet_link_tag 'mobile_apps.css', :media => 'all' %>

@ -0,0 +1,62 @@
// MobileApps bars
// --------------------------------------------------
@import '../variables/colors';
@import '../variables/sizes';
.ProgressBars {
display: flex;
flex-direction: column;
align-items: flex-start;
padding: 25px 0;
}
.ProgressBar-container {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
width: 100%;
&:not(:last-child) {
margin-bottom: 20px;
}
}
.ProgressBar {
display: block;
position: relative;
width: 380px;
height: 6px;
overflow: hidden;
border-radius: 3px;
background: #F5F5F5;
}
.ProgressBar-bar {
position: absolute;
z-index: 2;
top: 0;
bottom: 0;
left: 0;
min-width: 1%;
margin: 0;
border-radius: 3px;
background: #1181FB;
}
.ProgressBar-bar.is-danger {
background: $cHighlight-negative;
}
.ProgressBar-bar.is-caution {
background: $cHighlight-caution;
}
.ProgressBar-legend {
margin-left: $sMargin-elementInline;
color: $cTypography-secondary;
font-size: $sFontSize-smallUpperCase;
font-weight: $sFontWeight-lighter;
line-height: 12px;
}

@ -0,0 +1,113 @@
// MobileApps items list
// --------------------------------------------------
@import '../variables/colors';
@import '../variables/sizes';
$selectedItemPaddingOnSides: $sMargin-element - 1px;
.MobileAppsList {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
width: 100%;
padding-bottom: 30px;
}
.MobileAppsList-item {
display: flex;
position: relative;
flex-direction: row;
align-items: flex-end;
width: 100%;
padding: $sMargin-element 0;
text-decoration: none;
&:last-child {
margin-bottom: 28px;
}
&:not(:last-child) {
border-bottom: 1px solid $cStructure-softLine;
}
}
.MobileAppsList-itemIcon {
width: 42px;
height: 42px;
margin-right: 20px;
}
.MobileAppsList-statusIcon {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
}
.MobileAppsList-statusIcon--open {
background-color: $cHighlight-positive;
}
.MobileAppsList-statusIcon--dev {
background-color: $cHighlight-alert4;
}
.MobileAppsList-statusIcon--private {
background-color: $cHighlight-negative;
}
.MobileAppsList-itemIcon--img {
border: 0;
}
.MobileAppsList-itemInfo {
display: flex;
flex-direction: row;
align-items: flex-end;
justify-content: space-between;
width: 100%;
}
.MobileAppsList-itemInfoName {
display: flex;
flex-direction: column;
align-content: space-between;
justify-content: space-between;
height: 42px;
}
.MobileAppsList-itemInfoTitle {
max-width: 350px;
color: $cHighlight-main;
font-size: 14px;
font-weight: $sFontWeight-normal;
}
.MobileAppsList-itemInfoSubtitle {
max-width: 350px;
color: $cTypography-secondary;
font-size: 13px;
font-weight: 300;
}
.MobileAppsList-details {
display: flex;
flex-direction: column;
align-items: flex-end;
}
.MobileAppsList-details--paragraph {
color: $cTypography-linkSecondary;
font-size: 14px;
font-weight: 300;
}
.MobileAppsList-detail:not(:last-child) {
margin-right: 15px;
}
.MobileAppsList-details--icon {
margin-right: 2px;
font-size: 12px;
}

@ -0,0 +1,55 @@
// MobileApps plan
// --------------------------------------------------
@import '../variables/colors';
@import '../variables/sizes';
.MobilePlan {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 25px 0;
border-bottom: 1px solid rgba(#000, 0.1);
}
.MobilePlan-items {
display: flex;
flex: 1;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.MobilePlan-icon {
width: 40px;
height: 40px;
margin-right: 15px;
border-radius: 4px;
border-color: #73C86B;
color: #73C86B;
line-height: 50px;
text-align: center;
i {
height: 35px;
font-size: 25px;
}
}
.MobilePlan-info {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.MobilePlan-title--lightGreen {
color: $cTypography-paragraphs;
font-size: 16px;
}
.MobilePlan-subtitle {
color: $cTypography-secondary;
font-size: 13px;
font-weight: normal;
}

@ -49,7 +49,10 @@ module.exports = {
data_library_new: rootDir('lib/assets/javascripts/dashboard/data-library.js'),
mobile_apps_new: rootDir('lib/assets/javascripts/dashboard/mobile-apps.js'),
mobile_apps: [
rootDir('lib/assets/javascripts/dashboard/mobile-apps.js'),
...glob.sync(rootDir('assets/stylesheets/mobile_apps/*.css'))
],
account: rootDir('lib/assets/javascripts/dashboard/account.js'),

Loading…
Cancel
Save