Fix + screenshot

.editorconfig

@@ -0,0 +1,26 @@
+root=true
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+
+# Unix-style newlines with a newline ending every file
+[*]
+end_of_line=lf
+insert_final_newline=true
+
+# ReSharper properties
+resharper_enforce_line_ending_style=true
+resharper_use_indent_from_vs=false
+
+[{qmldir}]
+indent_style=space
+indent_size=4
+trim_trailing_whitespace=true
+insert_final_newline=true
+
+[*.{appxmanifest,build,c,c++,cc,config,cp,cpp,csproj,cu,cuh,cxx,dbml,discomap,dtd,h,hh,hpp,hxx,inc,inl,ino,ipp,jsproj,lsproj,mpp,njsproj,nuspec,proj,props,proto,resw,resx,StyleCop,targets,tasks,tpp,vbproj,xaml,xamlx,xml,xoml,xsd,qml,txt,qrc}]
+indent_style=space
+indent_size=4
+tab_width=4
+trim_trailing_whitespace=true
+insert_final_newline=true

.gitignore

@@ -4,5 +4,5 @@
 *.users
 # Ignore CLion project files
 *.idea
-# For macOs users ^^
+# For macOs users
 .DS_Store

README.md

@@ -1,6 +1,10 @@
+
+
+
+
 # Qaterial Gallery
 
-QaterialGallery is a showcase application and contains example for the library Qaterial . It is still under development.
+QaterialGallery is a showcase application and contains example for the library Qaterial . It is still under development. This library is hard fork of previous library QQuickMaterialHelper.
 
 This project also showcase multiplatform deployment with Qt.
 
@@ -12,15 +16,63 @@ This project also showcase multiplatform deployment with Qt.
 
 ## Components
 
+### Main Page
+
+<img src="./doc/screen3.png" alt="screen3" style="zoom:50%;" />
+
+### Menu Bar
+
+![screen4](./doc/screen4.png)
+
 ### Buttons
 
-![](./doc/screen2.png)
+![screen5](./doc/screen5.png)
+
+### Icons
+
+<img src="./doc/screen6.png" alt="screen6" style="zoom:50%;" />
+
+### Floating Action Button
+
+![screen7](./doc/screen7.png)
+
+### Controls Buttons
+
+![screen8](./doc/screen8.png)
+
+### Typography
+
+<img src="./doc/screen9.png" alt="screen9" style="zoom:50%;" />
+
+### Text Field
+
+<img src="./doc/screen10.png" alt="screen10" style="zoom: 50%;" />
+
+### Tab
+
+![screen11](./doc/screen11.png)
+
+### Cards
+
+![screen12](./doc/screen12.png)
+
+### Frame
+
+<img src="./doc/screen13.png" alt="screen13" style="zoom: 50%;" />
+
+### Group Box
+
+<img src="./doc/screen14.png" alt="screen14" style="zoom:50%;" />
+
+### Snackbars
+
+<img src="./doc/screen15.png" alt="screen15" style="zoom:50%;" />
+
+### Dialogs
+
+![screen16](./doc/screen16.png)
 
-* Raised Button
-* Flat Button
-* Outlined Button
 
-etc ...
 
 DOC TODO
 

images/images.qrc

@@ -1,77 +1,76 @@
 <RCC>
-	<qresource prefix="/QaterialGallery/images">
-	<file>icon.png</file>
-	<file>icons/back.png</file>
-	<file>icons/drawer.png</file>
-	<file>icons/menu.png</file>
-	<file>icons/plus.svg</file>
-	<file>icons/plus-circle-outline.svg</file>
-	<file>icons/palette.svg</file>
-	<file>icons/arrow-left.svg</file>
-	<file>icons/button.svg</file>
-	<file>icons/format-letter-case.svg</file>
-	<file>icons/tab.svg</file>
-	<file>icons/airplane.svg</file>
-	<file>icons/briefcase.svg</file>
-	<file>icons/compass.svg</file>
+    <qresource prefix="/QaterialGallery/images">
+    <file>icons/back.png</file>
+    <file>icons/drawer.png</file>
+    <file>icons/menu.png</file>
+    <file>icons/plus.svg</file>
+    <file>icons/plus-circle-outline.svg</file>
+    <file>icons/palette.svg</file>
+    <file>icons/arrow-left.svg</file>
+    <file>icons/button.svg</file>
+    <file>icons/format-letter-case.svg</file>
+    <file>icons/tab.svg</file>
+    <file>icons/airplane.svg</file>
+    <file>icons/briefcase.svg</file>
+    <file>icons/compass.svg</file>
 
-	<file>icons/album.svg</file>
-	<file>icons/settings.svg</file>
-	<file>icons/music-note.svg</file>
-	<file>icons/heart.svg</file>
-	<file>icons/thumb-up.svg</file>
+    <file>icons/album.svg</file>
+    <file>icons/settings.svg</file>
+    <file>icons/music-note.svg</file>
+    <file>icons/heart.svg</file>
+    <file>icons/thumb-up.svg</file>
 
-	<file>icons/pencil.svg</file>
-	<file>icons/content-copy.svg</file>
-	<file>icons/crosshairs-gps.svg</file>
+    <file>icons/pencil.svg</file>
+    <file>icons/content-copy.svg</file>
+    <file>icons/crosshairs-gps.svg</file>
 
-	<file>icons/format-align-right.svg</file>
-	<file>icons/format-align-left.svg</file>
-	<file>icons/format-align-center.svg</file>
-	<file>icons/format-bold.svg</file>
-	<file>icons/format-italic.svg</file>
-	<file>icons/format-underline.svg</file>
-	<file>icons/delegate.svg</file>
-	<file>icons/topApp.svg</file>
-	<file>icons/bottomApp.svg</file>
-	<file>icons/pane.svg</file>
-	<file>icons/frame.svg</file>
-	<file>icons/groupBox.svg</file>
-	<file>icons/dialog.svg</file>
-	<file>icons/checkbox-marked.svg</file>
-	<file>icons/textbox.svg</file>
-	<file>icons/dots-vertical.svg</file>
-	<file>icons/menu.svg</file>
-	<file>icons/banner.svg</file>
-	<file>icons/wifi.svg</file>
-	<file>icons/snackbar.svg</file>
-	<file>icons/account.svg</file>
-	<file>icons/phone.svg</file>
-	<file>icons/cake.svg</file>
-	<file>icons/alarm.svg</file>
-	<file>icons/email.svg</file>
-	<file>icons/map-marker.svg</file>
-	<file>icons/eye.svg</file>
-	<file>icons/eye-off.svg</file>
-	<file>icons/close-circle.svg</file>
-	<file>icons/alert-circle.svg</file>
-	<file>icons/fader.svg</file>
+    <file>icons/format-align-right.svg</file>
+    <file>icons/format-align-left.svg</file>
+    <file>icons/format-align-center.svg</file>
+    <file>icons/format-bold.svg</file>
+    <file>icons/format-italic.svg</file>
+    <file>icons/format-underline.svg</file>
+    <file>icons/delegate.svg</file>
+    <file>icons/topApp.svg</file>
+    <file>icons/bottomApp.svg</file>
+    <file>icons/pane.svg</file>
+    <file>icons/frame.svg</file>
+    <file>icons/groupBox.svg</file>
+    <file>icons/dialog.svg</file>
+    <file>icons/checkbox-marked.svg</file>
+    <file>icons/textbox.svg</file>
+    <file>icons/dots-vertical.svg</file>
+    <file>icons/menu.svg</file>
+    <file>icons/banner.svg</file>
+    <file>icons/wifi.svg</file>
+    <file>icons/snackbar.svg</file>
+    <file>icons/account.svg</file>
+    <file>icons/phone.svg</file>
+    <file>icons/cake.svg</file>
+    <file>icons/alarm.svg</file>
+    <file>icons/email.svg</file>
+    <file>icons/map-marker.svg</file>
+    <file>icons/eye.svg</file>
+    <file>icons/eye-off.svg</file>
+    <file>icons/close-circle.svg</file>
+    <file>icons/alert-circle.svg</file>
+    <file>icons/fader.svg</file>
 
-	<file>delegateLarge.png</file>
-	<file>delegateSquare.png</file>
-	<file>delegateRound.png</file>
+    <file>delegateLarge.png</file>
+    <file>delegateSquare.png</file>
+    <file>delegateRound.png</file>
 
-	<file>card344x194_1.png</file>
-	<file>card344x194_2.png</file>
-	<file>card344x194_3.png</file>
-	<file>card40x40.png</file>
-	<file>card80x80_1.png</file>
-	<file>card80x80_2.png</file>
-	<file>card168x168_1.png</file>
-	<file>card168x168_2.png</file>
-	<file>card168x168_3.png</file>
-	<file>card168x168_4.png</file>
-	<file>card168x168_5.png</file>
+    <file>card344x194_1.png</file>
+    <file>card344x194_2.png</file>
+    <file>card344x194_3.png</file>
+    <file>card40x40.png</file>
+    <file>card80x80_1.png</file>
+    <file>card80x80_2.png</file>
+    <file>card168x168_1.png</file>
+    <file>card168x168_2.png</file>
+    <file>card168x168_3.png</file>
+    <file>card168x168_4.png</file>
+    <file>card168x168_5.png</file>
 
-	</qresource>
+    </qresource>
 </RCC>

qml/ControlButtonPage.qml

@@ -3,6 +3,7 @@
 
 import QtQuick 2.12
 import QtQuick.Layouts 1.12
+import QtQuick.Controls 2.12
 
 import Qaterial 1.0
 

qml/DialogDelegatePage.qml

@@ -85,6 +85,7 @@ ScrollablePage
             }
             onRejected: console.log("Cancel")
         }
+
         EnumDelegate
         {
             width: parent.width
@@ -94,7 +95,8 @@ ScrollablePage
             icon.source: model.get(enumValue).source ? model.get(enumValue).source : ""
             onAccepted: enumValue = value
             title: "Title"
-            model:ListModel
+
+            model: ListModel
             {
                 ListElement{ text: "Choice 1"; secondaryText: "secondary text";source: "qrc:/QaterialGallery/images/icons/cake.svg" }
                 ListElement{ text: "Choice 2"; secondaryText: "Neque porro quisquam";source: "qrc:/QaterialGallery/images/icons/music-note.svg" }
@@ -108,11 +110,15 @@ ScrollablePage
                 ListElement{ text: "Element 10"; }
                 ListElement{ text: "Element 11";source: "qrc:/QaterialGallery/images/icons/account.svg" }
             }
-            delegate: RadioDialogDelegate
+
+            delegate: Component
             {
-                text: model.text ? model.text : ""
-                secondaryText: model.secondaryText ? model.secondaryText : ""
-                icon.source: model.source ? model.source : ""
+                RadioDialogDelegate
+                {
+                    text: model.text ? model.text : ""
+                    secondaryText: model.secondaryText ? model.secondaryText : ""
+                    icon.source: model.source ? model.source : ""
+                }
             }
         }
     } // Column

qml/FixedTabBarPage.qml

@@ -3,6 +3,7 @@
 
 import QtQuick 2.12
 import QtQuick.Layouts 1.12
+import QtQuick.Controls 2.12
 
 import Qaterial 1.0
 

qml/GroupBoxPage.qml

@@ -52,7 +52,7 @@ ScrollablePage
             title: "Caption Inline Title"
             columnWidth: page.itemWidth
             anchors.horizontalCenter: parent.horizontalCenter
-            titleType: Style.TextType.Caption
+            textType: Style.TextType.Caption
             inlineTitle: true
         } // GroupBoxLayout
 
@@ -61,7 +61,7 @@ ScrollablePage
             title: "Caption Default Title"
             columnWidth: page.itemWidth
             anchors.horizontalCenter: parent.horizontalCenter
-            titleType: Style.TextType.Caption
+            textType: Style.TextType.Caption
         } // GroupBoxLayout
     }
 }

qml/Main.qml

@@ -12,7 +12,7 @@ ApplicationWindow
     width: 480
     height: 750
     visible: true
-	title: "Qaterial Gallery"
+    title: "Qaterial Gallery"
 
     RobotoFontLoader {}
 

qml/MaterialPage.qml

@@ -7,7 +7,7 @@ Page
 {
     header: ToolBar
     {
-        AppBarContent { anchors.fill: parent; title: "Qaterial Gallery" }
+        AppBarContent { anchors.fill: parent; title: "Qaterial Gallery "+ Version.readable }
     } // ToolBar
 
     ListModel