Andreas/ngx-admin
1
0
Fork 0
mirror of https://github.com/akveo/ngx-admin.git synced 2025-12-20 09:20:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor(iot): kitten widget

Browse source
This commit is contained in:
Sergey Andrievskiy 2019-06-18 16:35:58 +03:00
parent 46ce65bf88
commit 8b55e678af
2 changed files with 23 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/app/pages/dashboard/kitten/kitten.component.html
View file

@ -1,30 +1,25 @@
<nb-card size="medium">
<nb-card-body>
<div class="picture" style.background-image="url('assets/images/kitten-{{currentTheme}}.png')"></div>
<div class="picture" style.background-image="url('assets/images/kitten-{{currentTheme}}.png')"></div>
<div class="details">
<div class="title">
React Native UI Kitten
</div>
<div class="description">
React Native UI Kitten is a framework that contains a set of commonly used UI components styled in a similar way. The most awesome thing: you can change themes on the fly by just passing a different set of variables. 100% native. Give our kitten a try!
</div>
<div class="details">
<div class="h4">UI Kitten</div>
<div class="description">
UI Kitten is a framework that contains a set of commonly used UI components styled in a similar way. The most awesome thing: you can change themes on the fly by just passing a different set of variables. 100% native. Give our kitten a try!
</div>
</nb-card-body>
</div>
<nb-card-footer>
<a href="https://akveo.github.io/react-native-ui-kitten" target="_blank">
<i class="ion-ios-world"></i>
<nb-icon icon="globe" pack="eva"></nb-icon>
</a>
<a href="https://itunes.apple.com/us/app/kitten-tricks/id1246143230" target="_blank">
<i class="ion-social-apple"></i>
<i class="link-icon ion-social-apple"></i>
</a>
<a href="https://play.google.com/store/apps/details?id=com.akveo.kittenTricks" target="_blank">
<i class="ion-social-android"></i>
<i class="link-icon ion-social-android"></i>
</a>
<a href="https://github.com/akveo/react-native-ui-kitten" target="_blank">
<i class="ion-social-github"></i>
<nb-icon icon="github" pack="eva"></nb-icon>
</a>
</nb-card-footer>
</nb-card>

52
src/app/pages/dashboard/kitten/kitten.component.scss
View file

@ -2,12 +2,6 @@
@include nb-install-component() {
nb-card-body {
display: flex;
flex-direction: column;
padding: 0;
}
.picture {
background-position: center;
background-size: cover;
@ -18,48 +12,28 @@
}
.details {
padding: 1.25rem 1.25rem 0;
padding: nb-theme(card-padding);
}
.title {
font-family: nb-theme(font-secondary);
font-weight: nb-theme(font-weight-bold);
color: nb-theme(color-fg-heading);
font-size: 1.5rem;
margin-bottom: 1rem;
@include nb-for-theme(cosmic) {
font-weight: nb-theme(font-weight-bolder);
}
}
.description {
text-align: justify;
color: nb-theme(color-fg-text);
font-weight: nb-theme(font-weight-light);
overflow: hidden;
text-overflow: ellipsis;
max-height: calc(1rem * 8 * #{nb-theme(line-height)});
}
.description {
text-align: justify;
}
nb-card-footer {
display: flex;
justify-content: space-around;
padding: 0.75rem 0;
border: none;
align-items: center;
}
a {
text-decoration: none;
color: nb-theme(color-fg);
.link-icon {
font-size: 1.75rem;
}
&:hover {
color: nb-theme(color-fg-heading);
}
nb-icon {
font-size: 1.55rem;
i {
font-size: 1.75rem;
}
::ng-deep svg {
vertical-align: top;
}
}
}