Commit 08239fa9 authored by Carl Schwan's avatar Carl Schwan 🚴

Rewamp user support page

parent 4cf2ba1b
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg width="64" version="1.1" xmlns="http://www.w3.org/2000/svg" height="64" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape">
<defs id="defs3811">
<linearGradient inkscape:collect="always" id="linearGradient4344">
<stop style="stop-color:#ed868d" id="stop4346"/>
<stop offset="1" style="stop-color:#fbe6e8" id="stop4348"/>
</linearGradient>
<linearGradient inkscape:collect="always" id="linearGradient4435">
<stop style="stop-color:#c61423" id="stop4437"/>
<stop offset="1" style="stop-color:#dc2b41" id="stop4439"/>
</linearGradient>
<linearGradient inkscape:collect="always" xlink:href="#linearGradient4400" id="linearGradient4394" y1="19.999998" x1="19.999998" y2="44" x2="43.999996" gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 1 0 -7)"/>
<linearGradient inkscape:collect="always" id="linearGradient4400">
<stop style="stop-color:#020303" id="stop4402"/>
<stop offset="1" style="stop-color:#424649;stop-opacity:0" id="stop4404"/>
</linearGradient>
<linearGradient inkscape:collect="always" xlink:href="#linearGradient4344" id="linearGradient4179" y1="201.93361" y2="177.93361" x2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 1 0 -7)"/>
<linearGradient inkscape:collect="always" xlink:href="#linearGradient4435" id="linearGradient4416" y1="43.999989" y2="6.999989" x2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-1.4054053 0 0 1.4054053 804.69502 154.09579)"/>
</defs>
<metadata id="metadata3814"/>
<g inkscape:label="Layer 1" inkscape:groupmode="layer" id="layer1" transform="matrix(1 0 0 1 -736.85718 -157.93361)">
<path inkscape:connector-curvature="0" style="fill:url(#linearGradient4416);fill-rule:evenodd" id="path4445" d="m 794.85718,163.93361 0,37.94594 -25.29727,0 -14.05412,14.05406 0,-14.05406 -12.64861,0 0,-37.94594 z"/>
<path style="fill:url(#linearGradient4394);opacity:0.2;fill-rule:evenodd" id="path4389" d="M 44 14.414062 L 21.53125 37.03125 L 30.574219 46.074219 L 32.703125 43.945312 L 49.703125 43.945312 A 26 26 0 0 0 57.783203 28.197266 L 44 14.414062 z " transform="matrix(1 0 0 1 736.85718 157.93361)"/>
<path inkscape:connector-curvature="0" style="fill:url(#linearGradient4179)" id="rect4168" d="m 779.44312,170.93361 1.41406,1.41406 -10.58594,10.58594 10.58594,10.58594 -1.41406,1.41406 -10.58594,-10.58594 -10.58594,10.58594 -1.41406,-1.41406 10.58594,-10.58594 -10.58594,-10.58594 1.41406,-1.41406 10.58594,10.58594 10.58594,-10.58594 z"/>
<path style="fill:#aa111e;fill-rule:evenodd" id="path4256" d="M 6 42.945312 L 6 43.945312 L 18.648438 43.945312 L 18.648438 42.945312 L 6 42.945312 z M 32.703125 42.945312 L 18.648438 57 L 18.648438 58 L 32.703125 43.945312 L 58 43.945312 L 58 42.945312 L 32.703125 42.945312 z " transform="matrix(1 0 0 1 736.85718 157.93361)"/>
</g>
</svg>
<svg width="48" xmlns="http://www.w3.org/2000/svg" height="48">
<defs>
<linearGradient id="a" y1="542.69" y2="503.8" x2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#c6cdd1"/>
<stop offset="1" stop-color="#e0e5e7"/>
</linearGradient>
<linearGradient id="b" y1="44" y2="4" gradientUnits="userSpaceOnUse" x2="0" gradientTransform="matrix(.99794 0 0 1.0073-383.81-503.28)">
<stop stop-color="#cea476"/>
<stop offset="1" stop-color="#dab58b"/>
</linearGradient>
<linearGradient id="c" y1="42" y2="6" x2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#c61423"/>
<stop offset="1" stop-color="#dc2b41"/>
</linearGradient>
<linearGradient id="d" y1="503.8" x1="399.57" y2="528.8" x2="424.57" gradientUnits="userSpaceOnUse" gradientTransform="translate(-384.57-499.8)">
<stop stop-color="#292c2f"/>
<stop offset="1" stop-opacity="0"/>
</linearGradient>
</defs>
<g transform="translate(-384.57-499.8)">
<path stroke-opacity=".55" fill="url(#a)" stroke-width="2.8" d="m408.57 503.8c-11.08 0-20 8.92-20 20 0 11.08 8.92 20 20 20 11.08 0 20-8.92 20-20 0-11.08-8.92-20-20-20m0 11.11c4.924 0 8.889 3.964 8.889 8.889 0 4.924-3.964 8.889-8.889 8.889-4.924 0-8.889-3.964-8.889-8.889 0-4.924 3.964-8.889 8.889-8.889"/>
<path fill="url(#c)" fill-rule="evenodd" d="m15.223 6.04c-4.506 2.197-8.05 6.03-9.865 10.738l9.898 5.656c.56-3.162 2.777-5.729 5.73-6.789zm17.555 0l-5.764 9.605c2.954 1.06 5.171 3.627 5.73 6.789l9.898-5.656c-1.818-4.712-5.359-8.541-9.865-10.738m-17.521 19.531l-9.898 5.656c1.818 4.712 5.359 8.541 9.865 10.738l5.764-9.605c-2.954-1.06-5.171-3.627-5.73-6.789m17.488 0c-.56 3.162-2.777 5.729-5.73 6.789l5.764 9.605c4.506-2.197 8.05-6.03 9.865-10.738z" transform="translate(384.57 499.8)"/>
<g transform="translate(384.57 499.8)">
<path stroke-opacity=".55" fill="#99a1a7" stroke-width="2.8" d="m4.01 23.5c-.004.167-.012.332-.012.5 0 11.08 8.92 20 20 20 11.08 0 20-8.92 20-20 0-.168-.008-.333-.012-.5-.265 10.846-9.08 19.5-19.988 19.5-10.912 0-19.724-8.654-19.988-19.5"/>
<path opacity=".2" fill="url(#d)" fill-rule="evenodd" d="m11 10l-.805 3-2.195 4-1 3-1 4 1 4 3 9h-1l2.975 2.975c3.345 2.518 7.498 4.03 12.03 4.03 6.05 0 11.446-2.672 15.11-6.893l-7.902-7.902c-1.612 2.232-4.23 3.684-7.205 3.684-4.924 0-8.889-3.964-8.889-8.889 0-2.975 1.452-5.593 3.684-7.205l-6.795-6.795z"/>
<path stroke-opacity=".55" fill="url(#b)" stroke-width="2.8" d="m10.5 11c-.277 0-.5.223-.5.5 0 .174.093.319.227.408-2.657 3.418-4.264 7.711-4.264 12.412 0 4.567 1.53 8.737 4.053 12.11-.004.025-.016.048-.016.074 0 .277.223.5.5.5.277 0 .5-.223.5-.5 0-.032-.012-.061-.018-.092h.16c-.046-.138-.108-.26-.189-.342-2.495-3.24-3.992-7.307-3.992-11.746 0-.555.025-1.104.07-1.646.321-3.797 1.739-7.263 3.922-10.1.339-.342.388-1.35 0-1.576-.039.045-.073.094-.111.139-.089-.085-.208-.139-.342-.139m26.473 0c-.388.226-.339 1.234 0 1.576 2.183 2.835 3.601 6.301 3.922 10.1.046.542.07 1.092.07 1.646 0 4.439-1.497 8.506-3.992 11.746-.081.082-.144.204-.189.342h.115l.104.105c.007.264.217.473.48.482l.004.004.002-.002c.004 0 .008.002.012.002.277 0 .5-.223.5-.5 0-.054-.016-.104-.031-.152 2.488-3.355 3.994-7.496 3.994-12.03 0-4.686-1.596-8.966-4.238-12.379.162-.083.275-.246.275-.441 0-.277-.223-.5-.5-.5-.155 0-.287.075-.379.186-.051-.06-.096-.126-.148-.186"/>
</g>
<path stroke-opacity=".55" fill="#7e1722" stroke-width="2.8" d="m395.07 509.8c-.831 0-1.5.669-1.5 1.5 0 .831.669 1.5 1.5 1.5.831 0 1.5-.669 1.5-1.5 0-.831-.669-1.5-1.5-1.5m27 0c-.831 0-1.5.669-1.5 1.5 0 .831.669 1.5 1.5 1.5.831 0 1.5-.669 1.5-1.5 0-.831-.669-1.5-1.5-1.5m-27 1c.277 0 .5.223.5.5 0 .277-.223.5-.5.5-.277 0-.5-.223-.5-.5 0-.277.223-.5.5-.5m27 0c.277 0 .5.223.5.5 0 .277-.223.5-.5.5-.277 0-.5-.223-.5-.5 0-.277.223-.5.5-.5m-27 24c-.831 0-1.5.669-1.5 1.5 0 .831.669 1.5 1.5 1.5.831 0 1.5-.669 1.5-1.5 0-.831-.669-1.5-1.5-1.5m27 0c-.831 0-1.5.669-1.5 1.5 0 .831.669 1.5 1.5 1.5.831 0 1.5-.669 1.5-1.5 0-.831-.669-1.5-1.5-1.5m-27 1c.277 0 .5.223.5.5 0 .277-.223.5-.5.5-.277 0-.5-.223-.5-.5 0-.277.223-.5.5-.5m27 0c.277 0 .5.223.5.5 0 .277-.223.5-.5.5-.277 0-.5-.223-.5-.5 0-.277.223-.5.5-.5"/>
</g>
</svg>
<svg width="48" xmlns="http://www.w3.org/2000/svg" height="48">
<defs>
<linearGradient id="a" x1="543.8" x2="503.8" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 1-1.16667 0-452.67-499.8)">
<stop stop-color="#197cf1"/>
<stop offset="1" stop-color="#21c9fb"/>
</linearGradient>
<linearGradient id="b" y1="547.8" x1="384.57" y2="530.48" x2="394.57" gradientUnits="userSpaceOnUse">
<stop stop-color="#ffffff" stop-opacity="0"/>
<stop offset="1" stop-color="#ffffff" stop-opacity=".314"/>
</linearGradient>
<linearGradient id="c" x1="384.57" x2="414.57" gradientUnits="userSpaceOnUse">
<stop stop-opacity=".275"/>
<stop offset="1" stop-color="#ffffff" stop-opacity="0"/>
</linearGradient>
<linearGradient id="d" y1="547.8" x1="432.57" y2="527.8" x2="421.02" gradientUnits="userSpaceOnUse">
<stop stop-opacity=".082"/>
<stop offset="1" stop-opacity="0"/>
</linearGradient>
<linearGradient id="e" y1="44" y2="20" x2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#eef1f2"/>
<stop offset="1" stop-color="#f9fafb"/>
</linearGradient>
<linearGradient id="f" y1="523.8" y2="507.8" gradientUnits="userSpaceOnUse" x2="0" gradientTransform="translate(0 4)">
<stop stop-color="#7cbaf8"/>
<stop offset="1" stop-color="#f4fcff"/>
</linearGradient>
<linearGradient id="g" y1="511.8" x1="414.57" y2="519.8" x2="422.57" gradientUnits="userSpaceOnUse">
<stop stop-color="#292c2f"/>
<stop offset="1" stop-opacity="0"/>
</linearGradient>
</defs>
<g transform="translate(-384.57-499.8)">
<g transform="translate(384.57 499.8)">
<path fill="#c8cfd3" fill-rule="evenodd" d="m24 8l-20 12 20 15 20-15z"/>
<path fill="url(#a)" d="m10 4v40h28v-32l-8-8z"/>
<path fill="url(#e)" d="m4 20v24h40v-24l-16 12h-8z"/>
</g>
<g fill-rule="evenodd">
<path fill="url(#c)" d="m388.57 543.8l16-12h8l16 12z"/>
<path fill="url(#d)" d="m428.57 543.8l-16-12 16-12z"/>
<path fill="url(#b)" d="m388.57 543.8l16-12-16-12z"/>
</g>
<rect width="40" x="388.57" y="542.8" fill="#d1d3d4" height="1"/>
<path fill="url(#f)" d="m404.57 511.8c-.554 0-1 .446-1 1 0 .554.446 1 1 1 .554 0 1-.446 1-1 0-.554-.446-1-1-1m7 0l-2 2 3 3-3 3 2 2 5-5zm-9.5 6c-.831 0-1.5.669-1.5 1.5 0 .831.669 1.5 1.5 1.5.831 0 1.5-.669 1.5-1.5 0-.831-.669-1.5-1.5-1.5m4.5 6c-1.108 0-2 .892-2 2 0 1.108.892 2 2 2 1.108 0 2-.892 2-2 0-1.108-.892-2-2-2"/>
<g fill-rule="evenodd">
<path fill="#313437" d="m422.57 511.8h-8v-8z"/>
<path opacity=".2" fill="url(#g)" d="m414.57 511.8h8v8z"/>
</g>
</g>
</svg>
assets/img/usersupportheader.png

87.6 KB | W: | H:

assets/img/usersupportheader.png

108 KB | W: | H:

assets/img/usersupportheader.png
assets/img/usersupportheader.png
assets/img/usersupportheader.png
assets/img/usersupportheader.png
  • 2-up
  • Swipe
  • Onion skin
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg width="32" version="1.1" xmlns="http://www.w3.org/2000/svg" height="32" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape">
<defs id="defs5455">
<linearGradient inkscape:collect="always" id="linearGradient3028" xlink:href="#linearGradient4143" y1="545.79797" y2="517.79797" x2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(1 0 0 1 -0.00001 0.00003)"/>
<linearGradient inkscape:collect="always" xlink:href="#linearGradient4290" id="linearGradient4211" y1="537.79797" y2="523.79797" gradientUnits="userSpaceOnUse" x2="0" gradientTransform="matrix(1 0 0 1 -385.57143 -514.798)"/>
<linearGradient inkscape:collect="always" id="linearGradient4143">
<stop style="stop-color:#197cf1" id="stop4145"/>
<stop offset="1" style="stop-color:#20bcfa" id="stop4147"/>
</linearGradient>
<linearGradient inkscape:collect="always" id="linearGradient4290">
<stop style="stop-color:#7cbaf8" id="stop4292"/>
<stop offset="1" style="stop-color:#f4fcff" id="stop4294"/>
</linearGradient>
<linearGradient inkscape:collect="always" xlink:href="#linearGradient4227" id="linearGradient4309" y1="9" x1="9.00001" y2="22.999973" x2="22.999985" gradientUnits="userSpaceOnUse"/>
<linearGradient inkscape:collect="always" id="linearGradient4227">
<stop style="stop-color:#292c2f" id="stop4229"/>
<stop offset="1" style="stop-opacity:0" id="stop4231"/>
</linearGradient>
</defs>
<metadata id="metadata5458"/>
<g inkscape:label="Capa 1" inkscape:groupmode="layer" id="layer1" transform="matrix(1 0 0 1 -384.57143 -515.798)">
<rect width="28.00001" x="386.57144" y="517.79797" rx="14.00001" height="28.00003" style="fill:url(#linearGradient3028)" id="rect4130"/>
<path style="fill:url(#linearGradient4309);opacity:0.2;fill-rule:evenodd" id="path4297" d="M 18 10 L 17 11 L 17 13 L 18 14 L 19 15 L 19 16 L 15 12 L 14 12 L 12 12 L 11 13 L 11 15 L 12 16 L 13 17 L 13 18 L 11 18 L 10 19 L 9 21 L 8 23 L 14.947266 29.947266 C 15.295937 29.973043 15.644521 30 16 30 C 22.820439 30 28.466359 25.169592 29.730469 18.730469 L 21 10 L 20 10 L 18 10 z " transform="matrix(1 0 0 1 384.57143 515.798)"/>
<path style="fill:url(#linearGradient4211)" id="path4202" d="M 19 9.0996094 C 17.338 9.0996094 16 10.437609 16 12.099609 C 16 13.553859 17.02502 14.760238 18.394531 15.039062 C 17.230356 15.179342 16.192931 15.715879 15.417969 16.511719 A 6 6 0 0 1 16.347656 17.023438 C 17.05393 16.394217 17.975308 16 19 16 C 21.21602 16 23 17.78398 23 20 L 18.650391 20 A 6 6 0 0 1 18.914062 21 L 24 21 L 24 20 C 24 17.43566 22.08694 15.337009 19.605469 15.039062 C 20.97498 14.760238 22 13.553859 22 12.099609 C 22 10.437609 20.662 9.0996094 19 9.0996094 z M 19 10.099609 C 20.108 10.099609 21 10.991609 21 12.099609 C 21 13.207609 20.108 14.099609 19 14.099609 C 17.892 14.099609 17 13.207609 17 12.099609 C 17 10.991609 17.892 10.099609 19 10.099609 z M 13 11 C 11.338 11 10 12.338 10 14 C 10 15.662 11.338 17 13 17 C 14.662 17 16 15.662 16 14 C 16 12.338 14.662 11 13 11 z M 13 17 C 10.22998 17 8 19.22998 8 22 L 8 23 L 18 23 L 18 22 C 18 19.22998 15.77002 17 13 17 z M 13 12 C 14.108 12 15 12.892 15 14 C 15 15.108 14.108 16 13 16 C 11.892 16 11 15.108 11 14 C 11 12.892 11.892 12 13 12 z M 13 18 C 15.21602 18 17 19.78398 17 22 L 9 22 C 9 19.78398 10.78398 18 13 18 z " transform="matrix(1 0 0 1 384.57143 515.798)"/>
</g>
</svg>
.down-head {
font-weight: bold;
font-size: 25px;
}
@media (min-width: 992px) {
.down-head {
font-weight: bold;
font-size: 35px;
}
font-size: 22px;
}
.down-par {
font-weight: 400;
font-size: 18px;
font-size: 16px;
max-width: 900px;
}
@media (min-width: 992px) {
.down-par {
font-weight: 400;
font-size: 20px;
max-width: 900px;
}
}
.button.getbutton {
font-size: 18px;
}
.OSBlock {
margin-top: 150px;
margin-bottom: 150px;
}
.card-title.titlecard {
font-weight: bold;
}
......@@ -44,8 +21,6 @@
font-weight: 400;
}
@media (max-width: 768px) {
.card-title.titlecard {
font-size: 18px;
......@@ -77,9 +52,6 @@
background-color: #31363b;
}
#videosection {
text-align: center;
}
......
......@@ -6,59 +6,31 @@ sorted: 4
plateforms:
- name: UserBase Wiki
description: >
Got lost in the features? Want to know how to install and use connect?
Got lost in the features? Want to know how to install and use KDE Connect?
Having trouble with some features? The UserBase Wiki is a great place
to start.&nbsp;It provides information for end users on how to use and
to start. It provides information for end users on how to use and
configure KDE Connect.
image:
webp: assets/img/userbase2.webp
png: assets/img/userbase2.png
image: /assets/img/help-browser.svg
learn-more:
text: UserBase Wiki
link: https://userbase.kde.org/KDEConnect
- name: KDE Connect Wiki
description: >
Has everything that you need support on. Developer or normal user.
From Installation to Development. Even troubleshooting.
image:
webp: assets/img/wikiuser.webp
png: assets/img/wikiuser.png
learn-more:
text: Connect Wiki
link: https://community.kde.org/KDEConnect
# - name: Handbook
# description: >
# Connect provides various features. Read our handbook to get to know KDE Connect.
# image:
# webp: assets/img/handbook.webp
# png: assets/img/handbook.png
# learn-more:
# text: Handbook
# link: https://docs.kde.org/index.php?application=kdeconnect-kde&amp;language=en
- name: Forums
description: >
Having an issue or want to discuss a problem. Why not do it on the
Forums?Maybe someone has already solved a similar problem. And if not,
Having an issue or want to discuss a problem? The forum is a good place
to do this. Maybe someone has already solved a similar problem. And if not,
feel free to ask there!
image:
webp: assets/img/forum.webp
png: assets/img/forum.png
image: /assets/img/yast-users.svg
learn-more:
text: Forums
link: https://forum.kde.org/
- name: Found a Bug? Request a new feature?
description: >
Bugs always happen and we need to fix it. Connect has many features
Bugs always happen and we need to fix them. KDE Connect has many features
and we can add more. Both of these can happen with a little help from
you. You can file bugs and new feature requests on our Bugzilla.
Developers can start working on it.
image:
webp: assets/img/features.webp
png: assets/img/features.png
You may not get an immediate response for feature requests, but it may get
picked up in the future.
image: /assets/img/dialog-error.svg
learn-more:
text: Bugzilla
link: https://bugs.kde.org/
......@@ -66,32 +38,25 @@ plateforms:
description: >
Still can't resolve the issue. Why not get in touch through email?
Developers and other users including enthusiasts can help you out.
image:
webp: assets/img/mailinglist.webp
png: assets/img/mailinglist.png
image: /assets/img/internet-mail.svg
learn-more:
text: Mailing List
link: https://mail.kde.org/mailman/listinfo/kdeconnect
---
<section class="topkonqi">
<h3 class="p-4">This is the help you need.</h3>
<picture>
<source srcset="assets/img/usersupportheader.webp" type="image/webp" />
<source srcset="assets/img/usersupportheader.png" type="image/png" />
<img
alt="User Support"
class="img-fluid"
src="assets/img/usersupportheader.png"
/>
</picture>
<img
alt="User Support"
class="img-fluid w-25"
src="assets/img/usersupportheader.png"
/>
</section>
<section id="plateform" class="container">
{% for plateform in page.plateforms %}
<div class="block pt-4 pb-4 OSBlock">
<div class="block mb-4 mt-4">
<div class="kAppInfo">
<div class="kAppInfo-content">
<h2 class="down-head m-3">{{ plateform.name }}</h2>
......@@ -106,41 +71,12 @@ plateforms:
</a>
</div>
{% if plateform.image-dark %}
<picture>
<source
media="(prefers-color-scheme: dark)"
srcset="{{ plateform.image-dark.webp }}"
/>
<source
media="(prefers-color-scheme: dark)"
srcset="{{ plateform.image-dark.png }}"
/>
<source
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
srcset="{{ plateform.image.webp }}"
/>
<source
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
srcset="{{ plateform.image.png }}"
/>
<img
class="img-fluid"
src="{{ plateform.image.png }}"
alt="{{ plateform.name }}"
/>
</picture>
{% else %}
<picture>
<source srcset="{{ plateform.image.webp }}" type="image/webp" />
<source srcset="{{ plateform.image.png }}" type="image/png" />
<img
alt="{{ plateform.name }}"
class="img-fluid"
src="{{ plateform.image.png }}"
/>
</picture>
{% endif%}
<img
alt="{{ plateform.name }}"
class="img-fluid"
style="min-width: 100px; max-width: 100px"
src="{{ plateform.image }}"
/>
</div>
</div>
{% endfor %}
......
Markdown is supported
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