jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Hide geeky toolbar in apps icons

Browse Source
This commit is contained in:
Johannes Zellner
2015-08-11 12:26:19 +02:00
parent 0ea14db172
commit f74f713bbd
2 changed files with 77 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
webadmin/src/theme.scss
View File

@@ -120,6 +120,14 @@ html {
.grid-item {
padding: 10px;
min-width: 200px;
overflow: hidden;
}
.grid-item:hover .grid-item-bottom {
@media(min-width:768px) {
opacity: 1;
right: 10px;
}
}
.grid-item-content {
@@ -132,10 +140,32 @@ html {
padding: 10px 15px;
}
.grid-item-bottom {
.grid-item-bottom-mobile {
padding: 10px 15px;
border-top: 1px solid #ddd;
background-color: white
background-color: white;
@media(min-width:768px) {
display: none;
}
}
.grid-item-bottom {
display: none;
padding: 10px 15px;
border-top: 1px solid #ddd;
background-color: white;
@media(min-width:768px) {
display: block;
position: absolute;
top: 0;
right: -10px;
opacity: 0;
background-color: transparent;
transition: all 250ms;
}
}
// ----------------------------

68
webadmin/src/views/apps.html
View File

@@ -54,7 +54,7 @@
</form>
</fieldset>
</div>
<div class="modal-footer">
<div class="modal-footer ">
<button type="button" class="btn btn-default" style="float: left;" ng-click="startApp(appConfigure.app)" ng-show="appConfigure.app.runState === 'stopped' && !appConfigure.runStateBusy && !(appConfigure.app | installationActive)"><i class="fa fa-play"></i> Start</button>
<button type="button" class="btn btn-default" style="float: left;" ng-show="appConfigure.app.runState !== 'stopped' && appConfigure.app.runState !== 'running' || appConfigure.runStateBusy && !(appConfigure.app | installationActive)" disabled ><i class="fa fa-refresh fa-spin"></i></button>
<button type="button" class="btn btn-default" style="float: left;" ng-click="stopApp(appConfigure.app)" ng-show="appConfigure.app.runState === 'running' && !appConfigure.runStateBusy && !(appConfigure.app | installationActive)"><i class="fa fa-pause"></i> Stop</button>
@@ -214,31 +214,53 @@
</div>
</div>
</div>
</a>
<div class="grid-item-bottom" ng-show="user.admin">
<div class="row">
<div class="col-xs-4 text-left">
<a href="" ng-click="showRestore(app)" ng-show="(app | installError) === true">
<i class="fa fa-undo scale"></i>
</a>
<div class="grid-item-bottom-mobile" ng-show="user.admin">
<div class="row">
<div class="col-xs-4 text-left">
<a href="" ng-click="showRestore(app)" ng-show="(app | installError) === true">
<i class="fa fa-undo scale"></i>
</a>
<a href="" ng-click="showConfigure(app)" ng-show="(app | installSuccess) == true">
<i class="fa fa-wrench scale"></i>
</a>
</div>
<div class="col-xs-4 text-center">
<!-- we check the version here because the box updater does not know when an app gets updated -->
<a href="" ng-click="showUpdate(app)" class="ng-hide animateMe" ng-show="config.update.apps[app.id].manifest.version && config.update.apps[app.id].manifest.version !== app.manifest.version && (app | installSuccess)">
<i class="fa fa-arrow-up text-success scale"></i>
</a>
</div>
<div class="col-xs-4 text-right">
<a href="" ng-click="showUninstall(app)">
<i class="fa fa-remove scale"></i>
</a>
<a href="" ng-click="showConfigure(app)" ng-show="(app | installSuccess) == true">
<i class="fa fa-wrench scale"></i>
</a>
</div>
<div class="col-xs-4 text-center">
<!-- we check the version here because the box updater does not know when an app gets updated -->
<a href="" ng-click="showUpdate(app)" class="ng-hide animateMe" ng-show="config.update.apps[app.id].manifest.version && config.update.apps[app.id].manifest.version !== app.manifest.version && (app | installSuccess)">
<i class="fa fa-arrow-up text-success scale"></i>
</a>
</div>
<div class="col-xs-4 text-right">
<a href="" ng-click="showUninstall(app)">
<i class="fa fa-remove scale"></i>
</a>
</div>
</div>
</div>
</div>
<div class="grid-item-bottom" ng-show="user.admin">
<br/>
<div>
<a href="" ng-click="showUninstall(app)"><i class="fa fa-remove scale"></i></a>
</div>
<div ng-show="(app | installError) === true">
<a href="" ng-click="showRestore(app)"><i class="fa fa-undo scale"></i></a>
</div>
<div ng-show="(app | installSuccess) == true">
<a href="" ng-click="showConfigure(app)"><i class="fa fa-wrench scale"></i></a>
</div>
<!-- we check the version here because the box updater does not know when an app gets updated -->
<div ng-show="config.update.apps[app.id].manifest.version && config.update.apps[app.id].manifest.version !== app.manifest.version && (app | installSuccess)">
<a href="" ng-click="showUpdate(app)"><i class="fa fa-arrow-up text-success scale"></i></a>
</div>
<br/>
</div>
</a>
</div>
</div>
</div>