Add pictures plugin to whats new

package.json

@@ -1,7 +1,7 @@
 {
     "name": "Anori",
     "description": "Customizable new tab: compose your own page from widgets",
-    "version": "1.17.0",
+    "version": "1.18.0",
     "repository": "[email protected]:OlegWock/anori.git",
     "author": "OlegWock",
     "license": "AGPL-3.0",

src/background.ts

@@ -8,7 +8,7 @@ console.log('Background init');
 
 const VERSIONS_WITH_CHANGES = [
     '1.1.0', '1.2.0', '1.5.0', '1.6.0', '1.8.0', '1.9.0', '1.10.0', '1.11.0', '1.12.0', '1.13.0', '1.14.0', '1.15.0',
-    '1.16.0', '1.17.0'
+    '1.16.0', '1.17.0', '1.18.0'
 ];
 
 const compareVersions = (v1: string, v2: string): -1 | 0 | 1 => {

src/components/WhatsNew.tsx

@@ -20,9 +20,13 @@ export const WhatsNew = () => {
                     <h2>1.18.0</h2>
                     <ul>
                         <li>
-                            Added new Label plugin so you can better organize your widgets. 
+                            Added new Picture plugin to spring some ✨aesthetic✨ on your new tab.
                             This was contribution from @slayernominee. Thanks!
                         </li>
+                        <li>
+                            Added new Label plugin so you can better organize your widgets. 
+                            This was another contribution from @slayernominee. Thanks!
+                        </li>
                         <li>
                             Now, after you navigated to another page from Anori and then clicked 'Back' 
                             you will be taken to folder you navigated from rather than home/default folder.

src/plugins/picture/picture-plugin.tsx

@@ -13,7 +13,7 @@ type PicturePluginWidgetConfigType = {
 
 const PictureConfigScreen = ({ saveConfiguration, currentConfig }: WidgetConfigurationScreenProps<PicturePluginWidgetConfigType>) => {
     const { t } = useTranslation();
-    const [url, setUrl] = useState(currentConfig?.url ?? 'https://source.unsplash.com/random/256x256');
+    const [url, setUrl] = useState(currentConfig?.url ?? 'https://source.unsplash.com/random/512x512');
 
     const onConfirm = () => {
 
@@ -48,7 +48,7 @@ const widgetDescriptor = {
     mainScreen: PicturePlugin,
     mock: () => {
         return (<PicturePlugin instanceId="mock" config={{
-            url: 'https://source.unsplash.com/random/256x256'
+            url: 'https://source.unsplash.com/random/512x512'
         }} />)
     },
     appearance: {

src/plugins/picture/styles.scss

@@ -3,6 +3,8 @@
     align-items: center;
     text-decoration: none;
     flex-grow: 1;
+    max-height: 100%;
+    max-width: 100%;
 
 }
 
@@ -27,7 +29,6 @@
     width: 100%;
     height: 100%;
     object-fit: cover;
-    border-radius: 8px;
     user-select: none;
     pointer-events: none;
 }

src/translations/uk.json

@@ -315,6 +315,10 @@
             "name": "Заголовок",
             "label": "Заголовок",
             "text": "Опціональний опис"
+        },
+        "picture-plugin": {
+            "name": "Зображення",
+            "widgetName": "Зображення"
         }
     }
 }