/* B端元件的總結

1、元件cssBase的總結

1畫素底部邊框 */

@mixin border - 1px - b($background: $gray - lightest) {

content: "";

display: block;

width: 200 %;

height: 1px;

background: $background;

-webkit - transform: scale(0.5);

transform: scale(0.5);

-webkit - transform - origin: 0 1px;

transform - origin: 0 1px; // 屬性允許您改變被轉換元素的位置 x,y,z

position: absolute;

left: 0;

bottom: 0;

z - index: 10;

}

/*

*css_base_cssBase &_擴充套件

*/

.css_base {

&_cssBase {

box - shadow: h - shadow v - shadow blur spread color inset; // 水平陰影的位置 垂直陰影的位置 模糊距離 陰影的尺寸 陰影的顏色

position: relative;

@include border - 1px - b();

}

}

/*

* cssThemeB

* @desc 主題包括{bg,color,font-size}

* 學習要點----為了方便字型的擴充套件，封裝成單獨的物件

*/

let themeConfig= {

bg: [ {

class: "bg-toast",

name: "遮罩層背景色"

}

],

color:[ {

class: "color-title",

name: "主標題色"

}

],

font-color:[ {

class: "font-sz",

name: "主標題色"

}

]

}

/*

* cssIconB 圖示進行轉化字型方式引用---base64---可以轉化、支援多種格式

*/

# iconfonts

本資料夾用來處理圖示字型相關，

## svg轉字型庫

使用icommon網站，進行圖示轉化

網址：https://icomoon.io

轉出的字型庫包括eot、svg、ttf、woff、json檔案

## 字型庫使用

字型庫使用dataUrl的形式嵌入到iconfonts.css中。

字型檔案轉base64網址（https://www.motobit.com/util/base64-decoder-encoder.asp）

## 字型庫更新

資料夾中包含selection.json檔案，可以放入icomoon中，還原當前字型檔案

/*

* 基礎元件技術總結

*/