css – DijitalTurk https://dijitalturk.com/veysel Dijital Paylaşımlar Tue, 09 Feb 2021 10:16:05 +0000 tr hourly 1 Dereceli seçim çubuğu – choice slider https://dijitalturk.com/veysel/dereceli-secim-cubugu-choice-slider/ https://dijitalturk.com/veysel/dereceli-secim-cubugu-choice-slider/#respond Tue, 09 Feb 2021 10:13:25 +0000 http://dijitalturk.com/veysel/?p=1445 Dereceli seçim çubuğu yapısını kolay bir css yapılandırması ile sağlayabilirsiniz. Aşağıda HTML – CSS kodlarını ve örnek çıktısını paylaşıyorum. Değer

The post Dereceli seçim çubuğu – choice slider appeared first on DijitalTurk.

]]>
Dereceli seçim çubuğu yapısını kolay bir css yapılandırması ile sağlayabilirsiniz. Aşağıda HTML – CSS kodlarını ve örnek çıktısını paylaşıyorum.

Değer aralıklarını otomatik olarak ayarlayacaktır ve mobil uyumludur(responsive)


CSS Kodları:

input:focus{
  outline: none;
}
.slider {
  -webkit-appearance: none;
  --range: calc(var(--max) - var(--min));
  --ratio: calc((var(--val) - var(--min))/var(--range));
  --sx: calc(.5*1.5em + var(--ratio)*(100% - 1.5em));
  margin: 0;
  padding: 0;
  width: 100%;
  height: 1.5em;
  //background: transparent;
  background-image: linear-gradient(to right, white , green);
  font: 1em/1 arial, sans-serif;
  border: none;
}
.slider, .slider::-webkit-slider-thumb {
  -webkit-appearance: none;
}
.slider::-webkit-slider-runnable-track {
  box-sizing: border-box;
  border: none;
  width: 12.5em;
  height: 0.5em;
  background-image: linear-gradient(to right, white , green);
}
.js .slider::-webkit-slider-runnable-track {
  background: linear-gradient(#7b1c1a, #7b1c1a) 0/var(--sx) 100% no-repeat #ccc;
}
.slider::-moz-range-track {
  box-sizing: border-box;
  border: none;
  height: 0.5em;
  background: #000000;
}
.slider::-ms-track {
  box-sizing: border-box;
  border: none;
  width: 12.5em;
  height: 0.5em;
  background: #000000;
}
.slider::-moz-range-progress {
  height: 0.5em;
  background: #000;
}
.slider::-ms-fill-lower {
  height: 0.5em;
  background: #000;
}
.slider::-webkit-slider-thumb {
  margin-top: -0.550em;
  box-sizing: border-box;
  border: none;
  width: 10px;
  height: 30px;
  border-radius: 10%;
  background: #000;
}
.slider::-moz-range-thumb {
  box-sizing: border-box;
  border: none;
  width: 10px;
  height: 30px;
  border-radius: 10%;
  background: #000;
}
.slider::-ms-thumb {
  margin-top: 0;
  box-sizing: border-box;
  border: none;
  width: 10px;
  height: 30px;
  border-radius: 10%;
  background: #000;
}
.slider::-ms-tooltip {
  display: none;
}
#tickmarks {
  display: flex;
  justify-content: space-between;
  padding: 0 10px;
}

#tickmarks p {
  position: relative;
  display: flex;
  justify-content: center;
  text-align: center;
  width: 1px;
  background: #D3D3D3;
  height: 10px;
  line-height: 40px;
  margin: 0 0 20px 0;
}

 

HTML kodları:

<div class="col-lg-4 d">
    <h3 class="baslik">
      Davranışsal Ortalama
    </h3>
    <p class="score">
      {{::data.davranissalScore}}
    </p>
    <input type="range" min="0" max="5" value="{{::data.davranissalScore}}" class="slider gh-slider-option4" id="davranissal">
    <div id="tickmarks">
      <p>N/A</p>
      <p>A</p>
      <p>B</p>
      <p>C</p>
      <p>D</p>
    </div>
  </div>

 

The post Dereceli seçim çubuğu – choice slider appeared first on DijitalTurk.

]]>
https://dijitalturk.com/veysel/dereceli-secim-cubugu-choice-slider/feed/ 0
Service Portal’da Cart ve Add to Cart Özelliğinin Kaldırılması https://dijitalturk.com/veysel/service-portalda-cart-ve-add-to-cart-ozelliginin-kaldirilmasi/ https://dijitalturk.com/veysel/service-portalda-cart-ve-add-to-cart-ozelliginin-kaldirilmasi/#respond Fri, 15 Nov 2019 06:38:21 +0000 http://dijitalturk.com/veysel/?p=1298 Eğer ServiceNow’un alış-veriş sepeti yapısını kullanmak istemiyorsanız  Service Portal ekranlarında Üst Menü’de “Cart” ve Request Item sayfasında “Add to Cart”

The post Service Portal’da Cart ve Add to Cart Özelliğinin Kaldırılması appeared first on DijitalTurk.

]]>
Eğer ServiceNow’un alış-veriş sepeti yapısını kullanmak istemiyorsanız  Service Portal ekranlarında Üst Menü’de “Cart” ve Request Item sayfasında “Add to Cart” özelliklerini kaldırmak isteyebilirsiniz.

O zaman yapmaız gerekenler – Header Menu:

  • Service Portal > Menus > SP Header Menu ‘yü açmalısınız.
  • Aşağıdaki kod satırını mevcut kod ile değiştirmelisiniz.

değişiklik: 4.satırda true değeri false yapılmasıdır.

[su_box title=”SP Header Menu ‘yü bulamayanlar için” style=”soft” box_color=”#aeacf8″] https://ORTAMINIZIN_ADI.service-now.com/nav_to.do?uri=%2Fsp_instance_menu_list.do%3Fsysparm_query%3DtitleLIKEsp%2520Header%26sysparm_first_row%3D1%26sysparm_view%3D%26sysparm_choice_query_raw%3D%26sysparm_list_header_search%3Dtrue[/su_box]

{
  "enable_cart": {
    "displayValue": "true",
    "value": false
  },
      "enable_wishlist": {
        "displayValue": "true",
          "value": true
      }
}

Sonuç:

Request Item sayfası – Add to Cart Butonu

  • https://ORTAMINIZIN_ADI.service-now.com/nav_to.do?uri=%2Fsp_instance.do%3Fsys_id%3De2656985ff630200ba13ffffffffff68
  • Additional options, JSON format alanında bulunan kodda “show_add_cart_button” nesnesinin value değerini false yapın.
"show_add_cart_button": {
  "value": "false",
  "displayValue": "false"
},

Sonuç:

The post Service Portal’da Cart ve Add to Cart Özelliğinin Kaldırılması appeared first on DijitalTurk.

]]>
https://dijitalturk.com/veysel/service-portalda-cart-ve-add-to-cart-ozelliginin-kaldirilmasi/feed/ 0