initial commit

1 files changed, 118 insertions, 0 deletions

diff --git a/muk_web_theme/static/src/scss/apps.scss b/muk_web_theme/static/src/scss/apps.scss
new file mode 100644
index 0000000..6374c1c
--- /dev/null
+++ b/muk_web_theme/static/src/scss/apps.scss
@@ -0,0 +1,118 @@
+/**********************************************************************************
+*
+*    Copyright (c) 2017-today MuK IT GmbH.
+*
+*    This file is part of MuK Grid Snippets
+*    (see https://mukit.at).
+*
+*    This program is free software: you can redistribute it and/or modify
+*    it under the terms of the GNU Lesser General Public License as published by
+*    the Free Software Foundation, either version 3 of the License, or
+*    (at your option) any later version.
+*
+*    This program is distributed in the hope that it will be useful,
+*    but WITHOUT ANY WARRANTY; without even the implied warranty of
+*    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+*    GNU Lesser General Public License for more details.
+*
+*    You should have received a copy of the GNU Lesser General Public License
+*    along with this program. If not, see <http://www.gnu.org/licenses/>.
+*
+**********************************************************************************/
+
+.o_menu_apps {
+	.full {    
+		width: 46px;
+		font-size: 18px;
+		text-align: center;
+	}
+    .dropdown-menu.show {
+		@include mk-full-screen-sections();
+		align-content: flex-start;
+		overflow: inital;
+		display: flex;
+		flex-direction: row;
+		flex-wrap: wrap;
+		justify-content: flex-start;
+		@include media-breakpoint-up(lg) {
+		    padding: {
+		        left: 20vw;
+		        right: 20vw;
+		    }
+		}
+		.o_app {
+		    display: flex;
+			margin-top: 20px;
+		    align-items: center;
+		    flex-direction: column;
+		    justify-content: flex-start;
+		    width: percentage(1/3);
+		    @include media-breakpoint-up(sm) {
+		        width: percentage(1/4);
+		    }
+		    @include media-breakpoint-up(md) {
+		        width: percentage(1/6);
+		    }
+		    &:hover, &:focus, &:active, &.active {
+				background: none;
+				.o-app-icon {
+					box-shadow: 0 8px 15px -10px black;
+				    transform: translateY(-1px);
+				}
+		    }
+		}
+		.has-results ~ .o_app {
+		    display: none;
+		}
+		.o-app-icon {
+		    height: auto;
+		    max-width: 7rem;
+		    width: 100%;
+		    flex-basis: 0;
+		}
+		.o-app-name {
+			color: $mk-apps-color; 
+		}
+		.form-row {
+		    width: 100%;
+		}
+		.mk_search_container {
+			margin-top: 25px;
+			.mk_search_input {
+				input:focus {
+			    	box-shadow: none;
+					border: 1px solid $gray-400;
+			    }
+			}
+			&.has-results {
+		        height: 100%;
+		        .mk_search_input {
+		            height: 3em;
+		        }
+		        .mk_search_results {
+		            height: calc(100% - 3em);
+		            .mk_menu_search_result {
+					    display: block;
+					    cursor: pointer;
+					    align-items: center;
+					    padding-left: 3rem;
+					    padding-right: 1rem;
+					    background-position: left;
+					    background-repeat: no-repeat;
+					    background-size: contain;
+	            	    white-space: nowrap;
+					    overflow: hidden;
+					    text-overflow: ellipsis;
+		            	color: $mk-apps-color;
+		            	&:hover, &:active, &.active {
+		            		background-color: rgba(255, 255, 255, 0.05);
+		            	} 
+					}
+		        }
+		    }
+			@include media-breakpoint-down(md) {
+				padding-right: 5px;
+			}
+		}
+	}
+}
\ No newline at end of file