Преглед изворни кода

make LoadingSpinner styles scoped scss

Yuki Takei пре 2 година
родитељ
комит
4517372488

+ 0 - 1
apps/app/src/styles/style-app.scss

@@ -1,6 +1,5 @@
 @import '@growi/core/scss/flex-expand';
 @import '@growi/core/scss/flex-expand';
 @import '@growi/core/scss/rotate';
 @import '@growi/core/scss/rotate';
-@import '@growi/core/scss/spinner';
 
 
 @import 'mixins';
 @import 'mixins';
 
 

+ 2 - 0
apps/app/src/styles/vendor.scss

@@ -1,5 +1,7 @@
 @import '@growi/core/scss/bootstrap/apply';
 @import '@growi/core/scss/bootstrap/apply';
 
 
+@import '@growi/ui/dist/style';
+
 // react-bootstrap-typeahead
 // react-bootstrap-typeahead
 @import 'react-bootstrap-typeahead/css/Typeahead';
 @import 'react-bootstrap-typeahead/css/Typeahead';
 
 

+ 0 - 2
packages/remark-attachment-refs/src/client/components/AttachmentList.module.scss

@@ -1,5 +1,3 @@
-@use '@growi/core/scss/spinner';
-
 @keyframes attachement-refs-fadeIn {
 @keyframes attachement-refs-fadeIn {
   0% {opacity: .2}
   0% {opacity: .2}
   100% {opacity: .9}
   100% {opacity: .9}

+ 0 - 2
packages/remark-lsx/src/client/components/Lsx.module.scss

@@ -1,5 +1,3 @@
-@use '@growi/core/scss/spinner';
-
 .lsx :global {
 .lsx :global {
   // workaround
   // workaround
   // https://stackoverflow.com/a/57667536
   // https://stackoverflow.com/a/57667536

+ 3 - 0
packages/ui/package.json

@@ -21,6 +21,9 @@
     "./dist/utils": {
     "./dist/utils": {
       "import": "./dist/utils/index.js"
       "import": "./dist/utils/index.js"
     },
     },
+    "./dist/style": {
+      "import": "./dist/style.css"
+    },
     "./scss/*": "./scss/*.scss"
     "./scss/*": "./scss/*.scss"
   },
   },
   "scripts": {
   "scripts": {

+ 0 - 0
packages/core/scss/_spinner.scss → packages/ui/src/components/LoadingSpinner.module.scss


+ 6 - 2
packages/ui/src/components/LoadingSpinner.tsx

@@ -1,5 +1,9 @@
-import React, { type ComponentPropsWithoutRef } from 'react';
+import type { ComponentPropsWithoutRef } from 'react';
+
+import styles from './LoadingSpinner.module.scss';
+
+const moduleClass = styles.spinner ?? '';
 
 
 export const LoadingSpinner = ({ className = '' }: ComponentPropsWithoutRef<'span'>): JSX.Element => (
 export const LoadingSpinner = ({ className = '' }: ComponentPropsWithoutRef<'span'>): JSX.Element => (
-  <span className={`material-symbols-outlined pb-0 spinner ${className}`}>progress_activity</span>
+  <span className={`material-symbols-outlined pb-0 ${moduleClass} ${className}`}>progress_activity</span>
 );
 );