josh/dashy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adds fancy scrollbar

Browse Source
This commit is contained in:
Alicia Sykes
2021-05-31 14:25:25 +01:00
parent 10ec99d742
commit a75db93e8e
6 changed files with 63 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Configuration/CloudBackupRestore.vue
View File

@@ -3,7 +3,7 @@
<div class="section intro">
<h2>Cloud Backup & Restore</h2>
<p class="intro">
Cloud backup and restore is an optional feature, that enabled you to upload your
Cloud backup and restore is an optional feature, that enables you to upload your
config to the internet, and then restore it on any other device or instance of Dashy.
<br><br>
All data is fully end-to-end encrypted with AES, using your password as the key.

2
src/components/Configuration/ConfigContainer.vue
View File

@@ -126,6 +126,7 @@ export default {
</script>
<style scoped lang="scss">
@import '@/styles/style-helpers.scss';
pre {
color: var(--config-code-color);
@@ -204,6 +205,7 @@ div.code-container {
.tab-item {
overflow-y: auto;
@extend .scroll-bar;
background: var(--config-settings-background);
&.main-tab {
min-height: 500px;

27
src/components/LinkItems/ItemGroup.vue
View File

@@ -96,6 +96,7 @@ export default {
<style scoped lang="scss">
@import '@/styles/media-queries.scss';
@import '@/styles/style-helpers.scss';
.no-items {
width: 100px;
@@ -115,24 +116,14 @@ export default {
flex-wrap: wrap;
&.item-group-grid {
display: grid;
@include phone {
grid-template-columns: repeat(1, 1fr);
}
@include tablet {
grid-template-columns: repeat(2, 1fr);
}
@include laptop {
grid-template-columns: repeat(2, 1fr);
}
@include monitor {
grid-template-columns: repeat(3, 1fr);
}
@include big-screen {
grid-template-columns: repeat(4, 1fr);
}
@include big-screen-up {
grid-template-columns: repeat(5, 1fr);
}
overflow: auto;
@extend .scroll-bar;
@include phone { grid-template-columns: repeat(1, 1fr); }
@include tablet { grid-template-columns: repeat(2, 1fr); }
@include laptop { grid-template-columns: repeat(2, 1fr); }
@include monitor { grid-template-columns: repeat(3, 1fr); }
@include big-screen { grid-template-columns: repeat(4, 1fr); }
@include big-screen-up { grid-template-columns: repeat(5, 1fr); }
}
}