jquery - how to make button in ionic + css -

-

i need design toolbar in ionic .i able make tool bar not similar in below pic.in given image buttons small height , small font .second thing second button bigger than rest .in given image button have different width .can make same button in ionic tried in ionic not able make same above how make same type of toolbar in ionic show in image

here code

![<html ng-app="ionicapp">  <head>   <meta charset="utf-8">   <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">    <title>tabs example</title>    <link href="//code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet">   <script src="//code.ionicframework.com/nightly/js/ionic.bundle.js"></script> </head>  <body>  </body> <ion-view>     <ion-header-bar align-title="center" class="bar-balanced">         <div class="buttons">             <i style="font-size:30px;" class='icon ion-chevron-left'></i>         </div>         <h1 class="title">account</h1>     </ion-header-bar>     <ion-content>         <div class="button-bar">             <a class="button" ui-sref="d" ui-sref-active="button-balanced">details</a>             <a class="button" ui-sref="lunch" ui-sref-active="button-balanced">related</a>             <a class="button" ui-sref="dinner" ui-sref-active="button-balanced">sad</a>             <a class="button" ui-sref="dinner" ui-sref-active="button-balanced">ss</a>         </div>       </ion-content> </ion-view> </html>]

try adding in css @ bottom else may need use !important.

.button-bar > .button:first-child{   border-top-left-radius: 10px !important;   border-bottom-left-radius: 10px !important; }  .button-bar > .button:last-child{     border-top-right-radius: 10px !important;   border-bottom-right-radius: 10px !important; }

i have updated sample


Comments

Post a Comment

Popular posts from this blog

angularjs - Redirect to a new template in angular js -

-
i new angularjs, please consider mistakes. the scenario is, have index.html page , login.html page, index , login have different layout different header footer , all. other pages expect login share same layout index.html now, how can navigate login.html using anuglar ui router. myapp.config(function ($stateprovider, $urlrouterprovider) { $stateprovider.state('home', { url: '/', templateurl: 'app/views/site/home.html', controller: 'homectrl' }).state('login', { url: '/login', templateurl: 'app/views/site/login.html' }) }); this not work loads content of login index keeping header , footer same of index. know state supposed work way. now, there way can call new view using ui.router. i appreciate help. thanks you set multiple named views ( https://github.com/angular-ui/ui-router/wiki/multiple-named-views ). this allow make header , footer separate views can ...
Read more

Oracle SQL. How to select specific IDs where value of columns specify criteria? -

-
i have following statement/query: select table1.file_id, table1.status, table2.status table1 inner join table2 on table1.file_id = table2.file_id; the result follows: file id | status table 1 | status table 2 ----------------------------------------------------- 5500002 | ax | ics 5500002 | ax | icso 5500002 | axo | ics 5500003 | ax | ics 5500003 | ax | ics 5500003 | ax | ics 5500004 | null | icso test 5500004 | axo | ics 5500004 | ax | null i need each file id check 4 statuses: - ax - axo - ics - icso i want run select on file id s cover 4 statuses. can see file id occurs multiple times , i'd want query return file id fulfills requirement, in instance return 5500002 , 5500004. for 550000...
Read more

Desktop Launcher for Python Script Starts Program in Wrong Path (Linux) -

-
i can not launch python script .desktop launcher created on linux mint 17.1 cinnamon. the problem script launched in wrong path - namely home folder instead of directory placed in. thereby can not find other vital files accompanying in folder , hence not work. to examine misbehaviour created short script check folder python script executing in: #!/usr/bin/env python import subprocess import time subprocess.call(["pwd"], shell=true) time.sleep(7) # chance read output executing own folder gives output: /home/myusername/pythonprojects i setting desktop launcher via nemo's menu. executing same script yields: /home/myusername i not understand behaviour. how create working desktop launcher python script? the page https://linuxcritic.wordpress.com/2010/04/07/anatomy-of-a-desktop-file/ describes format of .desktop files. you may note "path" element, specifies working directory file run in. in case want desktop file specified path=/...
Read more