Startseite Erkunden Hilfe
Anmelden
pwa
/
Lungo2.0.js
Mirror von https://github.com/xabstract/Lungo2.0.js.git
2
0
Fork 0
Dateien Issues 0 Wiki
Quellcode durchsuchen

New style for buttons

@soyjavi vor 14 Jahren
Ursprung
699a440506
Commit
c5c8eee1a6
5 geänderte Dateien mit 18 neuen und 15 gelöschten Zeilen
Geteilte Ansicht Diff-Statistik anzeigen
  1. 8 3
      examples/test/index.html
  2. 2 5
      src/stylesheets/css/Lungo.theme.default.css
  3. 1 1
      src/stylesheets/css/Lungo.widgets.button.css
  4. 5 5
      src/stylesheets/less/Lungo.theme.default.less
  5. 2 1
      src/stylesheets/less/Lungo.widgets.button.less

+ 8 - 3
examples/test/index.html
Datei anzeigen 

@@ -39,7 +39,11 @@
 
 <body class="app">
 
     <section id="test-1" class="pop">
 
         <header data-title="Test-1" class="extended">
 
-            <a href="#kitchen-sink-scroll" class="button onleft" data-target="aside" data-icon="items"></a>
 
+            <div class="onleft">
 
+                <a href="#kitchen-sink-scroll" class="button default onleft" data-target="aside" data-icon="items"></a>
 
+                <a href="#kitchen-sink-scroll" class="button onleft" data-target="aside" data-icon="items">Prueba</a>
 
+                <a href="#kitchen-sink-scroll" class="button onleft" data-target="aside">Prueba</a>
 
+            </div>
 
             <nav class="onright">
 
                 <a href="#" class="active" data-icon="star"></a>
 
                 <a href="#profiles" class="active"  data-target="aside" data-icon="plus">&nbsp;Add</a>
 
@@ -52,7 +56,7 @@
 
             <a href="#nav-2" data-target="article" data-icon="calendar">&nbsp;Calendar</a>
 
         </nav>
 
 
-<!--
 
+        <!--
 
         <footer class="toolbar with-labels">
 
             <nav>
 
                 <a href="#nav-1" data-target="article" data-icon="clock" data-label="Alarm"></a>
 
@@ -60,7 +64,8 @@
 
                 <a href="#nav-3" data-target="article" data-icon="mail" data-label="Emails" data-count="124"></a>
 
                 <a href="#nav-4" data-target="article" data-icon="phone" data-label="Calls" data-count="12"></a>
 
             </nav>
 
-        </footer> -->
 
+        </footer>
 
+        -->
 
 
         <footer class="toolbar">
 
             <nav>

+ 2 - 5
src/stylesheets/css/Lungo.theme.default.css
Datei anzeigen 

@@ -263,15 +263,12 @@ section.aside.onright {
 
   -webkit-background-clip: padding-box;
 
   -moz-background-clip: padding;
 
   background-clip: padding-box;
 
-  -webkit-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.25), inset 0 -3px 0 rgba(255, 255, 255, 0.05);
 
+  -webkit-box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(0, 0, 0, 0.1), inset -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 -2px 0 rgba(0, 0, 0, 0.25), inset 0 -3px 0 rgba(255, 255, 255, 0.05), 0 1px 2px rgba(0, 0, 0, 0.3);
 
   font-weight: bold;
 
   text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
 
 }
 
-.button.big {
 
-  -webkit-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.25), inset 0 -3px 0 rgba(255, 255, 255, 0.05), 0 1px 2px rgba(0, 0, 0, 0.3);
 
-}
 
 .button:active {
 
-  -webkit-box-shadow: inset 0 29px 8px rgba(0, 0, 0, 0.1);
 
+  -webkit-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.2), inset 0 -2px 4px rgba(0, 0, 0, 0.3);
 
 }
 
 .button.default {
 
   background: #5a5a5a;

Datei-Diff unterdrückt, da er zu groß ist
+ 1 - 1
src/stylesheets/css/Lungo.widgets.button.css


+ 5 - 5
src/stylesheets/less/Lungo.theme.default.less
Datei anzeigen 

@@ -248,14 +248,14 @@ section.aside {
 
 /* @group .button */
 
 .button {
 
 	.border-radius(@border-radius);
 
-	-webkit-box-shadow: inset 0 -2px 0 rgba(0,0,0,0.25), inset 0 -3px 0 rgba(255,255,255, 0.05);
 
-	
+	-webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,0.1), inset 0 1px 0 rgba(0,0,0,0.1), inset -1px 0 0 rgba(0,0,0,0.1), inset 0 -2px 0 rgba(0,0,0,0.25), inset 0 -3px 0 rgba(255,255,255, 0.05), 0 1px 2px rgba(0,0,0,0.3);
 
+
 
 	font-weight: bold;
 
 	text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
 
 	
-	&.big { -webkit-box-shadow: inset 0 -2px 0 rgba(0,0,0,0.25), inset 0 -3px 0 rgba(255,255,255, 0.05), 0 1px 2px rgba(0,0,0,0.3); }
 
-	
-	&:active { -webkit-box-shadow: inset 0 29px 8px rgba(0,0,0,0.1); }
 
+	&:active { 
+		-webkit-box-shadow: inset 0 10px 30px rgba(0,0,0,0.2), inset 0 -2px 4px rgba(0,0,0,0.3);
 
+	}
 
 
 	&.default {
 
     	background: #5a5a5a;

+ 2 - 1
src/stylesheets/less/Lungo.widgets.button.less
Datei anzeigen 

@@ -12,7 +12,8 @@
 
 
 a.button {
 
 	display: inline-block;
 
-	height: 30px;
 
+	height: 32px;
 
+	//min-width: 32px;
 
 	padding: 0 9px 0 8px;
 
 	color: #fff !important;
 
 	outline: none;