relocate bootstrap scss

apps/app/src/components/Admin/UserManagement.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 // styles for admin user search
 .search-typeahead :global {

apps/app/src/components/BookmarkButtons.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .btn-group-bookmark :global {
   .btn-bookmark {

apps/app/src/components/Fab.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .grw-fab :global {
   position: fixed;

apps/app/src/components/Layout/Admin.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as *;
+@use '@growi/core/scss/bootstrap/init' as *;
 @use '~/styles/mixins';
 
 $slack-work-space-name-card-background: #fff5ff;

apps/app/src/components/Layout/NoLoginLayout.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as *;
+@use '@growi/core/scss/bootstrap/init' as *;
 
 
 .nologin :global {

apps/app/src/components/Layout/SearchResultLayout.module.scss

@@ -1,5 +1,5 @@
 @use '~/styles/variables' as var;
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .on-search :global {
   .page-wrapper {

apps/app/src/components/LikeButtons.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .btn-group-like :global {
   .btn-like {

apps/app/src/components/Navbar/AuthorInfo.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 $author-font-size: 12px;
 $date-font-size: 11px;

apps/app/src/components/Navbar/GlobalSearch.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 // input styles
 .grw-global-search :global {

apps/app/src/components/Navbar/GrowiNavbar.module.scss

@@ -1,5 +1,5 @@
 @use '~/styles/variables' as var;
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 @use '~/styles/mixins';
 
 .grw-navbar :global {

apps/app/src/components/Navbar/GrowiSubNavigation.module.scss

@@ -1,5 +1,5 @@
 @use '~/styles/variables' as var;
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 @use '~/styles/mixins';
 
 %subnav-buttons-height {

apps/app/src/components/Navbar/GrowiSubNavigationSwitcher.module.scss

@@ -1,5 +1,5 @@
 @use '~/styles/variables' as var;
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 /*
  * Fixed ver

apps/app/src/components/Navbar/PageEditorModeManager.module.scss

@@ -1,5 +1,5 @@
 // @mixin page-editor-mode-manager($textColor, $borderColor, $bgColorHoverAndActive, $bgColor: white) {
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 @use '~/styles/mixins';
 
 $btn-line-height: 1.2rem;

apps/app/src/components/Page/TagLabels.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 $grw-tag-label-font-size: 12px;
 

apps/app/src/components/PageComment.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .page-comment-styles :global {
   .page-comments {

apps/app/src/components/PageComment/Comment.module.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use '../../styles/variables' as var;
-@use '../../styles/bootstrap/init' as bs;
 @use './_comment-inheritance';
 
 .comment-styles :global {

apps/app/src/components/PageComment/CommentEditor.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 @use './comment-inheritance';
 @use '../PageEditor/page-editor-inheritance';
 

apps/app/src/components/PageComment/CommentPreview.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 @use './comment-inheritance';
 @use '../PageEditor/page-editor-inheritance';
 

apps/app/src/components/PageComment/_comment-inheritance.scss

@@ -1,4 +1,4 @@
-@use '../../styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 %comment-section {
   position: relative;

apps/app/src/components/PageContentFooter.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .page-content-footer :global {
   border-top: solid 1px transparent;

apps/app/src/components/PageEditor/CodeMirrorEditor.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .grw-codemirror-editor :global {
   @import '~codemirror/lib/codemirror';

apps/app/src/components/PageEditor/Editor.module.scss

@@ -1,5 +1,5 @@
 @use '~/styles/mixins' as ms;
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 @use './page-editor-inheritance';
 
 

apps/app/src/components/PageEditor/GridEditModal.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .grw-grid-edit-modal :global {
   .desktop-preview,

apps/app/src/components/PageHistory/RevisionDiff.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .revision-diff-container :global {
   .comparison-header {

apps/app/src/components/PageStatusAlert.module.scss

@@ -1,5 +1,5 @@
 @use '~/styles/variables' as var;
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .grw-page-status-alert :global {
   $margin-bottom: var.$grw-navbar-bottom-height + 10px;

apps/app/src/components/PageTimeline.module.scss

@@ -1,4 +1,4 @@
-@use '../styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .card-timeline :global {
   margin-bottom: 3rem;

apps/app/src/components/ReactMarkdownComponents/CodeBlock.module.scss

@@ -1,5 +1,5 @@
 @use '~/styles/variables' as var;
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .code-highlighted-title {
   position: absolute;

apps/app/src/components/SearchForm.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .grw-search-table {
   caption {

apps/app/src/components/SearchTypeahead.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .search-typeahead :global {
   position: relative;

apps/app/src/components/ShortcutsModal.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .shortcuts-modal :global {
   h3 {

apps/app/src/components/Sidebar.module.scss

@@ -1,6 +1,6 @@
 @use '~/styles/variables' as var;
 @use '~/styles/mixins';
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .grw-sidebar :global {
   // sticky

apps/app/src/components/SlackNotification.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 // TODO: activate (https://redmine.weseek.co.jp/issues/128307)
 .grw-slack-notification :global {

apps/app/src/components/SubscribeButton.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .btn-subscribe {
   &:global {

apps/app/src/components/TableOfContents.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .revision-toc :global {
   // to get on the Attachment row

apps/app/src/components/TemplateModal/TemplateModal.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .dm-templates :global {
   .dropdown-item:not(:first-child) {

apps/app/src/components/User/SeenUserInfo.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 @use '~/styles/atoms/mixins/buttons' as mixins-buttons;
 
 .grw-seen-user-info :global {

apps/app/src/components/User/UserInfo.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .grw-users-info :global {
   .users-meta {

apps/app/src/features/questionnaire/client/components/QuestionnaireModalManager.module.scss

@@ -1,4 +1,4 @@
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .grw-questionnaire-toasts :global {
   position: fixed;

apps/app/src/styles/_editor.scss

@@ -1,4 +1,5 @@
-@import './bootstrap/init' ;
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @import './variables' ;
 @import './mixins' ;
 @import './organisms/wiki-custom-sidebar';
@@ -20,7 +21,7 @@
     padding-right: 15px;
     padding-left: 15px;
 
-    @include media-breakpoint-up(lg) {
+    @include bs.media-breakpoint-up(lg) {
       height: $grw-subnav-height-lg-on-edit;
     }
   }
@@ -35,7 +36,7 @@
   $editor-margin-top: $grw-navbar-border-width + $grw-subnav-height-on-edit;
   @include expand-editor($editor-margin-top);
 
-  @include media-breakpoint-up(lg) {
+  @include bs.media-breakpoint-up(lg) {
     // calculate margin
     $editor-margin-top: $grw-navbar-border-width + $grw-subnav-height-lg-on-edit;
     @include expand-editor($editor-margin-top);
@@ -77,12 +78,12 @@
     height: $grw-editor-navbar-bottom-height;
 
     .grw-grant-selector {
-      @include media-breakpoint-down(sm) {
+      @include bs.media-breakpoint-down(sm) {
         .btn .label {
           display: none;
         }
       }
-      @include media-breakpoint-up(md) {
+      @include bs.media-breakpoint-up(md) {
         .dropdown-toggle {
           min-width: 100px;
 
@@ -250,7 +251,7 @@
 
     .hackmd-error {
       top: 0;
-      background-color: rgba($gray-800, 0.8);
+      background-color: rgba(bs.$gray-800, 0.8);
     }
 
     .hackmd-status-label {
@@ -300,10 +301,10 @@
   .tooltip-inner {
     color: black;
     background-color: white;
-    border: 1px solid $gray-300;
+    border: 1px solid bs.$gray-300;
   }
 
   .tooltip-arrow {
-    border-bottom: 5px solid $gray-300;
+    border-bottom: 5px solid bs.$gray-300;
   }
 }

apps/app/src/styles/_layout.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use './variables' as var;
-@use './bootstrap/init' as bs;
 
 .dynamic-layout-root.growi-layout-fluid .grw-container-convertible {
   width: 100%;

apps/app/src/styles/_mixins.scss

@@ -1,4 +1,4 @@
-@use './bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 @mixin variable-font-size($basesize) {
   font-size: $basesize * 0.6;

apps/app/src/styles/_tag.scss

@@ -1,4 +1,4 @@
-@use './bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 .tags-page {
   .list-tag-count {

apps/app/src/styles/atoms/_buttons.scss

@@ -1,4 +1,5 @@
-@use '../bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use '../mixins';
 
 // fill button style

apps/app/src/styles/atoms/_code.scss

@@ -1,5 +1,5 @@
 @use '~/styles/variables' as var;
-@use '~/styles/bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 /*
  * style of inline-code

apps/app/src/styles/atoms/_custom_control.scss

@@ -1,4 +1,4 @@
-@use '../bootstrap/init' as *;
+@use '@growi/core/scss/bootstrap/init' as *;
 
 // TODO: activate (https://redmine.weseek.co.jp/issues/128307)
 

apps/app/src/styles/atoms/mixins/_buttons.scss

@@ -1,4 +1,4 @@
-@use '../../bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 @mixin button-svg-icon-variant($background, $hover-background: darken($background, 7.5%), $active-background: darken($background, 10%)) {
   svg {

apps/app/src/styles/organisms/_wiki.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use '../variables' as var;
-@use '../bootstrap/init' as bs;
 
 .wiki {
   @mixin add-left-border($width) {

apps/app/src/styles/theme/_apply-colors-dark.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as *;
+
 @use '../variables' as var;
-@use '../bootstrap/init' as *;
 @use '../atoms/mixins/buttons' as mixins-buttons;
 @use './mixins/count-badge';
 @use './mixins/hsl-button';

apps/app/src/styles/theme/_apply-colors-light.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as *;
+
 @use '../variables' as var;
-@use '../bootstrap/init' as *;
 @use '../atoms/mixins/buttons' as mixins-buttons;
 @use './mixins/count-badge';
 @use './mixins/hsl-button';

apps/app/src/styles/theme/apply-colors.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as *;
+
 @use '../variables' as var;
-@use '../bootstrap/init' as *;
 @use '../mixins';
 @use '../atoms/mixins/code';
 @use './mixins/hsl-button';

apps/app/src/styles/theme/mixins/_hsl-button.scss

@@ -1,4 +1,4 @@
-@use '../../bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 @use '../hsl-functions' as hsl;
 
 // @mixin button-variant($background, $border, $hover-background: darken($background, 7.5%), $hover-border: darken($border, 10%), $active-background: darken($background, 10%), $active-border: darken($border, 12.5%)) {

apps/app/src/styles/theme/mixins/_list-group.scss

@@ -1,4 +1,5 @@
-@use '../../bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use '../../mixins';
 @use './count-badge';
 

apps/app/src/styles/vendor.scss

@@ -1,4 +1,4 @@
-@import './bootstrap/apply';
+@import '@growi/core/scss/bootstrap/apply';
 
 // react-bootstrap-typeahead
 @import 'react-bootstrap-typeahead/css/Typeahead';

packages/core/package.json

@@ -7,7 +7,8 @@
     "growi"
   ],
   "files": [
-    "dist"
+    "dist",
+    "scss"
   ],
   "type": "module",
   "main": "dist/index.cjs",
@@ -49,7 +50,8 @@
     "./dist/utils/*": {
       "import": "./dist/utils/*.js",
       "require": "./dist/utils/*.cjs"
-    }
+    },
+    "./scss/*": "./scss/*.scss"
   },
   "scripts": {
     "build": "vite build",

apps/app/src/styles/bootstrap/_variables.scss → packages/core/scss/bootstrap/_variables.scss

@@ -1,5 +1,3 @@
-@use '../variables';
-
 // TODO: activate (https://redmine.weseek.co.jp/issues/128307)
 
 //
@@ -8,7 +6,7 @@
 
 //== Colors
 //
-$primary: variables.$growi-blue !default;
+// $primary: variables.$growi-blue !default;
 // $secondary: #6c757d !default;
 // $info: #009fbb !default;
 // $success: #00bb83 !default;

packages/preset-themes/src/styles/antarctic.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use './variables' as *;
-@use './bootstrap/variables' as *;
 @use './theme/mixins/page-editor-mode-manager';
 @use './theme/hsl-functions' as hsl;
 

packages/preset-themes/src/styles/atoms/mixins/_buttons.scss

@@ -1,4 +1,4 @@
-@use '../../bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
 
 @mixin button-svg-icon-variant($background, $hover-background: darken($background, 7.5%), $active-background: darken($background, 10%)) {
   svg {

packages/preset-themes/src/styles/blackboard.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use './variables' as *;
-@use './bootstrap/variables' as *;
 @use './theme/mixins/page-editor-mode-manager';
 @use './theme/hsl-functions' as hsl;
 

packages/preset-themes/src/styles/bootstrap/_apply.scss

@@ -1,45 +0,0 @@
-@use 'init' as *;
-
-// apply bootstrap
-
-// Layout & components
-@import 'bootstrap/scss/root';
-@import 'bootstrap/scss/reboot';
-@import 'bootstrap/scss/type';
-@import 'bootstrap/scss/images';
-@import 'bootstrap/scss/containers';
-@import 'bootstrap/scss/grid';
-@import 'bootstrap/scss/tables';
-@import 'bootstrap/scss/forms';
-@import 'bootstrap/scss/buttons';
-@import 'bootstrap/scss/transitions';
-@import 'bootstrap/scss/dropdown';
-@import 'bootstrap/scss/button-group';
-@import 'bootstrap/scss/nav';
-@import 'bootstrap/scss/navbar';
-@import 'bootstrap/scss/card';
-@import 'bootstrap/scss/accordion';
-@import 'bootstrap/scss/breadcrumb';
-@import 'bootstrap/scss/pagination';
-@import 'bootstrap/scss/badge';
-@import 'bootstrap/scss/alert';
-@import 'bootstrap/scss/progress';
-@import 'bootstrap/scss/list-group';
-@import 'bootstrap/scss/close';
-@import 'bootstrap/scss/toasts';
-@import 'bootstrap/scss/modal';
-@import 'bootstrap/scss/tooltip';
-@import 'bootstrap/scss/popover';
-@import 'bootstrap/scss/carousel';
-@import 'bootstrap/scss/spinners';
-@import 'bootstrap/scss/offcanvas';
-@import 'bootstrap/scss/placeholders';
-
-// Helpers
-@import 'helpers';
-
-// Utilities
-@import 'utilities/api';
-
-// override
-@import './override';

packages/preset-themes/src/styles/bootstrap/_init.scss

@@ -1,13 +0,0 @@
-@import 'bootstrap/scss/functions';
-
-@import './variables';
-@import 'bootstrap/scss/variables';
-@import 'bootstrap/scss/variables-dark';
-
-@import 'bootstrap/scss/maps';
-// TODO: activate (https://redmine.weseek.co.jp/issues/128307)
-// merge $colors to $theme-colors
-// $theme-colors: map-merge($theme-colors, $colors);
-
-@import 'bootstrap/scss/mixins';
-@import 'bootstrap/scss/utilities';

packages/preset-themes/src/styles/bootstrap/_override.scss

@@ -1,176 +0,0 @@
-// TODO: activate (https://redmine.weseek.co.jp/issues/128307)
-
-// * {
-//   outline: none !important;
-// }
-
-// .container,
-// .container-sm,
-// .container-md,
-// .container-lg,
-// .container-xl,
-// .container-fluid {
-//   @include media-breakpoint-down(xs) {
-//     padding-right: 10px;
-//     padding-left: 10px;
-//   }
-//   @include media-breakpoint-up(md) {
-//     padding-right: 30px;
-//     padding-left: 30px;
-//   }
-// }
-
-// h1 {
-//   font-size: 36px;
-//   line-height: 48px;
-// }
-
-// h2 {
-//   font-size: 24px;
-//   line-height: 36px;
-// }
-
-// h3 {
-//   font-size: 21px;
-//   line-height: 30px;
-// }
-
-// h4 {
-//   font-size: 18px;
-//   line-height: 22px;
-// }
-
-// h5 {
-//   font-size: 16px;
-//   line-height: 18px;
-// }
-
-// h6 {
-//   font-size: 12px;
-//   line-height: 18px;
-// }
-
-// // Navs
-// .nav-tabs {
-//   .nav-item {
-//     margin-right: 0.15rem;
-//     a.active {
-//       cursor: default;
-//     }
-//   }
-// }
-
-// // Custom Control
-// .custom-control {
-//   .custom-control-input,
-//   .custom-control-input + .custom-control-label {
-//     cursor: pointer;
-//   }
-// }
-
-// // card (substitute panel of bootstrap3)
-// .card {
-//   margin-bottom: 20px;
-// }
-
-// .card-header {
-//   font-weight: 700;
-//   text-transform: none;
-// }
-
-// .card-header:first-child {
-// }
-
-// // Well (substitute Well of bootstrap3)
-// .card.well {
-//   min-height: 20px;
-//   padding: $card-spacer-y $card-spacer-x;
-// }
-
-// // Dropdowns
-// .dropdown-toggle {
-//   &.btn.disabled {
-//     pointer-events: auto;
-//     cursor: not-allowed;
-//   }
-
-//   // hide caret
-//   &.dropdown-toggle-no-caret::after {
-//     content: none;
-//   }
-// }
-
-// // Badges
-// .badge {
-//   @extend .badge-pill;
-// }
-
-// //Modals
-// .modal-open {
-//   width: 100%;
-//   padding-right: 0 !important;
-// }
-
-// .modal-content {
-//   box-shadow: 0 0.3rem 1rem rgba(0, 0, 0, 0.1);
-// }
-
-// .modal-header {
-//   border-bottom: 1px solid #e5e5e5;
-// }
-
-// .modal-footer {
-//   border-top: 1px solid #e5e5e5;
-// }
-
-// // When fading in the modal, animate it to slide down
-// .modal.fade .modal-dialog {
-//   @include transition($modal-transition);
-//   transform: $modal-fade-transform;
-// }
-
-// .modal.show .modal-dialog {
-//   transform: $modal-show-transform;
-// }
-
-// // When trying to close, animate focus to scale
-// .modal.modal-static .modal-dialog {
-//   transform: $modal-scale-transform;
-// }
-
-// // col-form-label (substitute for control-label of bootstrap3)
-// .col-form-label {
-//   text-align: right;
-// }
-
-// // label
-// label {
-//   // add with-no-font-weight class in case you do not want to apply font-weight 700 to label
-//   :not(.with-no-font-weight) {
-//     font-weight: 700;
-//   }
-// }
-
-// // disabled button (reproduction from bootstrap3.)
-// // see https://cccabinet.jpn.org/bootstrap4/components/buttons#disabled-state
-// .btn.disabled,
-// .btn[disabled],
-// fieldset[disabled] .btn {
-//   cursor: not-allowed;
-// }
-
-// // progress bar
-// .progress {
-//   margin-bottom: 18px;
-//   overflow: hidden;
-// }
-
-// .text-break {
-//   word-break: break-word;
-//   overflow-wrap: break-word;
-// }
-
-// // prevent tooltip flickering (flashing) on hover
-// .tooltip {
-//   pointer-events: none;
-// }

packages/preset-themes/src/styles/bootstrap/_variables.scss

@@ -1,170 +0,0 @@
-@use '../variables';
-
-// TODO: activate (https://redmine.weseek.co.jp/issues/128307)
-
-//
-// Variables
-// --------------------------------------------------
-
-//== Colors
-//
-$primary: variables.$growi-blue !default;
-// $secondary: #6c757d !default;
-// $info: #009fbb !default;
-// $success: #00bb83 !default;
-// $warning: #ffa32b !default;
-// $danger: #ff0a54 !default;
-// $light: #e4e7ea !default;
-// $dark: #343a40 !default;
-// $gray-50: lighten($light, 7%) !default;
-// $gray-100: lighten($light, 4%) !default;
-// $gray-200: $light !default;
-// $gray-300: darken($light, 5%) !default;
-// $gray-400: darken($light, 20%) !default;
-// $gray-500: darken($light, 30%) !default;
-// $gray-550: lighten($dark, 15%) !default;
-// $gray-600: lighten($dark, 10%) !default;
-// $gray-700: lighten($dark, 5%) !default;
-// $gray-800: $dark !default;
-// $gray-900: darken($dark, 5%) !default;
-// $grays: (
-//   '50': $gray-50,
-// ) !default;
-// $red: #ff0a54 !default;
-
-// Options
-//
-// Quickly modify global styling by enabling or disabling optional features.
-
-// $enable-shadows: true;
-
-// Links
-//
-// Style anchor elements.
-
-// $link-hover-decoration: none !default;
-
-// Grid breakpoints
-//
-// Define the minimum dimensions at which your layout will change,
-// adapting to different screen sizes, for use in media queries.
-
-// $grid-breakpoints: (
-//   xs: 0,
-//   sm: 576px,
-//   md: 768px,
-//   lg: 992px,
-//   xl: 1200px,
-//   xxl: 1480px,
-// );
-
-// Grid containers
-//
-// Define the maximum width of `.container` for different screen sizes.
-
-// $container-max-widths: (
-//   sm: 540px,
-//   md: 720px,
-//   lg: 960px,
-//   xl: 1140px,
-//   xxl: 1320px,
-// );
-
-//== Typography
-//
-//## Font, line-height, and color for body text, headings, and more.
-$font-family-sans-serif: var(--font-family-sans-serif);
-$font-family-serif: var(--font-family-serif);
-$font-family-monospace: var(--font-family-monospace);
-$font-family-base: $font-family-sans-serif;
-
-// $font-size-base: 0.875rem;  // 16px -> 14px
-// $line-height-base: 1.42857;
-
-// $blockquote-footer-color: $gray-500;
-
-//== Components
-//
-// $border-radius: 4px;
-// $border-radius-sm: 0;
-// $border-radius-lg: 8px;
-
-// Buttons
-//
-// For each of Bootstrap's buttons, define text, background, and border color.
-// $btn-focus-box-shadow: none;
-// $btn-active-box-shadow: none;
-
-//== Forms
-//
-// $input-border-color: $gray-300;
-// $input-placeholder-color: $gray-500;
-
-// $custom-control-indicator-border-color: $gray-400;
-// $custom-control-label-disabled-color: $gray-500;
-// $custom-select-disabled-color: $gray-500;
-// $custom-range-thumb-disabled-bg: $gray-400;
-
-//== Navs
-// $nav-link-padding-y: 0.75rem;
-// $nav-link-padding-x: 1rem;
-// $nav-link-disabled-color: $gray-500;
-
-//== Navbar
-// $navbar-padding-y: 0;
-// $navbar-brand-padding-y: 0;
-// $navbar-nav-link-padding-x: 1rem;
-
-//== Dropdowns
-// $dropdown-border-radius: $border-radius-lg;
-// $dropdown-link-disabled-color: $gray-500;
-// $dropdown-header-color: $gray-500;
-// $dropdown-box-shadow: 0 0.5rem 0.7rem rgba(black, 0.1);
-
-//== Popovers
-// $popover-border-radius: $border-radius;
-// $popover-box-shadow: 0 0.5rem 0.7rem rgba(black, 0.1);
-
-//== Pagination
-// $pagination-disabled-color: $gray-500;
-
-//== Cards
-// $card-spacer-y: 7px;
-// $card-spacer-x: 15px;
-
-//== Toasts
-// $toast-header-color: $gray-500;
-
-//== Modals
-// $modal-content-border-width: 0;
-// $modal-content-border-radius: $border-radius-lg;
-// $modal-header-padding-y: 0.75rem;
-// $modal-header-padding-x: 1rem;
-
-//== Alerts
-// $alert-bg-level: -2;
-// $alert-border-level: 0;
-// $alert-color-level: -10;
-
-//== Progress bar
-// $progress-height: 4px;
-// $progress-bg: $gray-100;
-// $progress-box-shadow: none;
-
-//== List group
-// $list-group-disabled-color: $gray-500;
-
-//==  Figures
-// $figure-caption-color: $gray-500;
-
-//==  Breadcrumbs
-// $breadcrumb-divider-color: $gray-500;
-// $breadcrumb-active-color: $gray-500;
-
-//== Code
-$pre-color: dummyinvalildcolor; // disable pre color specification with invalid value
-
-//== Custom Checkbox
-// $custom-checkbox-indicator-border-radius: 0px;
-// $custom-control-indicator-focus-box-shadow: none;
-// $custom-control-indicator-size: 1.2rem;

packages/preset-themes/src/styles/christmas.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use './variables' as *;
-@use './bootstrap/variables' as *;
 @use './theme/mixins/page-editor-mode-manager';
 @use './theme/hsl-functions' as hsl;
 

packages/preset-themes/src/styles/default.scss

@@ -1,5 +1,6 @@
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use './variables' as var;
-@use './bootstrap/init' as *;
 @use './theme/mixins/page-editor-mode-manager';
 @use './theme/hsl-functions' as hsl;
 
@@ -20,8 +21,8 @@
   --bgcolor-global: hsl(var(--bgcolor-global-hs),var(--bgcolor-global-l));
   --bgcolor-global-hs: 0,0%;
   --bgcolor-global-l: 100%;
-  --bgcolor-inline-code: #{$gray-100}; //optional
-  --bgcolor-card: #{$gray-100};
+  --bgcolor-inline-code: #{bs.$gray-100}; //optional
+  --bgcolor-card: #{bs.$gray-100};
   --bgcolor-blinked-section: #{hsl.alpha(var(--primary),10%)};
   // --bgcolor-keyword-highlighted: #{$grw-marker-yellow};
 
@@ -39,8 +40,8 @@
   --color-link-wiki-hs: var(--color-link-hs);
   --color-link-wiki-l: var(--color-link-l);
   --color-link-wiki-hover: #{hsl.lighten(var(--color-link-wiki),20%)};
-  --color-link-nabvar: #{$gray-500};
-  --color-inline-code: #{darken($red, 15%)}; // optional
+  --color-link-nabvar: #{bs.$gray-500};
+  --color-inline-code: #{darken(bs.$red, 15%)}; // optional
 
   // List Group colors
   --color-list: var(--color-global); // optional
@@ -49,7 +50,7 @@
   --bgcolor-list-hover: #{hsl.darken(var(--bgcolor-global),3%)};// optional
   // --color-list-active: white ; // optional
   // --bgcolor-list-active: #{hsl.lighten(var(--bgcolor-global),3%)}; // optional
-  // --color-page-list-group-item-meta: #{$gray-500}; // optional
+  // --color-page-list-group-item-meta: #{bs.$gray-500}; // optional
 
   // Table colors
   // --color-table: #; // optional
@@ -59,7 +60,7 @@
   // --bgcolor-table-hover: #; // optional
 
   // Navbar
-  --bgcolor-navbar: #{$gray-900};
+  --bgcolor-navbar: #{bs.$gray-900};
   --bgcolor-navbar-h:0;
   --bgcolor-navbar-s:0%;
   --bgcolor-navbar-l:12.94%;
@@ -97,7 +98,7 @@
   --bgcolor-sidebar-context-l: calc(var(--primary-l) + 77%);
 
   // Sidebar list group
-  // --bgcolor-sidebar-list-group: #{$gray-50}; // optional
+  // --bgcolor-sidebar-list-group: #{bs.$gray-50}; // optional
 
   // Subnavigation
   --bgcolor-subnav: hsl(var(--bgcolor-subnav-hs),var(--bgcolor-subnav-l));
@@ -105,7 +106,7 @@
   --bgcolor-subnav-l: calc(var(--bgcolor-global-l) - 3%);
 
   // Tabs
-  // --bordercolor-nav-tabs: #{$gray-300}; // optional
+  // --bordercolor-nav-tabs: #{bs.$gray-300}; // optional
   // --color-nav-tabs-link-active: #; //optional
   // --bordercolor-nav-tabs-hover: # # $bordercolor-nav-tabs; // optional
   // --bordercolor-nav-tabs-active: # # // optional
@@ -118,8 +119,8 @@
   --color-editor-icons: var(--color-global);
 
   // Border colors
-  --border-color-theme: #{$gray-400};
-  --bordercolor-inline-code: #{$gray-400}; // optional
+  --border-color-theme: #{bs.$gray-400};
+  --bordercolor-inline-code: #{bs.$gray-400}; // optional
 
   // Dropdown colors
   --bgcolor-dropdown-link-active: #{var.$growi-blue};
@@ -161,7 +162,7 @@
   --color-global: hsl(var(--color-global-hs),var(--color-global-l));
   --color-global-hs: 0,0%;
   --color-global-l: 74%;
-  --color-reversal: #{$gray-900};
+  --color-reversal: #{bs.$gray-900};
   // --color-header: desaturate($primary, 20%);
   --color-link: hsl(var(--color-link-hs),var(--color-link-l));
   --color-link-hs: 219.3,51.7%;
@@ -198,7 +199,7 @@
 
   // Logo colors
   --bgcolor-logo: var(--bgcolor-navbar);
-  --fillcolor-logo-mark: #{$gray-700};
+  --fillcolor-logo-mark: #{bs.$gray-700};
 
   // Sidebar
   --bgcolor-sidebar: hsl(var(--bgcolor-sidebar-hs),var(--bgcolor-sidebar-l));
@@ -227,7 +228,7 @@
   --bgcolor-subnav-l: calc(var(--bgcolor-global-l) + 4%);
 
   // Tabs
-  --bordercolor-nav-tabs: #{$gray-700}; // optional
+  --bordercolor-nav-tabs: #{bs.$gray-700}; // optional
   // --color-nav-tabs-link-active: #; //optional
   --bordercolor-nav-tabs-hover: #666 #666 var(--bordercolor-nav-tabs); // optional
   --bordercolor-nav-tabs-active: var(--bordercolor-nav-tabs) var(--bordercolor-nav-tabs) var(--bgcolor-global); // optional

packages/preset-themes/src/styles/theme/mixins/_hsl-button.scss

@@ -1,4 +1,5 @@
-@use '../../bootstrap/init' as bs;
+@use '@growi/core/scss/bootstrap/init' as bs;
+
 @use '../hsl-functions' as hsl;
 
 // @mixin button-variant($background, $border, $hover-background: darken($background, 7.5%), $hover-border: darken($border, 10%), $active-background: darken($background, 10%), $active-border: darken($border, 12.5%)) {