浏览代码

修改bug,新增方法

笔下光年 6 年之前
父节点
当前提交
f2668acc56
共有 4 个文件被更改,包括 84 次插入5 次删除
  1. 4 0
      README.md
  2. 15 5
      css/style.min.css
  3. 24 0
      lyear_ui_cards.html
  4. 41 0
      lyear_ui_icons.html

+ 4 - 0
README.md

@@ -25,6 +25,7 @@
 - 所有需要的链接加上`class="multitabs"`
 - 因为插件做了一些修改,在顶部的下拉菜单(dropdown-menu)中,不要把链接写在href里面,放到data-url里
 - 插件用到了HTML5的会话存储,因此在修改了init里的默认地址后,可以再浏览器控制台执行下sessionStorage.clear(); // cache配置为true时
+- 在iframe的页面中新建tab的使用方法,<code>&lt;a href=&quot;#!&quot; class=&quot;js-create-tab&quot; data-title=&quot;按钮&quot; data-url=&quot;lyear-buttons.html&quot;&gt;新建按钮&lt;/a&gt;</code>
 
 #### 谁在用
 - [ins1st-plus 一款基于SpringBoot、Dubbo的分布式脚手架](https://gitee.com/sdjwj1118/ins1st-plus)
@@ -45,6 +46,9 @@
 - Bootstrap-Multitabs
 
 #### 更新记录
+2019.12.08
+修改cssbug,新增card-footer,新增通用绑定iframe打开tab的方法,增加图标的一些使用类
+
 2019.08.04
 修改样式bug
 

+ 15 - 5
css/style.min.css

@@ -1358,7 +1358,7 @@ input[type=radio] {
 .show>.btn-default.dropdown-toggle {
 	background-color: #f9fafb!important;
 	border-color: #ebebeb!important;
-	color: #fff;
+	color: #4d5259;
 	-webkit-box-shadow: none;
 	box-shadow: none
 }
@@ -2787,7 +2787,6 @@ dd, dt {
 	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.035);
 }
 .card-header {
-	display: table;
 	width: 100%;
 	margin: 0;
 	padding: 15px 24px;
@@ -2798,11 +2797,18 @@ dd, dt {
 	display: table-cell;
 	vertical-align: middle;
 }
+.card-header:after,
+.card-footer:after {
+    display: table;
+    content: " ";
+    clear: both;
+}
 .card-body {
     padding: 24px 24px;
 }
 .card-header .h4,
 .card-header h4 {
+    float: left;
     font-size: 16px;
 }
 .card-header + .card-body {
@@ -2890,7 +2896,11 @@ dd, dt {
 .card .tab-content {
     padding: 10px 24px;
 }
-
+.card-footer {
+    background-color: #fcfdfe;
+    border-top: 1px solid rgba(77,82,89,0.05);
+    padding: 15px 24px;
+}
 /* page-tabs */
 .page-tabs.nav-tabs {
     padding: 0px 10px;
@@ -3273,9 +3283,9 @@ dd, dt {
         float: none!important;
     }
 }
-@media screen and (max-width: 420px) {
+@media screen and (max-width: 430px) {
     .dropdown-skin .dropdown-menu {
-        width: -131px!important; 
+        left: -80px!important; 
     }
     .nav-step .nav-step-item p {
         display: none;

+ 24 - 0
lyear_ui_cards.html

@@ -186,6 +186,18 @@
         <div class="card-body">
           <p>内容...</p>
         </div>
+        <footer class="card-footer">
+          <div class="example-left m-t-10 pull-left">
+            <label class="lyear-checkbox">
+              <input type="checkbox">
+              <span>五天内自动登录</span>
+            </label>
+          </div>
+          <div class="example-right pull-right">
+            <button class="btn btn-primary" type="reset" id="example-five">登录</button>
+            <button class="btn btn-danger" type="submit">注册</button>
+          </div>
+        </footer>
       </div>
     </div>
     <!-- .col-sm-6 -->
@@ -203,6 +215,18 @@
         <div class="card-body">
           <p>内容...</p>
         </div>
+        <footer class="card-footer">
+          <div class="example-left m-t-10 pull-left">
+            <label class="lyear-checkbox">
+              <input type="checkbox">
+              <span>五天内自动登录</span>
+            </label>
+          </div>
+          <div class="example-right pull-right">
+            <button class="btn btn-primary" type="reset" id="example-five">登录</button>
+            <button class="btn btn-danger" type="submit">注册</button>
+          </div>
+        </footer>
       </div>
     </div>
     <!-- .col-sm-6 --> 

+ 41 - 0
lyear_ui_icons.html

@@ -84,6 +84,47 @@
           <h5>使用</h5>
           <code>&lt;span class=&quot;mdi mdi-<span id="name">name</span>&quot;&gt;&lt;/span&gt;</code>
           <hr>
+          <p>尺寸</p>
+		  <div>
+		    <i class="mdi mdi-18px mdi-account"></i><code>mdi-18px</code>
+		    <i class="mdi mdi-24px mdi-account"></i><code>mdi-24px</code>
+		    <i class="mdi mdi-36px mdi-account"></i><code>mdi-36px</code>
+		    <i class="mdi mdi-48px mdi-account"></i><code>mdi-48px</code>
+		  </div>
+          <p>旋转</p>
+		  <div>
+			<i class="mdi mdi-36px mdi-rotate-45 mdi-account"></i><code>mdi-rotate-45</code> 
+            <i class="mdi mdi-36px mdi-rotate-90 mdi-account"></i><code>mdi-rotate-90</code>
+            <i class="mdi mdi-36px mdi-rotate-135 mdi-account"></i><code>mdi-rotate-135</code>
+            <i class="mdi mdi-36px mdi-rotate-180 mdi-account"></i><code>mdi-rotate-180</code>
+            <i class="mdi mdi-36px mdi-rotate-225 mdi-account"></i><code>mdi-rotate-225</code>
+            <i class="mdi mdi-36px mdi-rotate-270 mdi-account"></i><code>mdi-rotate-270</code>
+            <i class="mdi mdi-36px mdi-rotate-315 mdi-account"></i><code>mdi-rotate-315</code> 
+          </div>
+		  <p>翻转</p>
+		  <div>
+            <i class="mdi mdi-36px mdi-account-alert"></i>
+            <i class="mdi mdi-36px mdi-flip-h mdi-account-alert"></i><code>mdi-flip-h</code> 
+            <i class="mdi mdi-36px mdi-flip-v mdi-account-alert"></i><code>mdi-flip-v</code> 
+            <p>注意:我们不包括同时使用mdi-flip-*和mdi-rotate-*。</p>
+		  </div>
+		  <p>不断旋转</p>
+		  <div>
+			<i class="mdi mdi-36px mdi-spin mdi-loading"></i><code>mdi-spin</code>
+            <i class="mdi mdi-36px mdi-spin mdi-star"></i><code>mdi-spin</code>
+		  </div>
+		  <p>颜色</p>
+		  <div class="clearfix">
+            <div style="background-color:#000;float:left;">
+              <i class="mdi mdi-36px mdi-light mdi-account dark-demo"></i><code>mdi-light</code>
+            </div>
+            <div style="background-color:#000;">
+              <i class="mdi mdi-36px mdi-light mdi-inactive mdi-account dark-demo"></i><code>mdi-light mdi-inactive</code>
+            </div>
+            <i class="mdi mdi-36px mdi-dark mdi-account"></i><code>mdi-dark</code>
+            <i class="mdi mdi-36px mdi-dark mdi-inactive mdi-account"></i><code>mdi-dark mdi-inactive</code>
+		  </div>
+          <hr>
 <div class="example-icons">
   <div><i class="mdi mdi-access-point"></i><code>f002</code><span>mdi-access-point</span></div>
   <div><i class="mdi mdi-access-point-network"></i><code>f003</code><span>mdi-access-point-network</span></div>