franzz/spot
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Adding credits

Browse Source
This commit is contained in:
Franzz
2020-04-26 17:54:39 +02:00
parent 33c320bf5c
commit f0ee1f061c
7 changed files with 127 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
languages/en.lang
View File

@@ -101,4 +101,8 @@ distance = Distance
elevation = Elevation elevation = Elevation
segment_length = Segment length segment_length = Segment length
type = Track Type type = Track Type
legend = Legend legend = Legend
credits_project = Spotty Project
credits_git = Git Repository
credits_license = under GPLv3 license

6
languages/fr.lang
View File

@@ -101,4 +101,8 @@ distance = Distance
elevation = Dénivelé elevation = Dénivelé
segment_length = Taille du segment segment_length = Taille du segment
type = Type de rando type = Type de rando
legend = Légende legend = Légende
credits_project = Projet Spotty
credits_git = Dépôt Git
credits_license = sous licence GPLv3

37
masks/project.html
View File

@@ -4,22 +4,27 @@
</div> </div>
<div id="map"></div> <div id="map"></div>
<div id="settings"> <div id="settings">
<div id="settings-sections"> <div id="settings-panel">
<div class="settings-section title"><div class="logo"><img src="images/logo_black.png" /></div></div> <div class="settings-header"><div class="logo"><img src="images/logo_black.png" /></div></div>
<div class="settings-section"> <div class="settings-sections">
<h1><i class="fa fa-fw push fa-map"></i>[#]lang:maps[#]</h1> <div id="settings-sections-scrollbox">
<div id="layers"></div> <div class="settings-section">
</div> <h1><i class="fa fa-fw push fa-map"></i>[#]lang:maps[#]</h1>
<div class="settings-section newsletter"> <div id="layers"></div>
<h1><i class="fa fa-fw push fa-newsletter"></i>[#]lang:newsletter[#]</h1> </div>
<input type="email" name="email" id="email" placeholder="[#]lang:nl_email_placeholder[#]" /><button id="nl_btn"><span><i class="fa"></i></span></button> <div class="settings-section newsletter">
<div id="settings-feedback" class="feedback"></div> <h1><i class="fa fa-fw push fa-newsletter"></i>[#]lang:newsletter[#]</h1>
<div id="nl_desc"></div> <input type="email" name="email" id="email" placeholder="[#]lang:nl_email_placeholder[#]" /><button id="nl_btn"><span><i class="fa"></i></span></button>
</div> <div id="settings-feedback" class="feedback"></div>
<div class="settings-section"> <div id="nl_desc"></div>
<h1><i class="fa fa-fw push fa-project"></i>[#]lang:projects[#]</h1> </div>
<div id="settings-projects"></div> <div class="settings-section">
<h1><i class="fa fa-fw push fa-project"></i>[#]lang:projects[#]</h1>
<div id="settings-projects"></div>
</div>
</div>
</div> </div>
<div class="settings-footer"><a href="https://git.lutran.fr/franzz/spot" title="[#]lang:credits_git[#]" target="_blank"><i class="fa fa-credits push"></i>[#]lang:credits_project[#]</a> [#]lang:credits_license[#]</div>
</div> </div>
</div> </div>
<div id="feed"> <div id="feed">
@@ -255,7 +260,7 @@ function initPosts() {
function initSettings(){ function initSettings(){
//Scrollbar //Scrollbar
new SimpleBar($('#settings-sections')[0]); new SimpleBar($('#settings-sections-scrollbox')[0]);
//Feedback display function //Feedback display function
var settingsFeedback = function(sType, sMsg){ var settingsFeedback = function(sType, sMsg){

1
style/_fa.scss
View File

@@ -59,6 +59,7 @@ $fa-css-prefix: fa;
.#{$fa-css-prefix}-warning:before { content: fa-content($fa-var-exclamation-triangle); } .#{$fa-css-prefix}-warning:before { content: fa-content($fa-var-exclamation-triangle); }
.#{$fa-css-prefix}-success:before { content: fa-content($fa-var-check-circle); } .#{$fa-css-prefix}-success:before { content: fa-content($fa-var-check-circle); }
.#{$fa-css-prefix}-unsubscribe:before { content: fa-content($fa-var-times); } .#{$fa-css-prefix}-unsubscribe:before { content: fa-content($fa-var-times); }
.#{$fa-css-prefix}-credits:before { content: fa-content($fa-var-paw); }
/* Feed */ /* Feed */
.#{$fa-css-prefix}-post:before { content: fa-content($fa-var-comment); } .#{$fa-css-prefix}-post:before { content: fa-content($fa-var-comment); }

156
style/_mask_project.scss
View File

@@ -70,7 +70,7 @@ $legend-color: $post-color;
} }
} }
&:not(.with-settings) { &:not(.with-settings) {
#settings #settings-sections { #settings #settings-panel {
left: -100%; left: -100%;
} }
} }
@@ -448,13 +448,11 @@ $legend-color: $post-color;
width: calc(#{$panel-width} + 3px); //Add box-shadow width: calc(#{$panel-width} + 3px); //Add box-shadow
max-width: calc(#{$panel-width-max} + 3px); //Add box-shadow max-width: calc(#{$panel-width-max} + 3px); //Add box-shadow
#settings-sections { #settings-panel {
width: calc(100% - 3rem - 3px); //Remove box-shadow width: calc(100% - #{$block-spacing} - 3px); //Remove box-shadow
margin: $block-spacing; margin: $block-spacing;
padding: $block-spacing;
background: white;
border-radius: 3px; border-radius: 3px;
box-shadow: 2px 2px 3px 0px rgba(0,0,0,.5); box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, .5);
position: absolute; position: absolute;
transition: all 0.5s; transition: all 0.5s;
top: 0; top: 0;
@@ -462,75 +460,105 @@ $legend-color: $post-color;
left: 0; left: 0;
color: $post-color; color: $post-color;
background: rgba(255, 255, 255, 0.8); background: rgba(255, 255, 255, 0.8);
display: flex;
.settings-section { flex-direction: column;
display: inline-block;
width: 100%;
margin-top: 1.5rem;
h1 {
margin: 0 0 $block-spacing;
}
label { .settings-header {
margin-bottom: .3em; text-align: center;
display: block; flex: 0 1 auto;
cursor: pointer;
}
&.title { .logo {
margin: -#{$block-spacing} -#{$block-spacing} 0 -#{$block-spacing}; background: rgba(255, 255, 255, .4);
width: calc(100% + 2rem); padding: 1.5rem;
text-align: center; border-radius: 3px 3px 0 0;
.logo { img {
background: rgba(255, 255, 255, .4); width: 100%;
padding: 1.5rem; max-width: 180px;
border-radius: 3px 3px 0 0; transform: translateX(-10%); //Center Text, not logo. logo width (40px) / image width (200px) = 20%. And centering: 20% / 2 = 10%
img {
width: calc(100% - 3rem);
max-width: 180px;
transform: translateX(-10%); //Center Text, not logo. logo width (40px) / image width (200px) = 20%. And centering: 20% / 2 = 10%
}
} }
} }
}
&.newsletter { .settings-footer {
input#email { flex: 0 1 auto;
width: calc(100% - 6em); background: rgba(255, 255, 255, .4);
border-radius: 0 0 3px 3px;
&:disabled { font-size: 0.7em;
color: #999; padding: 0.3rem;
background: rgba(255,255,255,0.2); text-align: center;
} color: #888;
a {
color: #777;
text-decoration: none;
}
}
.settings-sections {
flex: 1 1 auto;
overflow: hidden;
#settings-sections-scrollbox {
height: 100%;
width: 100%;
}
.settings-section {
display: inline-block;
margin: 1.5rem 1rem 0 1rem;
width: calc(100% - 2 * #{$block-spacing});
&:last-child {
margin-bottom: 1.5rem;
} }
button#nl_btn {
margin-left: 1em; h1 {
margin-bottom: 1em; margin: 0 0 $block-spacing;
}
&.subscribe .fa {
@extend .fa-send; label {
margin-bottom: .3em;
display: block;
cursor: pointer;
}
&.newsletter {
input#email {
width: calc(100% - 6em);
&:disabled {
color: #999;
background: rgba(255,255,255,0.2);
}
} }
&.unsubscribe .fa { button#nl_btn {
@extend .fa-unsubscribe; margin-left: 1em;
} margin-bottom: 1em;
&.loading {
background-color: $message-color; &.subscribe .fa {
color: white; @extend .fa-send;
span { }
@extend .flicker; &.unsubscribe .fa {
@extend .fa-unsubscribe;
}
&.loading {
background-color: $message-color;
color: white;
span {
@extend .flicker;
}
} }
} }
} }
}
#settings-projects {
#settings-projects { a.fa-download {
a.fa-download { color: $legend-color;
color: $legend-color;
&:hover {
&:hover { color: #0078A8;
color: #0078A8; }
} }
} }
} }

4
style/spot.css
View File

File diff suppressed because one or more lines are too long

2
style/spot.css.map
View File

File diff suppressed because one or more lines are too long