redesign channel activity

app/src/main/AndroidManifest.xml

@@ -156,8 +156,7 @@
         <activity
             android:name=".ChannelActivity"
             android:label="@string/title_activity_channel"
-            android:launchMode="singleTask"
+            android:launchMode="singleTask"/>
-            android:theme="@style/AppTheme.NoActionBar" />
 
         <activity
             android:name=".ReCaptchaActivity"

app/src/main/java/org/schabi/newpipe/ChannelActivity.java

@@ -1,31 +1,21 @@
 package org.schabi.newpipe;
 
-import android.annotation.TargetApi;
-import android.content.Context;
 import android.content.Intent;
 import android.net.Uri;
-import android.os.Build;
 import android.os.Bundle;
 import android.os.Handler;
-import android.preference.PreferenceManager;
-import android.support.design.widget.CollapsingToolbarLayout;
-import android.support.design.widget.FloatingActionButton;
-import android.support.v4.content.ContextCompat;
-import android.support.v7.app.AppCompatActivity;
 import android.support.v7.widget.LinearLayoutManager;
 import android.support.v7.widget.RecyclerView;
-import android.support.v7.widget.Toolbar;
 import android.util.Log;
 import android.view.View;
-import android.view.Window;
+import android.widget.Button;
-import android.view.WindowManager;
 import android.widget.ImageView;
 import android.widget.ProgressBar;
+import android.widget.TextView;
 import android.widget.Toast;
 
 import com.nostra13.universalimageloader.core.ImageLoader;
 
-import org.schabi.newpipe.detail.VideoItemDetailActivity;
 import org.schabi.newpipe.detail.VideoItemDetailFragment;
 import org.schabi.newpipe.extractor.NewPipe;
 import org.schabi.newpipe.extractor.StreamingService;
@@ -39,10 +29,6 @@ import org.schabi.newpipe.report.ErrorActivity;
 import org.schabi.newpipe.util.NavStack;
 
 import java.io.IOException;
-import java.util.Objects;
-
-import static android.os.Build.VERSION.SDK;
-import static android.os.Build.VERSION.SDK_INT;
 
 /**
  * Copyright (C) Christian Schabesberger 2016 <chris.schabesberger@mailbox.org>
@@ -62,7 +48,7 @@ import static android.os.Build.VERSION.SDK_INT;
  * along with NewPipe.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-public class ChannelActivity extends AppCompatActivity {
+public class ChannelActivity extends ThemableActivity {
     private static final String TAG = ChannelActivity.class.toString();
     private View rootView = null;
 
@@ -75,22 +61,17 @@ public class ChannelActivity extends AppCompatActivity {
     private ImageLoader imageLoader = ImageLoader.getInstance();
     private InfoListAdapter infoListAdapter = null;
 
+    private String subS = "";
+
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
 
-        //since we set themeing we have to set translucent statusBar by hand
-        if (PreferenceManager.getDefaultSharedPreferences(this)
-                .getString("theme", getResources().getString(R.string.light_theme_title)).
-                        equals(getResources().getString(R.string.dark_theme_title)))  {
-            setTheme(R.style.DarkTheme_NoActionBar);
-        }
-        setTranslucentStatusBar(getWindow());
-
         setContentView(R.layout.activity_channel);
-        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
+        rootView = findViewById(android.R.id.content);
-        rootView = findViewById(R.id.rootView);
+
-        setSupportActionBar(toolbar);
+        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
+        getSupportActionBar().setDisplayShowTitleEnabled(true);
         if(savedInstanceState == null) {
             Intent i = getIntent();
             channelUrl = i.getStringExtra(NavStack.URL);
@@ -107,6 +88,7 @@ public class ChannelActivity extends AppCompatActivity {
         RecyclerView recyclerView = (RecyclerView) findViewById(R.id.channel_streams_view);
         final LinearLayoutManager layoutManager = new LinearLayoutManager(this);
         recyclerView.setLayoutManager(layoutManager);
+        infoListAdapter.setHeader(getLayoutInflater().inflate(R.layout.channel_header, recyclerView, false));
         recyclerView.setAdapter(infoListAdapter);
         infoListAdapter.setOnStreamInfoItemSelectedListener(
                 new InfoItemBuilder.OnInfoItemSelectedListener() {
@@ -140,6 +122,8 @@ public class ChannelActivity extends AppCompatActivity {
             }
         });
 
+        subS = getString(R.string.subscriber);
+
         requestData(false);
     }
 
@@ -153,17 +137,19 @@ public class ChannelActivity extends AppCompatActivity {
     }
 
     private void updateUi(final ChannelInfo info) {
-        CollapsingToolbarLayout ctl = (CollapsingToolbarLayout) findViewById(R.id.channel_toolbar_layout);
         ProgressBar progressBar = (ProgressBar) findViewById(R.id.progressBar);
         ImageView channelBanner = (ImageView) findViewById(R.id.channel_banner_image);
-        final FloatingActionButton feedButton = (FloatingActionButton) findViewById(R.id.channel_rss_fab);
         ImageView avatarView = (ImageView) findViewById(R.id.channel_avatar_view);
         ImageView haloView = (ImageView) findViewById(R.id.channel_avatar_halo);
+        TextView titleView = (TextView) findViewById(R.id.channel_title_view);
+        TextView subscirberView = (TextView) findViewById(R.id.channel_subscriber_view);
+        Button subscriberButton = (Button) findViewById(R.id.channel_subscribe_button);
 
         progressBar.setVisibility(View.GONE);
 
         if(info.channel_name != null && !info.channel_name.isEmpty()) {
-            ctl.setTitle(info.channel_name);
+            getSupportActionBar().setTitle(info.channel_name);
+            titleView.setText(info.channel_name);
         }
 
         if(info.banner_url != null && !info.banner_url.isEmpty()) {
@@ -178,8 +164,17 @@ public class ChannelActivity extends AppCompatActivity {
                     new ImageErrorLoadingListener(this, rootView ,info.service_id));
         }
 
+        if(info.subscriberCount != -1) {
+            subscirberView.setText(buildSubscriberString(info.subscriberCount));
+        }
+
+        if((info.feed_url != null && !info.feed_url.isEmpty()) ||
+                (info.subscriberCount != -1)) {
+            findViewById(R.id.channel_subscriber_layout).setVisibility(View.VISIBLE);
+        }
+
         if(info.feed_url != null && !info.feed_url.isEmpty()) {
-            feedButton.setOnClickListener(new View.OnClickListener() {
+            subscriberButton.setOnClickListener(new View.OnClickListener() {
                 @Override
                 public void onClick(View view) {
                     Log.d(TAG, info.feed_url);
@@ -188,8 +183,9 @@ public class ChannelActivity extends AppCompatActivity {
                 }
             });
         } else {
-            feedButton.setVisibility(View.GONE);
+            subscriberButton.setVisibility(View.GONE);
         }
+
     }
 
     private void addVideos(final ChannelInfo info) {
@@ -297,30 +293,6 @@ public class ChannelActivity extends AppCompatActivity {
         channelExtractorThread.start();
     }
 
-
-    // fix transparent statusbar fuckup (fuck google why can't they just leave something that worked
-    // as it is, and everyone gets happy)
-    public static void setTranslucentStatusBar(Window window) {
-        if (window == null) return;
-        int sdkInt = Build.VERSION.SDK_INT;
-        if (sdkInt >= Build.VERSION_CODES.LOLLIPOP) {
-            setTranslucentStatusBarLollipop(window);
-        } else if (sdkInt >= Build.VERSION_CODES.KITKAT) {
-            setTranslucentStatusBarKiKat(window);
-        }
-    }
-
-    @TargetApi(Build.VERSION_CODES.LOLLIPOP)
-    private static void setTranslucentStatusBarLollipop(Window window) {
-        window.setStatusBarColor(
-                ContextCompat.getColor(window.getContext(), android.R.color.transparent));
-    }
-
-    @TargetApi(Build.VERSION_CODES.KITKAT)
-    private static void setTranslucentStatusBarKiKat(Window window) {
-        window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
-    }
-
     @Override
     public void onBackPressed() {
         try {
@@ -331,4 +303,19 @@ public class ChannelActivity extends AppCompatActivity {
         }
     }
 
+
+    private String buildSubscriberString(long count) {
+        String out = "";
+        if(count >= 1000000000){
+            out += Long.toString((count/1000000000)%1000)+".";
+        }
+        if(count>=1000000){
+            out += Long.toString((count/1000000)%1000) + ".";
+        }
+        if(count>=1000){
+            out += Long.toString((count/1000)%1000)+".";
+        }
+        out += Long.toString(count%1000) + " " + subS;
+        return out;
+    }
 }

app/src/main/java/org/schabi/newpipe/extractor/channel/ChannelExtractor.java

@@ -54,6 +54,7 @@ public abstract class ChannelExtractor {
     public abstract String getBannerUrl() throws ParsingException;
     public abstract String getFeedUrl() throws ParsingException;
     public abstract StreamInfoItemCollector getStreams() throws ParsingException;
+    public abstract long getSubscriberCount() throws ParsingException;
     public abstract boolean hasNextPage() throws ParsingException;
     public int getServiceId() {
         return serviceId;

app/src/main/java/org/schabi/newpipe/extractor/channel/ChannelInfo.java

@@ -29,8 +29,6 @@ import java.util.Vector;
  */
 
 public class ChannelInfo {
-
-
     public void addException(Exception e) {
         errors.add(e);
     }
@@ -66,6 +64,11 @@ public class ChannelInfo {
         } catch(Exception e) {
             info.errors.add(e);
         }
+        try {
+            info.subscriberCount = extractor.getSubscriberCount();
+        } catch (Exception e) {
+            info.errors.add(e);
+        }
 
         return info;
     }
@@ -76,6 +79,7 @@ public class ChannelInfo {
     public String banner_url = "";
     public String feed_url = "";
     public List<InfoItem> related_streams = null;
+    public long subscriberCount = -1;
     public boolean hasNextPage = false;
 
     public List<Throwable> errors = new Vector<>();

app/src/main/java/org/schabi/newpipe/extractor/services/youtube/YoutubeChannelExtractor.java

@@ -294,6 +294,13 @@ public class YoutubeChannelExtractor extends ChannelExtractor {
         return collector;
     }
 
+    @Override
+    public long getSubscriberCount() throws ParsingException {
+        String countRaw = doc.select("span[class*=\"yt-subscription-button-subscriber-count\"]").first()
+                .text();
+        return Long.parseLong(countRaw.replaceAll("\\D+",""));
+    }
+
     @Override
     public String getFeedUrl() throws ParsingException {
         try {

app/src/main/java/org/schabi/newpipe/info_list/InfoItemBuilder.java

@@ -202,15 +202,15 @@ public class InfoItemBuilder {
         }
     }
 
-    public String shortSubscriber(Long viewCount){
+    public String shortSubscriber(Long count){
-        if(viewCount >= 1000000000){
+        if(count >= 1000000000){
-            return Long.toString(viewCount/1000000000)+ billion + " " + subsS;
+            return Long.toString(count/1000000000)+ billion + " " + subsS;
-        }else if(viewCount>=1000000){
+        }else if(count>=1000000){
-            return Long.toString(viewCount/1000000)+ million + " " + subsS;
+            return Long.toString(count/1000000)+ million + " " + subsS;
-        }else if(viewCount>=1000){
+        }else if(count>=1000){
-            return Long.toString(viewCount/1000)+ thousand + " " + subsS;
+            return Long.toString(count/1000)+ thousand + " " + subsS;
         }else {
-            return Long.toString(viewCount)+ " " + subsS;
+            return Long.toString(count)+ " " + subsS;
         }
     }
 

app/src/main/java/org/schabi/newpipe/info_list/InfoListAdapter.java

@@ -33,11 +33,20 @@ import java.util.Vector;
  * along with NewPipe.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-public class InfoListAdapter extends RecyclerView.Adapter<InfoItemHolder> {
+public class InfoListAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
     private static final String TAG = InfoListAdapter.class.toString();
 
     private final InfoItemBuilder infoItemBuilder;
     private final List<InfoItem> infoItemList;
+    private View header = null;
+
+    public class HeaderHolder extends RecyclerView.ViewHolder {
+        public HeaderHolder(View v) {
+            super(v);
+            view = v;
+        }
+        public View view;
+    }
 
     public InfoListAdapter(Activity a, View rootView) {
         infoItemBuilder = new InfoItemBuilder(a, rootView);
@@ -66,21 +75,30 @@ public class InfoListAdapter extends RecyclerView.Adapter<InfoItemHolder> {
         notifyDataSetChanged();
     }
 
+    public void setHeader(View header) {
+        this.header = header;
+    }
+
     @Override
     public int getItemCount() {
-        return infoItemList.size();
+        return (header == null) ? infoItemList.size() : (infoItemList.size() + 1);
     }
 
     // don't ask why we have to do that this way... it's android accept it -.-
     @Override
     public int getItemViewType(int position) {
+        if(header != null && position == 0) {
+            return 0;
+        } else if(header != null) {
+            position--;
+        }
         switch(infoItemList.get(position).infoType()) {
             case STREAM:
-                return 0;
-            case CHANNEL:
                 return 1;
-            case PLAYLIST:
+            case CHANNEL:
                 return 2;
+            case PLAYLIST:
+                return 3;
             default:
                 Log.e(TAG, "Trollolo");
                 return -1;
@@ -88,15 +106,17 @@ public class InfoListAdapter extends RecyclerView.Adapter<InfoItemHolder> {
     }
 
     @Override
-    public InfoItemHolder onCreateViewHolder(ViewGroup parent, int type) {
+    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int type) {
         switch(type) {
             case 0:
+                return new HeaderHolder(header);
+            case 1:
                 return new StreamInfoItemHolder(LayoutInflater.from(parent.getContext())
                         .inflate(R.layout.stream_item, parent, false));
-            case 1:
+            case 2:
                 return new ChannelInfoItemHolder(LayoutInflater.from(parent.getContext())
                         .inflate(R.layout.channel_item, parent, false));
-            case 2:
+            case 3:
                 Log.e(TAG, "Playlist is not yet implemented");
                 return null;
             default:
@@ -106,7 +126,15 @@ public class InfoListAdapter extends RecyclerView.Adapter<InfoItemHolder> {
     }
 
     @Override
-    public void onBindViewHolder(InfoItemHolder holder, int i) {
+    public void onBindViewHolder(RecyclerView.ViewHolder holder, int i) {
-        infoItemBuilder.buildByHolder(holder, infoItemList.get(i));
+        //god damen f*** ANDROID SH**
+        if(holder instanceof InfoItemHolder) {
+            if(header != null) {
+                i--;
+            }
+            infoItemBuilder.buildByHolder((InfoItemHolder) holder, infoItemList.get(i));
+        } else if(holder instanceof HeaderHolder && i == 0 && header != null) {
+            ((HeaderHolder) holder).view = header;
+        }
     }
 }

app/src/main/res/layout/activity_channel.xml

@@ -1,81 +1,17 @@
 <?xml version="1.0" encoding="utf-8"?>
-<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<RelativeLayout
-    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    android:fitsSystemWindows="true"
+    android:orientation="vertical"
-    android:id="@+id/rootView"
+    android:title="Channel">
-    tools:context="org.schabi.newpipe.ChannelActivity">
 
-    <android.support.design.widget.AppBarLayout
+    <android.support.v7.widget.RecyclerView
-        android:id="@+id/channel_app_bar"
+        android:id="@+id/channel_streams_view"
-        android:layout_width="match_parent"
-        android:layout_height="@dimen/app_bar_height"
-        android:fitsSystemWindows="true"
-        android:theme="@style/AppTheme.AppBarOverlay">
-
-        <android.support.design.widget.CollapsingToolbarLayout
-            android:id="@+id/channel_toolbar_layout"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
-            android:fitsSystemWindows="true"
+        android:background="?android:windowBackground"
-            app:contentScrim="@color/light_youtube_primary_color"
+        android:scrollbars="vertical"/>
-            app:statusBarScrim="@color/light_youtube_dark_color"
-            app:layout_scrollFlags="scroll|exitUntilCollapsed">
-
-
-            <ImageView
-                android:id="@+id/channel_banner_image"
-                android:layout_width="match_parent"
-                android:layout_height="match_parent"
-                android:fitsSystemWindows="true"
-                android:scaleType="centerCrop"
-                android:background="@color/light_youtube_dark_color"
-                app:layout_collapseMode="parallax" />
-
-            <ImageView
-                android:id="@+id/channel_avatar_halo"
-                android:visibility="gone"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginLeft="28dp"
-                android:layout_marginStart="28dp"
-                android:layout_marginTop="38dp"
-                android:layout_alignParentLeft="true"
-                android:layout_alignParentStart="true"
-                android:src="@drawable/white_circle"/>
-
-            <de.hdodenhof.circleimageview.CircleImageView
-                android:id="@+id/channel_avatar_view"
-                android:visibility="gone"
-                android:layout_width="@dimen/channel_avatar_size"
-                android:layout_height="@dimen/channel_avatar_size"
-                android:src="@drawable/buddy"
-                android:layout_marginLeft="30dp"
-                android:layout_marginStart="30dp"
-                android:layout_marginTop="40dp"
-                android:layout_alignParentLeft="true"
-                android:layout_alignParentStart="true"/>
-
-            <android.support.v7.widget.Toolbar
-                android:id="@+id/cannel_toolbar"
-                android:layout_width="match_parent"
-                android:layout_height="?attr/actionBarSize"
-                app:layout_collapseMode="pin"
-                app:popupTheme="@style/AppTheme.PopupOverlay" />
-
-        </android.support.design.widget.CollapsingToolbarLayout>
-    </android.support.design.widget.AppBarLayout>
-
-    <android.support.design.widget.FloatingActionButton
-        android:id="@+id/channel_rss_fab"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_margin="@dimen/fab_margin"
-        android:src="?attr/rss"
-        app:layout_anchor="@id/channel_app_bar"
-        app:layout_anchorGravity="bottom|end" />
 
     <RelativeLayout
         android:layout_width="match_parent"
@@ -87,11 +23,4 @@
             android:layout_centerInParent="true"
             android:indeterminate="true"/>
     </RelativeLayout>
-    <android.support.v7.widget.RecyclerView
+</RelativeLayout>
-        android:id="@+id/channel_streams_view"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:background="?android:windowBackground"
-        app:layout_behavior="@string/appbar_scrolling_view_behavior"
-        android:scrollbars="vertical"/>
-</android.support.design.widget.CoordinatorLayout>

app/src/main/res/layout/channel_header.xml

@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="utf-8"?>
+<RelativeLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:orientation="vertical">
+
+    <ImageView
+        android:id="@+id/channel_banner_image"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:fitsSystemWindows="true"
+        android:scaleType="center"
+        android:src="@drawable/channel_banner"
+        android:background="@android:color/black"
+        android:adjustViewBounds="true"/>
+
+    <RelativeLayout
+        android:id="@+id/channel_avatar_layout"
+        android:layout_alignTop="@id/channel_banner_image"
+        android:layout_width="@dimen/channel_avatar_halo_size"
+        android:layout_height="@dimen/channel_avatar_halo_size"
+        android:layout_marginLeft="20dp"
+        android:layout_marginStart="20dp"
+        android:layout_marginTop="30dp">
+
+        <ImageView
+            android:id="@+id/channel_avatar_halo"
+            android:layout_width="@dimen/channel_avatar_halo_size"
+            android:layout_height="@dimen/channel_avatar_halo_size"
+            android:layout_alignParentLeft="true"
+            android:layout_alignParentStart="true"
+            android:src="@drawable/white_circle" />
+
+        <de.hdodenhof.circleimageview.CircleImageView
+            android:id="@+id/channel_avatar_view"
+            android:layout_width="@dimen/channel_avatar_size"
+            android:layout_height="@dimen/channel_avatar_size"
+            android:src="@drawable/buddy"
+            android:layout_centerInParent="true"/>
+    </RelativeLayout>
+
+    <TextView
+        android:id="@+id/channel_title_view"
+        android:layout_below="@id/channel_banner_image"
+        android:layout_toEndOf="@id/channel_avatar_layout"
+        android:layout_toRightOf="@id/channel_avatar_layout"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:textSize="@dimen/video_item_detail_title_text_size"
+        android:textAppearance="?android:attr/textAppearanceLarge"/>
+
+    <LinearLayout
+        android:id="@+id/channel_subscriber_layout"
+        android:visibility="gone"
+        android:layout_below="@id/channel_avatar_layout"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal">
+        <Button
+            android:id="@+id/channel_subscribe_button"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:text="@string/subscribe"
+            android:layout_marginLeft="4dp"
+            android:layout_marginStart="4dp"/>
+
+        <TextView
+            android:id="@+id/channel_subscriber_view"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:gravity="center"/>
+    </LinearLayout>
+
+</RelativeLayout>

app/src/main/res/values/strings.xml

@@ -151,6 +151,7 @@
     <string name="use_exoplayer_summary">Experimental</string>
     <string name="videos">videos</string>
     <string name="subscriber">subscriber</string>
+    <string name="subscribe">Subscribe</string>
     <string name="views">views</string>
     <string name="short_thousand">K</string>
     <string name="short_million">M</string>

app/src/test/java/org/schabi/newpipe/extractor/services/youtube/youtube/YoutubeChannelExtractorTest.java

@@ -87,6 +87,11 @@ public class YoutubeChannelExtractorTest  {
         assertTrue("no next page link found", extractor.hasNextPage());
     }
 
+    @Test
+    public void testGetSubscriberCount() throws Exception {
+        assertTrue("wrong subscriber count", extractor.getSubscriberCount() >= 0);
+    }
+
     @Test
     public void testGetNextPage() throws Exception {
         extractor = NewPipe.getService("Youtube")

assets/channel_banner_desktop.svg

@@ -0,0 +1,186 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="2550"
+   height="427"
+   viewBox="0 0 674.68749 112.97708"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.1 r"
+   sodipodi:docname="channel_banner_desktop.svg"
+   inkscape:export-filename="/home/the-scrabi/channel_banner.png"
+   inkscape:export-xdpi="96"
+   inkscape:export-ydpi="96">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.1438037"
+     inkscape:cx="983.1312"
+     inkscape:cy="-254.76355"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1012"
+     inkscape:window-x="0"
+     inkscape:window-y="32"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <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></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-184.02291)">
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 283.72686,296.99999 h 30.94953 l 81.58882,-112.97708 h -30.949 z"
+       id="path5067" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 221.83555,296.99999 h 30.94902 L 334.3739,184.02291 h -30.94953 z"
+       id="path5063" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 159.94424,296.99999 h 30.95005 L 272.4831,184.02291 h -30.95004 z"
+       id="path5059" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 98.052928,296.99999 H 129.00246 L 210.59128,184.02291 H 179.64175 Z"
+       id="path5055" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 36.161617,296.99999 H 67.111149 L 148.70048,184.02291 h -30.94953 z"
+       id="path5051" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 0,261.37168 v 35.62831 H 5.2193195 L 86.808653,184.02291 H 55.859121 Z"
+       id="path5047" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 24.917342,184.02291 H 0 v 34.50332 z"
+       id="path5045" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 252.7794,296.99999 h 30.94952 l 81.58935,-112.97708 h -30.95005 z"
+       id="path5020" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 190.88809,296.99999 h 30.94953 l 81.58932,-112.97708 h -30.94953 z"
+       id="path5016" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 128.99678,296.99999 h 30.94953 l 81.58933,-112.97708 h -30.95005 z"
+       id="path5012" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 67.105463,296.99999 H 98.054995 L 179.64381,184.02291 h -30.94953 z"
+       id="path5008" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 5.2141519,296.99999 H 36.163168 L 117.7525,184.02291 H 86.80297 Z"
+       id="path5004" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828106;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 55.861706,184.02291 H 24.912174 L 0,218.51848 v 42.8563 z"
+       id="path5000" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828107;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 531.30347,297 H 562.253 l 81.58881,-112.97709 h -30.949 z"
+       id="path5067-3" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828107;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 469.41216,297 h 30.94902 L 581.9505,184.02291 h -30.94952 z"
+       id="path5063-6" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828107;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 407.52085,297 H 438.4709 L 520.05971,184.02291 H 489.10967 Z"
+       id="path5059-7" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828107;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 345.62386,297 h 30.94953 l 81.58882,-112.97709 h -30.94953 z"
+       id="path5055-5" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828107;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 500.35601,297 h 30.94952 l 81.58934,-112.97709 h -30.95003 z"
+       id="path5020-3" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828107;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 438.4647,297 h 30.94953 l 81.58932,-112.97709 h -30.94953 z"
+       id="path5016-5" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828107;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 376.57339,297 h 30.94953 L 489.11225,184.02291 H 458.1622 Z"
+       id="path5012-6" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828107;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 314.67639,297 h 30.94953 l 81.58882,-112.97709 h -30.94953 z"
+       id="path5008-2" />
+    <path
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 2475.9375 427 L 2550 427 L 2550 324.44531 L 2475.9375 427 z "
+       id="path5063-6-1"
+       transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)" />
+    <path
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 2242.0176 427 L 2358.9941 427 L 2550 162.51172 L 2550 0.53320312 L 2242.0176 427 z "
+       id="path5059-7-2"
+       transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)" />
+    <path
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="M 2358.9707 427 L 2475.9453 427 L 2550 324.45703 L 2550 162.48047 L 2358.9707 427 z "
+       id="path5016-5-0"
+       transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)" />
+    <path
+       inkscape:connector-curvature="0"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.10828107;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+       d="m 562.253,297 h 30.94953 l 81.58933,-112.97709 h -30.95005 z"
+       id="path5012-6-9" />
+  </g>
+</svg>

assets/channel_banner_mobild.svg

@@ -0,0 +1,144 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="1540"
+   height="427"
+   viewBox="0 0 407.45833 112.97708"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.1 r"
+   sodipodi:docname="channel_banner.svg"
+   inkscape:export-filename="/home/the-scrabi/channel_banner.png"
+   inkscape:export-xdpi="96"
+   inkscape:export-ydpi="96">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.5"
+     inkscape:cx="803.85939"
+     inkscape:cy="182.74745"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1012"
+     inkscape:window-x="0"
+     inkscape:window-y="32"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <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></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Ebene 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-184.02291)">
+    <g
+       id="g5158">
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5071"
+         d="M 1306.2734 427 L 1423.248 427 L 1540 265.33398 L 1540 103.35547 L 1306.2734 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5067"
+         d="M 1072.3535 427 L 1189.3281 427 L 1497.6953 0 L 1380.7227 0 L 1072.3535 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5063"
+         d="M 838.43359 427 L 955.40625 427 L 1263.7754 0 L 1146.8008 0 L 838.43359 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5059"
+         d="M 604.51367 427 L 721.49023 427 L 1029.8574 0 L 912.88086 0 L 604.51367 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5055"
+         d="M 370.59375 427 L 487.56836 427 L 795.93555 0 L 678.96094 0 L 370.59375 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5051"
+         d="M 136.67383 427 L 253.64844 427 L 562.01758 0 L 445.04297 0 L 136.67383 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5047"
+         d="M 0 292.3418 L 0 427 L 19.726562 427 L 328.0957 0 L 211.12109 0 L 0 292.3418 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5045"
+         d="M 94.175781 0 L 0 0 L 0 130.40625 L 94.175781 0 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#6c6c6c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5028"
+         d="M 1423.2266 427 L 1540 427 L 1540 265.30273 L 1423.2266 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5024"
+         d="M 1189.3066 427 L 1306.2812 427 L 1540 103.36719 L 1540 0 L 1497.6758 0 L 1189.3066 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5020"
+         d="M 955.38672 427 L 1072.3613 427 L 1380.7305 0 L 1263.7539 0 L 955.38672 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5016"
+         d="M 721.4668 427 L 838.44141 427 L 1146.8105 0 L 1029.8359 0 L 721.4668 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5012"
+         d="M 487.54688 427 L 604.52148 427 L 912.89062 0 L 795.91406 0 L 487.54688 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5008"
+         d="M 253.62695 427 L 370.60156 427 L 678.96875 0 L 561.99414 0 L 253.62695 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5004"
+         d="M 19.707031 427 L 136.67969 427 L 445.04883 0 L 328.07422 0 L 19.707031 427 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+      <path
+         transform="matrix(0.26458333,0,0,0.26458333,0,184.02291)"
+         id="path5000"
+         d="M 211.13086 0 L 94.15625 0 L 0 130.37695 L 0 292.35352 L 211.13086 0 z "
+         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#999999;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.40925127;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" />
+    </g>
+  </g>
+</svg>