Lissy93/dashy
1
1
Fork 0
mirror of https://github.com/Lissy93/dashy.git synced 2024-12-24 09:22:53 +03:00
Code Issues Packages Projects Releases Wiki Activity

Adds note on small screens

Browse Source
This commit is contained in:
Alicia Sykes 2021-06-09 14:03:15 +01:00
parent 733794b57f
commit 7ab32686ba
1 changed files with 18 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -29,6 +29,9 @@
<DeleteIcon class="button-icon"/>
Reset Local Settings
</button>
<p class="small-screen-note" style="display: none;">
You are using a very small screen, and some screens in this menu may not be optimal
</p>
<div class="config-note">
<p class="sub-title">Note:</p>
<span>
@ -151,6 +154,7 @@ export default {
<style scoped lang="scss">
@import '@/styles/style-helpers.scss';
@import '@/styles/media-queries.scss';
pre {
color: var(--config-code-color);
@ -270,7 +274,7 @@ a.hyperlink-wrapper {
border: 1px dashed var(--config-settings-color);
border-radius: var(--curve-factor);
text-align: left;
opacity: var(--dimming-factor);
opacity: 0.95;
color: var(--config-settings-color);
background: var(--config-settings-background);
p.sub-title {
@ -278,6 +282,19 @@ a.hyperlink-wrapper {
margin: 0;
display: inline;
}
display: none;
@include tablet-up { display: block; }
}
p.small-screen-note {
@include phone {
display: block !important;
}
margin: 0.5rem auto;
padding: 0 0.5rem;
text-align: center;
opacity: 0.8;
font-size: 0.9rem;
color: var(--warning);
}
</style>