Skip to content
GitLab
Commit 6ab388a4 authored by Alexandru Băluț's avatar Alexandru Băluț
Browse files

Play the pronounciation directly from the homepage

parent d4ca256c
Pipeline #293845 passed with stage
in 1 minute and 30 seconds
Hide whitespace changes
Inline Side-by-side
layouts/index.html
View file @ 6ab388a4
{{ define "main" }}
<section class="centered-introduction">
<p>Pitivi <a href="/i/pitivi%20pronounciation.ogg" title="[pronounciation]"><img src="/i/audio-volume-medium-symbolic.svg" alt="pronounciation" style="width:16px; height:16px; border:0px;" /></a> is a Free video editor with a beautiful and intuitive user interface, a clean codebase and a fantastic community. <a href="/contribute/">Join us!</a></p>
<p><a href="" title="[pronounciation]" class="hidden" onclick="return play();">Pitivi <i id="audio_icon" class="fas fa-volume-up"></i></a> is a Free video editor with a beautiful and intuitive user interface, a clean codebase and a fantastic community. <a href="/contribute/">Join us!</a></p>
<audio id="audio" src="/i/pitivi%20pronounciation.ogg"></audio>
<script>
function play() {
let audio = document.getElementById("audio");
if (audio.paused) {
audio.play();
} else {
audio.pause();
}
return false;
}
function update() {
let button = document.getElementById("audio_icon");
if (audio.paused) {
button.className = "fas fa-volume-up";
} else {
button.className = "fas fa-pause";
}
}
const audio = document.getElementById("audio");
audio.addEventListener("pause", update);
audio.addEventListener("play", update);
</script>
</section>
<section id="frontpage_splash" class="auto-column-half">
......
static/css/pitivi.css
View file @ 6ab388a4
......@@ -70,10 +70,6 @@ section {
margin: 0em 1em;
}
section#frontpage_splash h1 {
font-family: 'Source Sans Pro', sans-serif;
}
section.centered-introduction {
max-width: 665px;
margin-left: auto;
......@@ -200,3 +196,13 @@ code {
.article-meta > li.article-meta-tag > a > i {
margin-right: 0.2em;
}
/* Home page */
section#frontpage_splash h1 {
font-family: 'Source Sans Pro', sans-serif;
}
#audio_icon {
width: 1.5em;
color: lightgrey;
}
\ No newline at end of file
static/i/audio-volume-medium-symbolic.svg deleted 100644 → 0
View file @ d4ca256c
<?xml version='1.0' encoding='UTF-8'?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg xmlns:cc='http://creativecommons.org/ns#' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' xmlns:svg='http://www.w3.org/2000/svg' id='svg7384' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' sodipodi:docname='audio-volume-medium-symbolic.svg' version='1.1' inkscape:version='0.48.0 r9654' height='16' xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns='http://www.w3.org/2000/svg' width='16'>
<metadata id='metadata90'>
<rdf:RDF>
<cc:Work rdf:about=''>
<dc:format>image/svg+xml</dc:format>
<dc:type rdf:resource='http://purl.org/dc/dcmitype/StillImage'/>
<dc:title>Gnome Symbolic Icon Theme</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<sodipodi:namedview inkscape:cy='-29.466236' pagecolor='#555753' borderopacity='1' showborder='false' inkscape:bbox-paths='false' guidetolerance='10' inkscape:object-paths='true' inkscape:window-width='1920' showguides='true' inkscape:object-nodes='true' inkscape:snap-bbox='true' inkscape:pageshadow='2' inkscape:guide-bbox='true' inkscape:snap-nodes='false' bordercolor='#666666' objecttolerance='10' id='namedview88' showgrid='false' inkscape:window-maximized='1' inkscape:window-x='0' inkscape:snap-global='true' inkscape:window-y='26' gridtolerance='10' inkscape:window-height='1021' inkscape:snap-to-guides='true' inkscape:current-layer='layer9' inkscape:snap-bbox-midpoints='false' inkscape:zoom='1' inkscape:cx='35.05917' inkscape:snap-grids='true' inkscape:pageopacity='1'>
<inkscape:grid spacingx='1px' spacingy='1px' id='grid4866' empspacing='2' enabled='true' type='xygrid' snapvisiblegridlinesonly='true' visible='true'/>
</sodipodi:namedview>
<title id='title9167'>Gnome Symbolic Icon Theme</title>
<defs id='defs7386'>
<clipPath id='clipPath6279-7-9' clipPathUnits='userSpaceOnUse'>
<rect x='26.85' y='220.75' id='rect6281-1-9' height='6.3750005' style='color:#bebebe;fill:#bebebe;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2;marker:none;visibility:visible;display:inline;overflow:visible' width='3.8250003'/>
</clipPath>
<clipPath id='clipPath6265-3-4' clipPathUnits='userSpaceOnUse'>
<rect x='26.96591' y='221.32954' id='rect6267-1-9' height='5.21591' style='color:#bebebe;fill:#bebebe;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2;marker:none;visibility:visible;display:inline;overflow:visible' width='2.8977277'/>
</clipPath>
<clipPath id='clipPath6259-8-81' clipPathUnits='userSpaceOnUse'>
<rect x='26.998718' y='221.50153' id='rect6261-6-6' height='4.8734746' style='color:#bebebe;fill:#bebebe;fill-opacity:1;stroke:none;stroke-width:2;marker:none;visibility:visible;display:inline;overflow:visible' width='1.8762827'/>
</clipPath>
</defs>
<g inkscape:label='status' transform='translate(-61.0002,-197)' inkscape:groupmode='layer' id='layer9' style='display:inline'>
<path inkscape:connector-curvature='0' d='m 61.0002,202 2.484375,0 2.968754,-3 0.546871,0.0156 0,11 -0.475297,8.3e-4 L 63.484575,207 l -2.484375,0 0,-5 z' id='path5533' sodipodi:nodetypes='ccccccccc' style='color:#bebebe;fill:#bebebe;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;marker:none;visibility:visible;display:inline;overflow:visible'/>
<path transform='matrix(0.784314,0,0,0.784314,46.94138,28.862801)' inkscape:connector-curvature='0' d='m 26.9375,220.40625 a 1.2751275,1.2751275 0 0 0 -0.65625,2.1875 c 0.757556,0.75756 0.757556,1.92994 0,2.6875 a 1.281631,1.281631 0 1 0 1.8125,1.8125 c 1.732036,-1.73204 1.732036,-4.58046 0,-6.3125 a 1.2751275,1.2751275 0 0 0 -1.15625,-0.375 z' clip-path='url(#clipPath6279-7-9)' id='path3718-5' style='font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;baseline-shift:baseline;color:#000000;fill:#bebebe;fill-opacity:1;stroke:none;stroke-width:2.54999995;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate;font-family:Sans;-inkscape-font-specification:Sans'/>
<path transform='matrix(1.72549,0,0,1.72549,23.4708,-181.902)' inkscape:connector-curvature='0' d='m 27.125,221.09375 a 0.57960298,0.57960298 0 0 0 -0.34375,1 c 1.023324,1.02332 1.023324,2.66418 0,3.6875 a 0.57960298,0.57960298 0 1 0 0.8125,0.8125 c 1.466269,-1.46627 1.466269,-3.84623 0,-5.3125 a 0.57960298,0.57960298 0 0 0 -0.46875,-0.1875 z' clip-path='url(#clipPath6265-3-4)' id='path3726-1' style='font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;baseline-shift:baseline;color:#000000;fill:#bebebe;fill-opacity:1;stroke:none;stroke-width:1.15909004;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate;font-family:Sans;-inkscape-font-specification:Sans'/>
<path transform='matrix(2.66667,0,0,2.66667,2e-4,-392.666)' inkscape:connector-curvature='0' d='m 27.0625,221.3125 a 0.3750375,0.3750375 0 0 0 -0.125,0.625 c 1.10149,1.10149 1.10149,2.89851 0,4 a 0.37565048,0.37565048 0 1 0 0.53125,0.53125 c 1.388102,-1.3881 1.388102,-3.6744 0,-5.0625 a 0.3750375,0.3750375 0 0 0 -0.40625,-0.0937 z' clip-path='url(#clipPath6259-8-81)' id='path3728-0' style='font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;baseline-shift:baseline;opacity:0.35;color:#000000;fill:#bebebe;fill-opacity:1;stroke:none;stroke-width:0.75;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate;font-family:Sans;-inkscape-font-specification:Sans'/>
</g>
<g inkscape:label='devices' transform='translate(-61.0002,-197)' inkscape:groupmode='layer' id='layer10'/>
<g inkscape:label='apps' transform='translate(-61.0002,-197)' inkscape:groupmode='layer' id='layer11'/>
<g inkscape:label='actions' transform='translate(-61.0002,-197)' inkscape:groupmode='layer' id='layer12'/>
<g inkscape:label='places' transform='translate(-61.0002,-197)' inkscape:groupmode='layer' id='layer13'/>
<g inkscape:label='mimetypes' transform='translate(-61.0002,-197)' inkscape:groupmode='layer' id='layer14'/>
<g inkscape:label='emblems' transform='translate(-61.0002,-197)' inkscape:groupmode='layer' id='layer15' style='display:inline'/>
<g inkscape:label='categories' transform='translate(-61.0002,-197)' inkscape:groupmode='layer' id='g4953' style='display:inline'/>
</svg>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment