Replace & remove npm packages

frontend/.eslintrc.js

@@ -8,7 +8,7 @@ module.exports = {
     '@vue/standard'
   ],
   parserOptions: {
-    parser: 'babel-eslint'
+    parser: '@babel/eslint-parser'
   },
   rules: {
     'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',

frontend/package.json

@@ -17,44 +17,37 @@
     "bootstrap-vue": "^2.21.2",
     "browser-detect": "^0.2.28",
     "core-js": "^3.6.5",
-    "font-awesome": "^4.7.0",
     "highlight.js": "10",
     "iview": "2",
     "katex": "^0.12.0",
     "moment": "^2.29.1",
     "papaparse": "^5.3.0",
-    "screenfull": "^5.1.0",
     "turndown": "^7.0.0",
     "vue": "^2.6.11",
-    "vue-analytics": "^5.22.1",
     "vue-clipboard2": "^0.3.1",
     "vue-codemirror-lite": "^1.0.4",
-    "vue-cropper": "^0.5.6",
     "vue-dompurify-html": "^2.3.0",
-    "vue-highlight-component": "^1.0.0",
     "vue-katex": "^0.5.0",
     "vue-router": "^3.2.0",
     "vue-simple-alert": "^1.1.1",
     "vuex": "^3.4.0",
     "vuex-router-sync": "^5.0.0"
   },
   "devDependencies": {
+    "@babel/eslint-parser": "^7.15.4",
     "@vue/cli-plugin-babel": "~4.5.0",
     "@vue/cli-plugin-eslint": "~4.5.0",
     "@vue/cli-plugin-router": "~4.5.0",
     "@vue/cli-plugin-vuex": "~4.5.0",
     "@vue/cli-service": "~4.5.0",
     "@vue/eslint-config-standard": "^5.1.2",
-    "babel-eslint": "^10.1.0",
-    "eslint": "^6.7.2",
+    "eslint": "^7.5.0",
     "eslint-plugin-import": "^2.20.2",
     "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-promise": "^4.2.1",
     "eslint-plugin-standard": "^4.0.0",
-    "eslint-plugin-vue": "^6.2.2",
-    "less": "^4.1.1",
-    "less-loader": "^5.0.0",
-    "node-sass": "^4.12.0",
+    "eslint-plugin-vue": "^7.17.0",
+    "sass": "^1.39.0",
     "sass-loader": "^8.0.2",
     "vue-cli-plugin-dll": "~1.1.12",
     "vue-template-compiler": "^2.6.11"

frontend/src/pages/admin/index.js

@@ -8,8 +8,6 @@ import 'bootstrap-vue/dist/bootstrap-vue.css'
 
 import filters from '@/utils/filters'
 import router from './router'
-import { GOOGLE_ANALYTICS_ID } from '@/utils/constants'
-import VueAnalytics from 'vue-analytics'
 import 'katex/dist/katex.min.css'
 import VueKatex from 'vue-katex'
 import VueSimpleAlert from 'vue-simple-alert'
@@ -25,11 +23,6 @@ Object.keys(filters).forEach(key => {
   Vue.filter(key, filters[key])
 })
 
-Vue.use(VueAnalytics, {
-  id: GOOGLE_ANALYTICS_ID,
-  router
-})
-
 Vue.use(BootstrapVue)
 Vue.use(BootstrapVueIcons)
 

frontend/src/pages/admin/views/Home.vue

@@ -14,19 +14,6 @@
         >
           <b-icon icon="fonts"></b-icon>
         </b-button>
-        <b-button
-          variant="outline-secondary"
-          size="sm"
-          v-b-tooltip.hover
-          title="FullScrean"
-        >
-          <screen-full
-            :width="14"
-            :height="14"
-            class="screen-full"
-            style="margin: 0;"
-          />
-        </b-button>
         <b-dropdown
           variant="outline-secondary"
           size="sm"
@@ -68,16 +55,14 @@
 import { types } from '@/store'
 import { mapGetters } from 'vuex'
 import SideMenu from '../components/SideMenu.vue'
-import ScreenFull from '@admin/components/ScreenFull.vue'
 import KatexEditor from '@admin/components/KatexEditor.vue'
 import api from '../api'
 
 export default {
   name: 'App',
   components: {
     SideMenu,
-    KatexEditor,
-    ScreenFull
+    KatexEditor
   },
   async beforeRouteEnter (to, from, next) {
     const res = await api.getProfile()
@@ -145,9 +130,6 @@ export default {
     line-height: 50px;
     height: 50px;
     background: #F9FAFC;
-    .screen-full {
-      margin-right: 8px;
-    }
   }
 
   .content-app {

frontend/src/pages/oj/components/Header.vue

@@ -116,7 +116,7 @@ export default {
       text-decoration-color: #8dc63f;
     }
   }
-  /deep/ .modal-med {
+  ::v-deep .modal-med {
     .modal-dialog {
       .modal-content {
         position:absolute;
@@ -134,7 +134,7 @@ export default {
       }
     }
   }
-  /deep/ .modal-big {
+  ::v-deep .modal-big {
     .modal-dialog {
       .modal-content {
         min-width:800px;

frontend/src/pages/oj/index.js

@@ -3,10 +3,8 @@ import App from './App.vue'
 import router from './router'
 import store from '@/store'
 import VueClipboard from 'vue-clipboard2'
-import VueAnalytics from 'vue-analytics'
 import VueSimpleAlert from 'vue-simple-alert'
 import VueDOMPurifyHTML from 'vue-dompurify-html'
-import { GOOGLE_ANALYTICS_ID } from '@/utils/constants'
 
 import iView from 'iview'
 import 'iview/dist/styles/iview.css'
@@ -39,10 +37,6 @@ Vue.use(highlight)
 Vue.use(VueKatex)
 Vue.use(VueSimpleAlert)
 Vue.use(VueDOMPurifyHTML)
-Vue.use(VueAnalytics, {
-  id: GOOGLE_ANALYTICS_ID,
-  router
-})
 
 Vue.config.devtools = process.env.NODE_ENV !== 'production'
 

frontend/src/pages/oj/views/general/Home.vue

@@ -230,7 +230,7 @@ export default {
     }
   }
 
-  /deep/ .table {
+  ::v-deep .table {
     tr {
       outline: none;
       font-size: 16px;

frontend/src/pages/oj/views/problem/Problem.vue

@@ -537,7 +537,7 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
   @font-face {
     font-family: 'Manrope';
     src: url("../../../../fonts/Manrope-Bold.ttf");
@@ -617,11 +617,11 @@ export default {
       min-width: 125px;
     }
 
-    /deep/ .dropdown button{
+    .dropdown::v-deep button{
       background: #45576C;
     }
 
-    /deep/ .dropdown ul {
+    .dropdown::v-deep ul {
       background: #45576C;
 
       li a {

frontend/src/pages/oj/views/problem/ProblemSidebar.vue

@@ -425,7 +425,7 @@ export default {
     }
   }
 
-  /deep/ .modal {
+  ::v-deep .modal {
     .modal-dialog {
       min-width: 1200px;
 
@@ -533,11 +533,11 @@ export default {
           }
 
           // occasional code indent css fix
-          /deep/ #submission-source-code .CodeMirror-sizer {
+          #submission-source-code::v-deep .CodeMirror-sizer {
             margin-left: 38px !important;
           }
 
-          /deep/ #submission-source-code .CodeMirror-gutter-wrapper {
+          #submission-source-code::v-deep .CodeMirror-gutter-wrapper {
             left: -38px !important;
           }
 
@@ -571,7 +571,7 @@ export default {
     }
   }
 
-  /deep/ .pagination {
+  ::v-deep .pagination {
     margin-left: 25px;
 
     .page-link {

frontend/src/pages/oj/views/user/ResetPassword.vue

@@ -144,7 +144,7 @@ export default {
     width:140px;
     margin-left:34px;
   }
-  /deep/ .modal-md {
+  ::v-deep .modal-md {
     .modal-dialog {
       .modal-content {
         position:absolute;

frontend/src/utils/constants.js

@@ -136,5 +136,3 @@ export function buildProblemCodeKey (problemID, contestID = null) {
   }
   return `${STORAGE_KEY.PROBLEM_CODE}_NaN_${problemID}`
 }
-
-export const GOOGLE_ANALYTICS_ID = 'UA-111499601-1'