Tweaker tekster/styling

Author: anders-nom

src/components/main-section/content-view/html-exporter/HtmlExporter.module.css

@@ -1,7 +1,8 @@
 .exporter {
-    overflow-y: scroll;
+    display: flex;
+    flex-direction: column;
+    overflow-y: hidden;
     height: 100%;
-    scrollbar-width: thin;
 }
 
 .hidden {
@@ -17,7 +18,7 @@
     padding: 0.5rem 0;
 }
 
-.downloadCurrent {
+.downloadCurrentButton {
     margin-right: 0.5rem;
 }
 
@@ -26,9 +27,16 @@
 }
 
 .checkboxGroup {
-    margin-top: 1rem;
+    margin: 0.25rem 0;
+    overflow-y: scroll;
+    scrollbar-width: thin;
 
     :global(.navds-checkbox__label) {
         padding: 0.1875rem;
     }
+}
+
+.downloadAllButton {
+    align-self: flex-start;
+    margin: 0.25rem;
 }

src/components/main-section/content-view/html-exporter/HtmlExporter.tsx

@@ -20,7 +20,7 @@ export const HtmlExporter = ({ content, hidden }: Props) => {
 
     const pdfApi = `${basePath}/pdf`;
 
-    const { versionKey, versions } = content;
+    const { versionKey: currentVersionKey, versions } = content;
 
     return (
         <div className={classNames(style.exporter, hidden && style.hidden)}>
@@ -29,28 +29,19 @@ export const HtmlExporter = ({ content, hidden }: Props) => {
                     {'Eksporter til PDF'}
                 </Heading>
                 <Button
-                    variant={'primary'}
+                    variant={'tertiary'}
                     size={'small'}
                     as={'a'}
-                    href={`${pdfApi}/single/${versionKey}`}
+                    href={`${pdfApi}/single/${currentVersionKey}`}
                     icon={<ArrowDownRightIcon className={style.downloadCurrentIcon} />}
                     iconPosition={'right'}
-                    className={style.downloadCurrent}
+                    className={style.downloadCurrentButton}
                 >
                     {'Last ned denne versjonen'}
                 </Button>
             </div>
-            <Button
-                variant={'primary'}
-                size={'small'}
-                as={'a'}
-                href={`${pdfApi}/multi/${versionKeysSelected.join(',')}`}
-                disabled={versionKeysSelected.length === 0}
-            >
-                {'Last ned valgte versjoner'}
-            </Button>
             <CheckboxGroup
-                legend={'Last ned flere versjoner'}
+                legend={'Velg flere versjoner (lastes ned i en samlet zip-fil)'}
                 size={'small'}
                 className={style.checkboxGroup}
                 onChange={setVersionKeysSelected}
@@ -64,6 +55,16 @@ export const HtmlExporter = ({ content, hidden }: Props) => {
                     );
                 })}
             </CheckboxGroup>
+            <Button
+                variant={'primary'}
+                size={'medium'}
+                as={'a'}
+                href={`${pdfApi}/multi/${versionKeysSelected.join(',')}`}
+                disabled={versionKeysSelected.length === 0}
+                className={style.downloadAllButton}
+            >
+                {'Last ned valgte versjoner'}
+            </Button>
         </div>
     );
 };